OLD | NEW |
1 <html> | 1 <html> |
2 <head> | 2 <head> |
3 <script src="../../../http/tests/inspector/inspector-test.js"></script> | 3 <script src="../../../http/tests/inspector/inspector-test.js"></script> |
4 <script src="../../../http/tests/inspector/elements-test.js"></script> | 4 <script src="../../../http/tests/inspector/elements-test.js"></script> |
5 <script> | 5 <script> |
6 function test() | 6 function test() |
7 { | 7 { |
8 var colors = [ | 8 var colors = [ |
9 // Each of these is red. Some may need to be clipped to [0, 255]. | 9 // Each of these is red. Some may need to be clipped to [0, 255]. |
10 'red', | 10 'red', |
11 '#F00', | 11 '#F00', |
| 12 '#F00F', |
| 13 '#FF0000', |
| 14 '#FF0000FF', |
12 'rgb(255,0,0)', | 15 'rgb(255,0,0)', |
13 'rgb(300,0,0)', // clipped to rgb(255,0,0) | 16 'rgb(300,0,0)', // clipped to rgb(255,0,0) |
14 'rgb(255,-10,0)', // clipped to rgb(255,0,0) | 17 'rgb(255,-10,0)', // clipped to rgb(255,0,0) |
15 'rgb(110%, 0%, 0%)', // clipped to rgb(100%,0%,0%) | 18 'rgb(110%, 0%, 0%)', // clipped to rgb(100%,0%,0%) |
16 | 19 |
17 // Each of these are valid | 20 // Each of these are valid |
18 'rgba(0,0,0,0.5)', | 21 'rgba(0,0,0,0.5)', |
19 'hsl(-120, 100%, 50%)', | 22 'hsl(-120, 100%, 50%)', |
20 'hsl(-120, 200%, 200%)', // clipped to hsl(240,100%,100%) | 23 'hsl(-120, 200%, 200%)', // clipped to hsl(240,100%,100%) |
21 'hsl(-120, -200%, -200%)', // clipped to hsl(240,100%,100%) | 24 'hsl(-120, -200%, -200%)', // clipped to hsl(240,100%,100%) |
22 'hsla(-120, -200%, -200%, -5)', // clipped to hsla(0,0%,0%,0) | 25 'hsla(-120, -200%, -200%, -5)', // clipped to hsla(0,0%,0%,0) |
23 'hsla(240,100%,50%,0.05)', | 26 'hsla(240,100%,50%,0.05)', |
24 'hsl(200.5,0%,50%)', | 27 'hsl(200.5,0%,50%)', |
25 'hsla(200,1.5%,50%,1)', | 28 'hsla(200,1.5%,50%,1)', |
26 'rgba(0,0,0,.5)', | 29 'rgba(0,0,0,.5)', |
27 'hsla(.5,.5%,.5%,.5)', | 30 'hsla(.5,.5%,.5%,.5)', |
28 'hsla(100.5,50.5%,50.5%,.5)', | 31 'hsla(100.5,50.5%,50.5%,.5)', |
29 | 32 |
30 // Each of these has their alpha clipped [0.0, 1.0]. | 33 // Each of these has their alpha clipped [0.0, 1.0]. |
31 'rgba(255, 0, 0, -5)', // clipped to rgba(255,0,0,0) | 34 'rgba(255, 0, 0, -5)', // clipped to rgba(255,0,0,0) |
32 'rgba(255, 0, 0, 5)', // clipped to rgba(255,0,0,1) | 35 'rgba(255, 0, 0, 5)', // clipped to rgba(255,0,0,1) |
33 ]; | 36 ]; |
34 | 37 |
35 var invalidColors = [ | 38 var invalidColors = [ |
36 // An invalid color, eg a value for a shorthand like 'border' which can
have a color | 39 // An invalid color, eg a value for a shorthand like 'border' which can
have a color |
37 'none', | 40 'none', |
38 '#0000', | |
39 '#00000', | 41 '#00000', |
40 '#ggg', | 42 '#ggg', |
41 'rgb(a,b,c)', | 43 'rgb(a,b,c)', |
42 'rgb(a,b,c,d)', | 44 'rgb(a,b,c,d)', |
43 'rgb(1,1,1.2)', | 45 'rgb(1,1,1.2)', |
44 'rgba(0,0,0,1%)', | 46 'rgba(0,0,0,1%)', |
45 'rgba(0,0,0,)', | 47 'rgba(0,0,0,)', |
46 'hsl(0,0,0)', | 48 'hsl(0,0,0)', |
47 'hsl(0%, 0%, 0%)', | 49 'hsl(0%, 0%, 0%)', |
48 'hsla(0,,0,1)', | 50 'hsla(0,,0,1)', |
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
91 var cf = WebInspector.Color.Format; | 93 var cf = WebInspector.Color.Format; |
92 for (var colorFormatKey in cf) { | 94 for (var colorFormatKey in cf) { |
93 var colorFormat = cf[colorFormatKey]; | 95 var colorFormat = cf[colorFormatKey]; |
94 // Simple colors do not have RGBA and HSLA representations. | 96 // Simple colors do not have RGBA and HSLA representations. |
95 if (!color.hasAlpha() && (colorFormat === cf.RGBA || colorFormat ===
cf.HSLA)) | 97 if (!color.hasAlpha() && (colorFormat === cf.RGBA || colorFormat ===
cf.HSLA)) |
96 continue; | 98 continue; |
97 // Advanced colors do not have HEX representations. | 99 // Advanced colors do not have HEX representations. |
98 if (color.hasAlpha() && (colorFormat === cf.ShortHEX || colorFormat
=== cf.HEX)) | 100 if (color.hasAlpha() && (colorFormat === cf.ShortHEX || colorFormat
=== cf.HEX)) |
99 continue; | 101 continue; |
100 // If there is no ShortHEX then skip it. | 102 // If there is no ShortHEX then skip it. |
101 if (colorFormat === cf.ShortHEX && !color.canBeShortHex()) | 103 if (colorFormat === cf.ShortHEX && color.detectHEXFormat() !== cf.Sh
ortHEX) |
102 continue; | 104 continue; |
103 // If there is no nickname, then skip it. | 105 // If there is no nickname, then skip it. |
104 if (colorFormat === cf.Nickname && !color.nickname()) | 106 if (colorFormat === cf.Nickname && !color.nickname()) |
105 continue; | 107 continue; |
106 InspectorTest.addResult(' ' + colorFormat + ": " + color.asString(c
olorFormat)); | 108 InspectorTest.addResult(' ' + colorFormat + ": " + color.asString(c
olorFormat)); |
107 } | 109 } |
108 } | 110 } |
109 } | 111 } |
110 </script> | 112 </script> |
111 </head> | 113 </head> |
112 | 114 |
113 <body onload="runTest()"> | 115 <body onload="runTest()"> |
114 <p> | 116 <p> |
115 Tests that the displayed string for colors correctly handles clipped CSS values
and RGB percentages. | 117 Tests that the displayed string for colors correctly handles clipped CSS values
and RGB percentages. |
116 </p> | 118 </p> |
117 | 119 |
118 </body> | 120 </body> |
119 </html> | 121 </html> |
OLD | NEW |