OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <body> | 3 <body> |
4 <script src="../js/resources/js-test-pre.js"></script> | 4 <script src="../js/resources/js-test-pre.js"></script> |
5 | 5 |
6 <div id="detector"></div> | 6 <div id="detector"></div> |
7 | 7 |
8 <style> | 8 <style> |
9 #detector { width: 100px; } | 9 #detector { width: 100px; } |
10 @media (resolution: 1.00dppx) { #detector { width: 10px; } } | 10 @media (resolution: 1.00dppx) { #detector { width: 10px; } } |
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
42 | 42 |
43 function appendMediaRule(rule) { | 43 function appendMediaRule(rule) { |
44 var lastStyleSheet = document.styleSheets[document.styleSheets.lengt
h - 1]; | 44 var lastStyleSheet = document.styleSheets[document.styleSheets.lengt
h - 1]; |
45 lastStyleSheet.insertRule(rule, lastStyleSheet.cssRules.length); | 45 lastStyleSheet.insertRule(rule, lastStyleSheet.cssRules.length); |
46 } | 46 } |
47 | 47 |
48 shouldBe("matchMedia('(resolution: 0dpi)').matches", "false"); | 48 shouldBe("matchMedia('(resolution: 0dpi)').matches", "false"); |
49 shouldBe("matchMedia('(min-resolution: 0dpi)').matches", "false"); | 49 shouldBe("matchMedia('(min-resolution: 0dpi)').matches", "false"); |
50 shouldBe("matchMedia('(max-resolution: 0dpi)').matches", "false"); | 50 shouldBe("matchMedia('(max-resolution: 0dpi)').matches", "false"); |
51 | 51 |
52 window.internals.settings.setResolutionOverride(144, 144); | 52 window.internals.setDeviceScaleFactor(1.5) |
53 shouldBe("matchMedia('(resolution: 1.5dppx)').matches", "true"); | 53 shouldBe("matchMedia('(resolution: 1.5dppx)').matches", "true"); |
54 shouldBe("resolutionFromStyle()", "1.5"); | 54 shouldBe("resolutionFromStyle()", "1.5"); |
55 | 55 |
56 window.internals.settings.setResolutionOverride(192, 192); | 56 window.internals.setDeviceScaleFactor(2); |
57 shouldBe("matchMedia('(resolution: 2dppx)').matches", "true"); | 57 shouldBe("matchMedia('(resolution: 2dppx)').matches", "true"); |
58 shouldBe("resolutionFromStyle()", "2"); | 58 shouldBe("resolutionFromStyle()", "2"); |
59 | 59 |
60 window.internals.settings.setResolutionOverride(96, 96); | 60 window.internals.setDeviceScaleFactor(1); |
61 shouldBe("matchMedia('(resolution: 1dppx)').matches", "true"); | 61 shouldBe("matchMedia('(resolution: 1dppx)').matches", "true"); |
62 shouldBe("resolutionFromStyle()", "1"); | 62 shouldBe("resolutionFromStyle()", "1"); |
63 | 63 |
64 window.internals.settings.setResolutionOverride(216, 216); | 64 window.internals.setDeviceScaleFactor(2.25); |
65 shouldBe("matchMedia('(resolution: 2.25dppx)').matches", "true"); | 65 shouldBe("matchMedia('(resolution: 2.25dppx)').matches", "true"); |
66 shouldBe("resolutionFromStyle()", "2.25"); | 66 shouldBe("resolutionFromStyle()", "2.25"); |
67 shouldBe("matchMedia('(resolution)').matches", "true"); | 67 shouldBe("matchMedia('(resolution)').matches", "true"); |
68 shouldBe("matchMedia('(resolution: 216dpi)').matches", "true"); | 68 shouldBe("matchMedia('(resolution: 216dpi)').matches", "true"); |
69 shouldBe("matchMedia('(min-resolution: 216dpi)').matches", "true"); | 69 shouldBe("matchMedia('(min-resolution: 216dpi)').matches", "true"); |
70 shouldBe("matchMedia('(max-resolution: 216dpi)').matches", "true"); | 70 shouldBe("matchMedia('(max-resolution: 216dpi)').matches", "true"); |
71 | 71 |
72 shouldBe("matchMedia('(resolution: 85dpcm)').matches", "true"); | 72 shouldBe("matchMedia('(resolution: 85dpcm)').matches", "true"); |
73 shouldBe("matchMedia('(min-resolution: 85dpcm)').matches", "true"); | 73 shouldBe("matchMedia('(min-resolution: 85dpcm)').matches", "true"); |
74 shouldBe("matchMedia('(max-resolution: 85dpcm)').matches", "true"); | 74 shouldBe("matchMedia('(max-resolution: 85dpcm)').matches", "true"); |
75 | 75 |
76 window.internals.settings.setResolutionOverride(216, 254); | |
77 // Non-square must never match. | |
78 shouldBe("matchMedia('(resolution)').matches", "false"); | |
79 shouldBe("matchMedia('(resolution: 216dpi)').matches", "false"); | |
80 shouldBe("matchMedia('(resolution: 254dpi)').matches", "false"); | |
81 | |
82 shouldBe("matchMedia('(min-resolution: 216dpi)').matches", "true"); | |
83 shouldBe("matchMedia('(min-resolution: 254dpi)').matches", "false"); | |
84 shouldBe("matchMedia('(max-resolution: 216dpi)').matches", "false"); | |
85 shouldBe("matchMedia('(max-resolution: 254dpi)').matches", "true"); | |
86 | |
87 // Non-square must never match. | |
88 shouldBe("matchMedia('(resolution: 85dpcm)').matches", "false"); | |
89 shouldBe("matchMedia('(resolution: 100dpcm)').matches", "false"); | |
90 | |
91 shouldBe("matchMedia('(min-resolution: 85dpcm)').matches", "true"); | |
92 shouldBe("matchMedia('(min-resolution: 100dpcm)').matches", "false"); | |
93 shouldBe("matchMedia('(max-resolution: 85dpcm)').matches", "false"); | |
94 shouldBe("matchMedia('(max-resolution: 100dpcm)').matches", "true"); | |
95 | |
96 // Test printing. | 76 // Test printing. |
97 | 77 |
98 window.internals.settings.setMediaTypeOverride("print"); | 78 window.internals.settings.setMediaTypeOverride("print"); |
99 shouldBe("matchMedia('(min-resolution: 300dpi)').matches", "true"); | 79 shouldBe("matchMedia('(min-resolution: 300dpi)').matches", "true"); |
100 shouldBe("matchMedia('(min-resolution: 118dpcm)').matches", "true"); | 80 shouldBe("matchMedia('(min-resolution: 118dpcm)').matches", "true"); |
101 | 81 |
102 // Should match the one requiring 'print' media type. | 82 // Should match the one requiring 'print' media type. |
103 shouldBe("resolutionFromStyle()", "3"); | 83 shouldBe("resolutionFromStyle()", "3"); |
104 | 84 |
105 // As well as those matching 'all'. | 85 // As well as those matching 'all'. |
106 appendMediaRule("@media (resolution: 3.125dppx) { #detector { width: 31p
x; } }"); | 86 appendMediaRule("@media (resolution: 3.125dppx) { #detector { width: 31p
x; } }"); |
107 shouldBe("resolutionFromStyle()", "3.125"); | 87 shouldBe("resolutionFromStyle()", "3.125"); |
108 } | 88 } |
109 </script> | 89 </script> |
110 | 90 |
111 <script src="../js/resources/js-test-post.js"></script> | 91 <script src="../js/resources/js-test-post.js"></script> |
112 </body> | 92 </body> |
113 </html> | 93 </html> |
OLD | NEW |