Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(678)

Side by Side Diff: LayoutTests/fast/forms/reportValidity-handler-updates-dom.html

Issue 660783002: Implement reportValidity() (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Pull Created 6 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
2 <html> 2 <html>
3 <head> 3 <head>
4 <script src="../../resources/js-test.js"></script> 4 <script src="../../resources/js-test.js"></script>
5 <style>
6 :focus { background: rgb(0, 255, 0); }
7 :not(:focus) { background: rgb(255, 0, 0); }
8 </style>
5 </head> 9 </head>
6 <body> 10 <body>
7 <p id="description"></p> 11 <p id="description"></p>
8 <div id="console"></div> 12 <div id="console"></div>
9 <script> 13 <script>
10 description('HTMLFormElement::checkValidity() with cases that event handlers cal led by checkValidity() updates DOM structure.') 14 function backgroundOf(id) {
15 return document.defaultView.getComputedStyle(document.getElementById(id), nu ll).getPropertyValue('background-color');
16 }
17 var unfocusedColor = 'rgb(255, 0, 0)';
18 var focusedColor = 'rgb(0, 255, 0)';
19
20 description('HTMLFormElement::reportValidity() with cases that event handlers ca lled by reportValidity() updates DOM structure.')
11 21
12 var parent = document.createElement('div'); 22 var parent = document.createElement('div');
13 document.body.appendChild(parent); 23 document.body.appendChild(parent);
14 24
15 // ---------------------------------------------------------------- 25 // ----------------------------------------------------------------
16 debug('The target form is removed.'); 26 debug('The target form is removed.');
17 parent.innerHTML = '<form id=f1><input name=i id=i required></form>'; 27 parent.innerHTML = '<form id=f1><input name=i id=i required></form>';
18 var handler = function(event) { 28 var handler = function(event) {
19 parent.innerHTML = ''; 29 parent.innerHTML = '';
20 }; 30 };
21 document.getElementById('i').addEventListener('invalid', handler, false); 31 document.getElementById('i').addEventListener('invalid', handler, false);
22 // The specificiation doesn't define the behavior in this case. 32 // The specificiation doesn't define the behavior in this case.
23 // It's ok if WebKit doesn't crash. 33 // It's ok if WebKit doesn't crash.
24 shouldBeFalse('document.getElementById("f1").checkValidity()'); 34 shouldBeFalse('document.getElementById("f1").reportValidity()');
25 35
26 // ---------------------------------------------------------------- 36 // ----------------------------------------------------------------
27 debug(''); 37 debug('');
28 debug('A control to be checked is removed.'); 38 debug('A control to be checked is removed.');
29 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required><input name=i2 id= i2 required></form>'; 39 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required><input name=i2 id= i2 required></form>';
30 var handler1 = function(event) { 40 var handler1 = function(event) {
31 document.getElementById('f1').removeChild(document.getElementById('i2')); 41 document.getElementById('f1').removeChild(document.getElementById('i2'));
32 }; 42 };
33 document.getElementById('i1').addEventListener('invalid', handler1, false); 43 document.getElementById('i1').addEventListener('invalid', handler1, false);
34 var handler2Called = false; 44 var handler2Called = false;
35 var handler2 = function(event) { 45 var handler2 = function(event) {
36 handler2Called = true; 46 handler2Called = true;
37 }; 47 };
38 document.getElementById('i2').addEventListener('invalid', handler2, false); 48 document.getElementById('i2').addEventListener('invalid', handler2, false);
39 shouldBeFalse('document.getElementById("f1").checkValidity()'); 49 shouldBeFalse('document.getElementById("f1").reportValidity()');
40 // If the node was removed from the form, i2.checkValidity() is called, but an 50 // If the node was removed from the form, i2.checkValidity() is called, but an
41 // invalid event is not fired because it is not in any documents. 51 // invalid event is not fired because it is not in any documents.
42 shouldBeFalse('handler2Called'); 52 shouldBeFalse('handler2Called');
53 shouldBe('backgroundOf("i1")', 'focusedColor');
43 54
44 // ---------------------------------------------------------------- 55 // ----------------------------------------------------------------
45 debug(''); 56 debug('');
57 debug('A control that was checked was removed.');
58 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required><input name=i2 id= i2 required></form>';
59 var handler1 = function(event) {
60 document.getElementById('f1').removeChild(document.getElementById('i1'));
61 };
62 document.getElementById('i1').addEventListener('invalid', handler1, false);
63 var handler2Called = false;
64 var handler2 = function(event) {
65 handler2Called = true;
66 };
67 document.getElementById('i2').addEventListener('invalid', handler2, false);
68 shouldBeFalse('document.getElementById("f1").reportValidity()');
69 shouldBeTrue('handler2Called');
70 shouldBe('backgroundOf("i2")', 'focusedColor');
71
72 // ----------------------------------------------------------------
73 debug('');
46 debug('A new control is added.'); 74 debug('A new control is added.');
47 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required></form>'; 75 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required></form>';
48 handler2Called = false; 76 handler2Called = false;
49 handler2 = function(event) { 77 handler2 = function(event) {
50 handler2Called = true; 78 handler2Called = true;
51 }; 79 };
52 handler1 = function(event) { 80 handler1 = function(event) {
53 var input = document.createElement('input'); 81 var input = document.createElement('input');
54 input.name = 'i2'; 82 input.name = 'i2';
55 input.required = true; 83 input.required = true;
56 input.addEventListener('invalid', handler2, false); 84 input.addEventListener('invalid', handler2, false);
57 document.getElementById('f1').appendChild(input); 85 document.getElementById('f1').appendChild(input);
58 }; 86 };
59 document.getElementById('i1').addEventListener('invalid', handler1, false); 87 document.getElementById('i1').addEventListener('invalid', handler1, false);
60 shouldBeFalse('document.getElementById("f1").checkValidity()'); 88 shouldBeFalse('document.getElementById("f1").reportValidity()');
61 // If a new node is added to the form, checkValidity() doesn't handle it. 89 // If a new node is added to the form, reportValidity() doesn't handle it.
62 shouldBeFalse('handler2Called'); 90 shouldBeFalse('handler2Called');
91 shouldBe('backgroundOf("i1")', 'focusedColor');
63 92
64 // ---------------------------------------------------------------- 93 // ----------------------------------------------------------------
65 debug(''); 94 debug('');
66 debug('A control is moved to another form.'); 95 debug('A control is moved to another form.');
67 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required><input name=i2 id= i2 required></form>' 96 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required><input name=i2 id= i2 required></form>'
68 + '<form id=f2></form>'; 97 + '<form id=f2></form>';
69 handler1 = function(event) { 98 handler1 = function(event) {
70 document.getElementById('f2').appendChild(document.getElementById('i2')); 99 document.getElementById('f2').appendChild(document.getElementById('i2'));
71 }; 100 };
72 document.getElementById('i1').addEventListener('invalid', handler1, false); 101 document.getElementById('i1').addEventListener('invalid', handler1, false);
73 handler2Called = false; 102 handler2Called = false;
74 handler2 = function(event) { 103 handler2 = function(event) {
75 handler2Called = true; 104 handler2Called = true;
76 }; 105 };
77 document.getElementById('i2').addEventListener('invalid', handler2, false); 106 document.getElementById('i2').addEventListener('invalid', handler2, false);
78 shouldBeFalse('document.getElementById("f1").checkValidity()'); 107 shouldBeFalse('document.getElementById("f1").reportValidity()');
79 // The moved control is not checked. 108 // The moved control is not checked.
80 shouldBeFalse('handler2Called'); 109 shouldBeFalse('handler2Called');
110 shouldBe('backgroundOf("i1")', 'focusedColor');
81 111
82 // ---------------------------------------------------------------- 112 // ----------------------------------------------------------------
83 debug(''); 113 debug('');
84 debug('A control is moved to another document.'); 114 debug('A control is moved to another document.');
85 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required></form>'; 115 parent.innerHTML = '<form id=f1><input name=i1 id=i1 required></form>';
86 var doc2 = document.implementation.createHTMLDocument(); 116 var doc2 = document.implementation.createHTMLDocument();
87 handler1 = function(event) { 117 handler1 = function(event) {
88 doc2.body.appendChild(doc2.adoptNode(document.getElementById('i1'))); 118 doc2.body.appendChild(doc2.adoptNode(document.getElementById('i1')));
89 }; 119 };
90 document.getElementById('i1').addEventListener('invalid', handler1, false); 120 document.getElementById('i1').addEventListener('invalid', handler1, false);
91 // i1 is not listed in 'unhandled invalid controls' because it was moved to 121 // i1 is not listed in 'unhandled invalid controls' because it was moved to
92 // another document. 122 // another document.
93 shouldBeTrue('document.getElementById("f1").checkValidity()'); 123 shouldBeTrue('document.getElementById("f1").reportValidity()');
94 124
95 parent.innerHTML = ''; 125 parent.innerHTML = '';
96 </script> 126 </script>
97 </body> 127 </body>
98 </html> 128 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698