form-serialize-js/build/es/src/__tests__/formSerializeTest.mjs

Serialize form fields to submit through ajax

import { expect } from "chai";
import formSerialize from "../index.mjs";
describe("Test formSerialize", function () {
  it("simple test", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"text\" name=\"foo\" value=\"bar\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: "bar"
    });
  });
});
describe("Test formSerialize arrayMode", function () {
  it("auto", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo\" value=\"bar1\">\n        <input type=\"checkbox\" checked name=\"foo\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: ["bar1", "bar2"]
    });
  });
  it("[] in auto mode with two items", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      "foo[]": ["bar1", "bar2"]
    });
  });
  it("[] in auto mode with one items", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      "foo[]": "bar1"
    });
  });
  it("arrayKey with one item", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, "arrayKey")).to.deep.equal({
      foo: ["bar1"]
    });
  });
  it("arrayKey with two items", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, "arrayKey")).to.deep.equal({
      foo: ["bar1", "bar2"]
    });
  });
  it("arrayKeyKeep with two items", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, "arrayKeyKeep")).to.deep.equal({
      "foo[]": ["bar1", "bar2"]
    });
  });
  it("none array mode", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar1\">\n        <input type=\"checkbox\" checked name=\"foo[]\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, false)).to.deep.equal({
      "foo[]": "bar2"
    });
  });
  it("input with same key", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"text\" checked name=\"foo\" value=\"bar1\">\n        <input type=\"text\" checked name=\"foo\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: ["bar1", "bar2"]
    });
  });
  it("input with []", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"text\" checked name=\"foo[]\" value=\"bar1\">\n        <input type=\"text\" checked name=\"foo[]\" value=\"bar2\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      "foo[]": ["bar1", "bar2"]
    });
  });
});
describe("Test formSerialize with multi select", function () {
  it("with simple", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n      <select name=\"foo\" multiple>\n        <option selected value=\"bar1\">foo-bar1</option>\n        <option selected value=\"bar2\">foo-bar2</option>\n        <option value=\"bar3\">foo-bar3</option>\n      </select>\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: ["bar1", "bar2"]
    });
  });
  it("text only", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n      <select name=\"foo\" multiple>\n        <option selected>bar1</option>\n        <option selected>bar2</option>\n        <option>bar3</option>\n      </select>\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: ["bar1", "bar2"]
    });
  });
  it("one item with arrayKey", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n      <select name=\"foo\" multiple>\n        <option selected>bar1</option>\n      </select>\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: "bar1"
    });
  });
  it("one item", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n      <select name=\"foo[]\" multiple>\n        <option selected>bar1</option>\n      </select>\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, "arrayKey")).to.deep.equal({
      foo: ["bar1"]
    });
  });
  it("arrayKeyKeep", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n      <select name=\"foo[]\" multiple>\n        <option selected>bar1</option>\n      </select>\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm, "arrayKeyKeep")).to.deep.equal({
      "foo[]": ["bar1"]
    });
  });
});
describe("Test formSerialize with checkbox", function () {
  it("data-checked-to-value", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input type=\"checkbox\" checked name=\"foo\" value=\"\">\n        <input type=\"checkbox\" checked name=\"foo1\" >\n        <input type=\"checkbox\" checked name=\"foo2\" value=\"1\">\n        <input type=\"checkbox\" checked name=\"foo3\" data-boolean=\"true\">\n        <input type=\"checkbox\" checked name=\"foo4\" data-boolean=\"true\" value=\"1\">\n        <input type=\"checkbox\" checked name=\"foo5\" data-boolean=\"true\" value=\"true\">\n        <input type=\"checkbox\" checked name=\"foo6\" data-boolean=\"true\" value=\"false\">\n        <input type=\"checkbox\" checked name=\"foo7\" data-boolean=\"true\" value=\"null\">\n        <input type=\"checkbox\" checked name=\"foo8\" data-boolean=\"true\" value=\"0\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: "",
      foo1: "on",
      foo2: "1",
      foo3: true,
      foo4: true,
      foo5: true,
      foo6: false,
      foo7: false,
      foo8: false
    });
  });
  it("get value 0", function () {
    var body = document.body;
    body.innerHTML = "\n      <form>\n        <input name=\"foo\" value=\"0\">\n      </form>\n    ";
    var fm = document.getElementsByTagName("form")[0];
    expect(formSerialize(fm)).to.deep.equal({
      foo: "0"
    });
  });
});