JS Test Harness: Insert the stylesheet dynamically
[WebKit-https.git] / LayoutTests / fast / forms / input-number-unacceptable-style.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../../fast/js/resources/js-test-pre.js"></script>
5 <style>
6 :invalid {
7   background-color: #ff0000;
8 }
9 </style>
10 </head>
11 <body>
12 <p id="description"></p>
13 <div id="console"></div>
14 <div id=parent>
15 <input type=number id=number>
16 <input id=another>
17 </div>
18 <script>
19 description('A number input fields with an unacceptable string should have :invalid style.');
20
21 function colorOf(el) {
22     return document.defaultView.getComputedStyle(el, null).getPropertyValue('background-color');
23 }
24 var invalidStyleColor = 'rgb(255, 0, 0)';
25
26 var number = document.getElementById('number');
27 number.focus();
28 debug('Initial state. The elment has no value.');
29 shouldBeTrue('colorOf(number) != invalidStyleColor');
30
31 debug("Type '-'. The renderer value becomes unacceptable.");
32 document.execCommand('InsertText', false, '-');
33 shouldBe('colorOf(number)', 'invalidStyleColor');
34 shouldBeTrue('number.validity.valid');
35
36 debug("Type '1' additionally. The renderer value becomes acceptable.");
37 document.execCommand('InsertText', false, '1');
38 shouldBeTrue('colorOf(number) != invalidStyleColor');
39
40 debug("Type 'a' additionally. The renderer value becomes unacceptable again.");
41 document.execCommand('InsertText', false, 'a');
42 shouldBe('colorOf(number)', 'invalidStyleColor');
43
44 debug("The element losts focus. The unacceptable value should be purged and the style should be normal.");
45 document.getElementById('another').focus();
46 shouldBeTrue('colorOf(number) != invalidStyleColor');
47 // Visiblue value is not '-1a'.
48 number.focus();
49 document.execCommand('SelectAll');
50 shouldBe('document.getSelection().toString()', '"-1"');
51
52 document.getElementById('parent').innerHTML = '';
53 var successfullyParsed = true;
54 </script>
55 <script src="../../fast/js/resources/js-test-post.js"></script>
56 </body>
57 </html>