third_party/WebKit/LayoutTests/fast/forms/update-form-attribute-element.html

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <p id="description"></p>
   8 <div id="console"></div>
   9
  10 <div id="test" style="display:none;"></div>
  11
  12 <script>
  13 description('Test for the datalist element.');
  14
  15 var testElement = document.getElementById("test");
  16
  17 function createForm(id) {
  18     var form = document.createElement("form");
  19     form.id = id;
  20     testElement.appendChild(form);
  21     return form;
  22 };
  23
  24 function createInput(form) {
  25     var input = document.createElement("input");
  26     input.setAttribute("form", form);
  27     testElement.appendChild(input);
  28     return input;
  29 };
  30
  31 function test1() {
  32     debug("Test 1: Insert new input after form.");
  33     form = createForm("test1");
  34     input = createInput("test1");
  35     shouldBe('form.elements.length', '1');
  36     shouldBe('form.elements[0]', 'input');
  37 };
  38
  39 function test2() {
  40     debug("Test 2: Insert two forms with same id.");
  41     input = createInput("test2");
  42     form1 = createForm("test2");
  43     form2 = createForm("test2");
  44     shouldBe('form1.elements.length', '1');
  45     shouldBe('form2.elements.length', '0');
  46     shouldBe('form1.elements[0]', 'input');
  47 };
  48
  49 function test3() {
  50     debug("Test 3: Change form id.");
  51     form = createForm("test3-1");
  52     input = createInput("test3-2");
  53     form.id = "test3-2";
  54     shouldBe('form.elements.length', '1');
  55     shouldBe('form.elements[0]', 'input');
  56 };
  57
  58 function test4() {
  59     debug("Test 4: Order.");
  60     input1 = createInput("test4");
  61     input2 = createInput("test4");
  62     form = createForm("test4");
  63     input3 = document.createElement("input");
  64     form.appendChild(input3);
  65     input4 = createInput("test4");
  66     input5 = createInput("test4");
  67
  68     shouldBe('form.elements.length', '5');
  69     shouldBe('form.elements[0]', 'input1');
  70     shouldBe('form.elements[1]', 'input2');
  71     shouldBe('form.elements[2]', 'input3');
  72     shouldBe('form.elements[3]', 'input4');
  73     shouldBe('form.elements[4]', 'input5');
  74
  75     input2.setAttribute("form", "");
  76     shouldBe('form.elements.length', '4');
  77     shouldBe('form.elements[0]', 'input1');
  78     shouldBe('form.elements[1]', 'input3');
  79     shouldBe('form.elements[2]', 'input4');
  80     shouldBe('form.elements[3]', 'input5');
  81 };
  82
  83 function test5() {
  84     debug("Test 5: Add new element with form attribute to the form.");
  85     form = document.createElement("form");
  86     form.id = "test5";
  87     form.innerHTML = "<textarea id=\"test5-input1\"></textarea><input form=test5 id=\"test5-input2\"><select id=\"test5-input3\">";
  88     test.appendChild(form);
  89     input1 = document.getElementById("test5-input1");
  90     input2 = document.getElementById("test5-input2");
  91     input3 = document.getElementById("test5-input3");
  92     shouldBe('form.elements.length', '3');
  93     shouldBe('form.elements[0]', 'input1');
  94     shouldBe('form.elements[1]', 'input2');
  95     shouldBe('form.elements[2]', 'input3');
  96 };
  97
  98 test1();
  99 test2();
 100 test3();
 101 test4();
 102 test5();
 103
 104 </script>
 105 </body>
 106 </html>