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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/forms/form-pseudo-valid-style.html

Issue 658063002: Fix the issue where checking a form for :valid/:invalid would trigger invalid events for its elemen… (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Pull + small style fixes 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
« no previous file with comments | « no previous file | LayoutTests/fast/forms/form-pseudo-valid-style-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
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> 5 <style>
6 :invalid { background: rgb(255, 0, 0); } 6 :invalid { background: rgb(255, 0, 0); }
7 :valid { background: rgb(0, 255, 0); } 7 :valid { background: rgb(0, 255, 0); }
8 form:invalid input[type=submit] { background-color: rgb(127, 0, 0); } 8 form:invalid input[type=submit] { background-color: rgb(127, 0, 0); }
9 form:valid input[type=submit] { background-color: rgb(0, 127, 0); } 9 form:valid input[type=submit] { background-color: rgb(0, 127, 0); }
10 </style> 10 </style>
(...skipping 12 matching lines...) Expand all
23 23
24 var invalidColor = 'rgb(255, 0, 0)'; 24 var invalidColor = 'rgb(255, 0, 0)';
25 var validColor = 'rgb(0, 255, 0)'; 25 var validColor = 'rgb(0, 255, 0)';
26 var subInvalidColor = 'rgb(127, 0, 0)'; 26 var subInvalidColor = 'rgb(127, 0, 0)';
27 var subValidColor = 'rgb(0, 127, 0)'; 27 var subValidColor = 'rgb(0, 127, 0)';
28 28
29 var parent = document.createElement('div'); 29 var parent = document.createElement('div');
30 document.body.appendChild(parent); 30 document.body.appendChild(parent);
31 31
32 debug('Removing and adding required text inputs and modifying ther value by a DO M tree mutation:'); 32 debug('Removing and adding required text inputs and modifying ther value by a DO M tree mutation:');
33 parent.innerHTML = '<form id=form1><input type=text id=input1 required><input ty pe=text id=input2 required value="a"><input type=submit id=sub1></form>'; 33 parent.innerHTML = '<form id=form1><input type=text id=input1 required><input ty pe=text id=input2 required value=a><input type=submit id=sub1></form>';
34 var form1 = $('form1'); 34 var form1 = $('form1');
35 var input1 = $('input1'); 35 var input1 = $('input1');
36 var input2 = $('input2'); 36 var input2 = $('input2');
37 var sub1 = $('sub1'); 37 var sub1 = $('sub1');
38 shouldBe('backgroundOf(form1)', 'invalidColor'); 38 shouldBe('backgroundOf(form1)', 'invalidColor');
39 shouldBe('backgroundOf(sub1)', 'subInvalidColor'); 39 shouldBe('backgroundOf(sub1)', 'subInvalidColor');
40 shouldBe('form1.removeChild(input1); backgroundOf(form1)', 'validColor'); 40 shouldBe('form1.removeChild(input1); backgroundOf(form1)', 'validColor');
41 shouldBe('backgroundOf(sub1)', 'subValidColor'); 41 shouldBe('backgroundOf(sub1)', 'subValidColor');
42 shouldBe('form1.appendChild(input1); backgroundOf(form1)', 'invalidColor'); 42 shouldBe('form1.appendChild(input1); backgroundOf(form1)', 'invalidColor');
43 shouldBe('backgroundOf(sub1)', 'subInvalidColor'); 43 shouldBe('backgroundOf(sub1)', 'subInvalidColor');
44 shouldBe('input1.setAttribute("value", "a"); backgroundOf(form1)', 'validColor') ; 44 shouldBe('input1.setAttribute("value", "a"); backgroundOf(form1)', 'validColor') ;
45 shouldBe('backgroundOf(sub1)', 'subValidColor'); 45 shouldBe('backgroundOf(sub1)', 'subValidColor');
46 shouldBe('input2.setAttribute("value", ""); backgroundOf(form1)', 'invalidColor' ); 46 shouldBe('input2.setAttribute("value", ""); backgroundOf(form1)', 'invalidColor' );
47 shouldBe('backgroundOf(sub1)', 'subInvalidColor'); 47 shouldBe('backgroundOf(sub1)', 'subInvalidColor');
48 debug('') 48 debug('')
49 49
50 debug('Adding a required text input that is not a direct child of the form:'); 50 debug('Adding a required text input that is not a direct child of the form:');
51 parent.innerHTML = '<form id=form1></form>'; 51 parent.innerHTML = '<form id=form1></form>';
52 var form1 = $('form1'); 52 var form1 = $('form1');
53 shouldBe('backgroundOf(form1)', 'validColor'); 53 shouldBe('backgroundOf(form1)', 'validColor');
54 var div1 = document.createElement('div'); 54 var div1 = document.createElement('div');
55 var input1 = document.createElement('input'); 55 var input1 = document.createElement('input');
56 input1.setAttribute('type', 'text'); 56 input1.setAttribute('type', 'text');
57 input1.setAttribute('required', ''); 57 input1.setAttribute('required', '');
58 form1.appendChild(div1); 58 form1.appendChild(div1);
59 shouldBe('div1.appendChild(input1); backgroundOf(form1)', 'invalidColor'); 59 shouldBe('div1.appendChild(input1); backgroundOf(form1)', 'invalidColor');
60 debug(''); 60 debug('');
61 61
62 debug('Render multiple forms and move an invalid input from one to another:'); 62 debug('Render multiple forms and reassign an invalid input from one to another:' );
63 parent.innerHTML = '<form id=form1><input type=text id=input1 required><input ty pe=text id=input2 required value="a"></form>' 63 parent.innerHTML = '<form id=form1><input type=text id=input1 required><input ty pe=text id=input2 required value="a"></form>'
64 + '<form id=form2><input type=text id=input3><input type=text id=input4 requ ired value="a"></form>' 64 + '<form id=form2><input type=text id=input3><input type=text id=input4 requ ired value="a"></form>'
65 + '<form id=form3></form>'; 65 + '<form id=form3></form>';
66 shouldBe('backgroundOf($("form1"))', 'invalidColor'); 66 shouldBe('backgroundOf($("form1"))', 'invalidColor');
67 shouldBe('backgroundOf($("form2"))', 'validColor'); 67 shouldBe('backgroundOf($("form2"))', 'validColor');
68 shouldBe('backgroundOf($("form3"))', 'validColor'); 68 shouldBe('backgroundOf($("form3"))', 'validColor');
69 var input1 = $('input1'); 69 var input1 = $('input1');
70 var form1 = $('form1');
71 var form3 = $('form3');
72 input1.setAttribute("form", "form3"); 70 input1.setAttribute("form", "form3");
73 shouldBe('backgroundOf($("form1"))', 'validColor'); 71 shouldBe('backgroundOf($("form1"))', 'validColor');
74 shouldBe('backgroundOf($("form3"))', 'invalidColor'); 72 shouldBe('backgroundOf($("form3"))', 'invalidColor');
75 debug(''); 73 debug('');
76 74
75 debug('Ensure that invalid event was not triggered on style evaluation:');
76 var val = '0';
77 parent.innerHTML = '<form id=form1><input type=text id=input1 required oninvalid ="val=\'1\';"></form>';
78 var form1 = $('form1');
79 shouldBe('backgroundOf(form1)', 'invalidColor');
80 shouldBeEqualToString('val', '0');
81 shouldBeEqualToString('form1.checkValidity(); val', '1');
82 debug('');
83
77 parent.innerHTML = ''; 84 parent.innerHTML = '';
78 </script> 85 </script>
79 </body> 86 </body>
80 </html> 87 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/forms/form-pseudo-valid-style-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698