Title: [282357] trunk
Revision
282357
Author
gsnedd...@apple.com
Date
2021-09-13 14:13:49 -0700 (Mon, 13 Sep 2021)

Log Message

Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
https://bugs.webkit.org/show_bug.cgi?id=229776

Reviewed by Simon Fraser.

.:

* Source/cmake/OptionsFTW.cmake:
* Source/cmake/WebKitFeatures.cmake:

LayoutTests/imported/w3c:

Rebaseline now resolution is supported when running tests

* web-platform-tests/css/mediaqueries/test_media_queries-expected.txt:

Source/WebCore:

No new tests, unskipped & rebaselined existing tests.

* css/CSSUnits.cpp:
(WebCore::canonicalUnitTypeForCategory):
* css/MediaList.cpp:
Fix compilation with resolution enabled.
(WebCore::addResolutionWarningMessageToConsole):
Simplify code generating message.
(WebCore::reportMediaQueryWarningIfNeeded):
* css/MediaList.h:
(WebCore::reportMediaQueryWarningIfNeeded): Deleted.
* css/MediaQueryEvaluator.cpp:
(WebCore::resolutionEvaluate):

Source/WTF:

* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add ResolutionMediaFeatureEnabled

LayoutTests:

* fast/media/mq-resolution-expected.txt:
* fast/media/mq-resolution.html: Use the backing scale-factor, not zoom
* platform/gtk/TestExpectations:
* platform/ios/TestExpectations:
* platform/mac/TestExpectations:
* platform/win/TestExpectations:

Modified Paths

Diff

Modified: trunk/ChangeLog (282356 => 282357)


--- trunk/ChangeLog	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/ChangeLog	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,13 @@
+2021-09-13  Sam Sneddon  <gsnedd...@apple.com>
+
+        Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
+        https://bugs.webkit.org/show_bug.cgi?id=229776
+
+        Reviewed by Simon Fraser.
+
+        * Source/cmake/OptionsFTW.cmake:
+        * Source/cmake/WebKitFeatures.cmake:
+
 2021-09-11  Philippe Normand  <pnorm...@igalia.com>
 
         [GLIB] MediaSession is not enabled

Modified: trunk/LayoutTests/ChangeLog (282356 => 282357)


--- trunk/LayoutTests/ChangeLog	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/ChangeLog	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,17 @@
+2021-09-13  Sam Sneddon  <gsnedd...@apple.com>
+
+        Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
+        https://bugs.webkit.org/show_bug.cgi?id=229776
+
+        Reviewed by Simon Fraser.
+
+        * fast/media/mq-resolution-expected.txt:
+        * fast/media/mq-resolution.html: Use the backing scale-factor, not zoom
+        * platform/gtk/TestExpectations:
+        * platform/ios/TestExpectations:
+        * platform/mac/TestExpectations:
+        * platform/win/TestExpectations:
+
 2021-09-13  Simon Fraser  <simon.fra...@apple.com>
 
         Add the ability to show a flat list of the slowest 200 tests in the tests treemap viewer

Modified: trunk/LayoutTests/fast/media/mq-resolution-expected.txt (282356 => 282357)


--- trunk/LayoutTests/fast/media/mq-resolution-expected.txt	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/fast/media/mq-resolution-expected.txt	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,21 +1,9 @@
 CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 216dpi)
 CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 216dpi)
 CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 216dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 216dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 254dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 216dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 254dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 216dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 254dpi)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (resolution: 100dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 100dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 85dpcm)
-CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 100dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (resolution: 96dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 96dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 96dpcm)
 CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 300dpi)
 CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 118dpcm)
 CSS3 media query test: resolution query with dppx. Using style element, @media css rule.
@@ -38,22 +26,9 @@
 PASS matchMedia('(resolution: 216dpi)').matches is true
 PASS matchMedia('(min-resolution: 216dpi)').matches is true
 PASS matchMedia('(max-resolution: 216dpi)').matches is true
-PASS matchMedia('(resolution: 85dpcm)').matches is true
-PASS matchMedia('(min-resolution: 85dpcm)').matches is true
-PASS matchMedia('(max-resolution: 85dpcm)').matches is true
-PASS matchMedia('(resolution)').matches is false
-PASS matchMedia('(resolution: 216dpi)').matches is false
-PASS matchMedia('(resolution: 254dpi)').matches is false
-PASS matchMedia('(min-resolution: 216dpi)').matches is true
-PASS matchMedia('(min-resolution: 254dpi)').matches is false
-PASS matchMedia('(max-resolution: 216dpi)').matches is false
-PASS matchMedia('(max-resolution: 254dpi)').matches is true
-PASS matchMedia('(resolution: 85dpcm)').matches is false
-PASS matchMedia('(resolution: 100dpcm)').matches is false
-PASS matchMedia('(min-resolution: 85dpcm)').matches is true
-PASS matchMedia('(min-resolution: 100dpcm)').matches is false
-PASS matchMedia('(max-resolution: 85dpcm)').matches is false
-PASS matchMedia('(max-resolution: 100dpcm)').matches is true
+PASS matchMedia('(resolution: 96dpcm)').matches is true
+PASS matchMedia('(min-resolution: 96dpcm)').matches is true
+PASS matchMedia('(max-resolution: 96dpcm)').matches is true
 PASS matchMedia('(min-resolution: 300dpi)').matches is true
 PASS matchMedia('(min-resolution: 118dpcm)').matches is true
 PASS resolutionFromStyle() is 3

Modified: trunk/LayoutTests/fast/media/mq-resolution.html (282356 => 282357)


--- trunk/LayoutTests/fast/media/mq-resolution.html	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/fast/media/mq-resolution.html	2021-09-13 21:13:49 UTC (rev 282357)
@@ -19,7 +19,19 @@
 
     if (window.testRunner && window.internals) {
         window.testRunner.dumpAsText();
+        window.testRunner.waitUntilDone();
+        window.jsTestIsAsync = true;
 
+        function setBackingScaleFactorPromise(factor) {
+            return new Promise((resolve, reject) => {
+                try {
+                    testRunner.setBackingScaleFactor(factor, resolve);
+                } catch(e) {
+                    reject(e);
+                }
+            });
+        }
+
         function resolutionFromStyle() {
             var width = getComputedStyle(document.getElementById("detector")).width;
             switch (width) {
@@ -45,46 +57,49 @@
             lastStyleSheet.insertRule(rule, lastStyleSheet.cssRules.length);
         }
 
-        shouldBe("matchMedia('(resolution: 0dpi)').matches", "false");
-        shouldBe("matchMedia('(min-resolution: 0dpi)').matches", "false");
-        shouldBe("matchMedia('(max-resolution: 0dpi)').matches", "false");
+        (async function() {
+            shouldBe("matchMedia('(resolution: 0dpi)').matches", "false");
+            shouldBe("matchMedia('(min-resolution: 0dpi)').matches", "false");
+            shouldBe("matchMedia('(max-resolution: 0dpi)').matches", "false");
 
-        window.internals.setPageScaleFactor(1.5, 0, 0);
-        shouldBe("matchMedia('(resolution: 1.5dppx)').matches", "true");
-        shouldBe("resolutionFromStyle()", "1.5");
+            await setBackingScaleFactorPromise(1.5);
+            shouldBe("matchMedia('(resolution: 1.5dppx)').matches", "true");
+            shouldBe("resolutionFromStyle()", "1.5");
 
-        window.internals.setPageScaleFactor(2, 0, 0);
-        shouldBe("matchMedia('(resolution: 2dppx)').matches", "true");
-        shouldBe("resolutionFromStyle()", "2");
+            await setBackingScaleFactorPromise(2);
+            shouldBe("matchMedia('(resolution: 2dppx)').matches", "true");
+            shouldBe("resolutionFromStyle()", "2");
 
-        window.internals.setPageScaleFactor(1, 0, 0);
-        shouldBe("matchMedia('(resolution: 1dppx)').matches", "true");
-        shouldBe("resolutionFromStyle()", "1");
+            await setBackingScaleFactorPromise(1);
+            shouldBe("matchMedia('(resolution: 1dppx)').matches", "true");
+            shouldBe("resolutionFromStyle()", "1");
 
-        window.internals.setPageScaleFactor(2.25, 0, 0);
-        shouldBe("matchMedia('(resolution: 2.25dppx)').matches", "true");
-        shouldBe("resolutionFromStyle()", "2.25");
-        shouldBe("matchMedia('(resolution)').matches", "true");
-        shouldBe("matchMedia('(resolution: 216dpi)').matches", "true");
-        shouldBe("matchMedia('(min-resolution: 216dpi)').matches", "true");
-        shouldBe("matchMedia('(max-resolution: 216dpi)').matches", "true");
+            await setBackingScaleFactorPromise(2.25);
+            shouldBe("matchMedia('(resolution: 2.25dppx)').matches", "true");
+            shouldBe("resolutionFromStyle()", "2.25");
+            shouldBe("matchMedia('(resolution)').matches", "true");
+            shouldBe("matchMedia('(resolution: 216dpi)').matches", "true");
+            shouldBe("matchMedia('(min-resolution: 216dpi)').matches", "true");
+            shouldBe("matchMedia('(max-resolution: 216dpi)').matches", "true");
 
-        shouldBe("matchMedia('(resolution: 85dpcm)').matches", "true");
-        shouldBe("matchMedia('(min-resolution: 85dpcm)').matches", "true");
-        shouldBe("matchMedia('(max-resolution: 85dpcm)').matches", "true");
+            await setBackingScaleFactorPromise(2.54);  // use 2.54 to give us integral dpcm
+            shouldBe("matchMedia('(resolution: 96dpcm)').matches", "true");
+            shouldBe("matchMedia('(min-resolution: 96dpcm)').matches", "true");
+            shouldBe("matchMedia('(max-resolution: 96dpcm)').matches", "true");
 
-        // Test printing.
+            // Test printing.
 
-        window.internals.settings.setMediaTypeOverride("print");
-        shouldBe("matchMedia('(min-resolution: 300dpi)').matches", "true");
-        shouldBe("matchMedia('(min-resolution: 118dpcm)').matches", "true");
+            window.internals.settings.setMediaTypeOverride("print");
+            shouldBe("matchMedia('(min-resolution: 300dpi)').matches", "true");
+            shouldBe("matchMedia('(min-resolution: 118dpcm)').matches", "true");
 
-        // Should match the one requiring 'print' media type.
-        shouldBe("resolutionFromStyle()", "3");
+            // Should match the one requiring 'print' media type.
+            shouldBe("resolutionFromStyle()", "3");
 
-        // As well as those matching 'all'.
-        appendMediaRule("@media (resolution: 3.125dppx) { #detector { width: 31px; } }");
-        shouldBe("resolutionFromStyle()", "3.125");
+            // As well as those matching 'all'.
+            appendMediaRule("@media (resolution: 3.125dppx) { #detector { width: 31px; } }");
+            shouldBe("resolutionFromStyle()", "3.125");
+        })().then(() => finishJSTest());
     }
 </script>
 

Modified: trunk/LayoutTests/imported/w3c/ChangeLog (282356 => 282357)


--- trunk/LayoutTests/imported/w3c/ChangeLog	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/imported/w3c/ChangeLog	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,14 @@
+2021-09-13  Sam Sneddon  <gsnedd...@apple.com>
+
+        Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
+        https://bugs.webkit.org/show_bug.cgi?id=229776
+
+        Reviewed by Simon Fraser.
+
+        Rebaseline now resolution is supported when running tests
+
+        * web-platform-tests/css/mediaqueries/test_media_queries-expected.txt:
+
 2021-09-13  Johnson Zhou  <qiaosong_z...@apple.com>
 
         Addition of CSSNumericValue and subclasses. (CSS Typed OM)

Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/mediaqueries/test_media_queries-expected.txt (282356 => 282357)


--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/mediaqueries/test_media_queries-expected.txt	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/mediaqueries/test_media_queries-expected.txt	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,126 @@
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 3.4dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (resolution: 120dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 3.4dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 120dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 3.4dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 120dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 1dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 2dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 3dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 4dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 5dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 6dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 7dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 8dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 9dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 10dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 11dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 12dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 13dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 14dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 15dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 16dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 17dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 18dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 19dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 20dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 21dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 22dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 23dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 24dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 25dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 26dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 27dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 28dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 29dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 30dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 31dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 32dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 33dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 34dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 35dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 36dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 37dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 38dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 39dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 40dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 41dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 42dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 43dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 44dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 45dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 46dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 47dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 48dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 49dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 50dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 51dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 52dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 53dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 54dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 55dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 56dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 57dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 58dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 59dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 60dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 61dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 62dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 63dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 64dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 65dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 66dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 67dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 68dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 69dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 70dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 71dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 72dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 73dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 74dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 75dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 76dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 77dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 78dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 79dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 80dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 81dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 82dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 83dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 84dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 85dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 86dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 87dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 88dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 89dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 90dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 91dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 92dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 93dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 94dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 95dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (max-resolution: 96dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 96dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 96dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 97dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (resolution: 95dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 95dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: not all and (min-resolution: 95dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: not all and (min-resolution: 97dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query _expression_: (min-resolution: 97dpi)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (min-resolution: 37dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 39dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: (max-resolution: 37dpcm)
+CONSOLE MESSAGE: Consider using 'dppx' units instead of 'dpcm', as in CSS 'dpcm' means dots-per-CSS-centimeter, not dots-per-physical-centimeter, so does not correspond to the actual 'dpcm' of a screen. In media query _expression_: not all and (min-resolution: 39dpcm)
 CONSOLE MESSAGE: Error: assert_not_equals: overflow-block should be equivalent to not (overflow-block: none) got disallowed value false
 
 Harness Error (FAIL), message = Error: assert_not_equals: overflow-block should be equivalent to not (overflow-block: none) got disallowed value false
@@ -703,33 +826,33 @@
 PASS subtest_697
 PASS subtest_698
 PASS subtest_699
-FAIL find_resolution assert_false: expected false got true
+PASS find_resolution
 PASS subtest_700
 PASS subtest_701
-FAIL subtest_702 assert_true: (min-resolution: 10000dpi) should apply expected true got false
-FAIL subtest_703 assert_false: not all and (min-resolution: 10000dpi) should not apply expected false got true
+FAIL subtest_702 assert_true: (resolution: 1x) should apply expected true got false
+PASS subtest_703
 PASS subtest_704
 PASS subtest_705
-FAIL subtest_706 assert_true: (min-resolution: 3937dpcm) should apply expected true got false
-FAIL subtest_707 assert_true: (max-resolution: 3938dpcm) should apply expected true got false
+PASS subtest_706
+PASS subtest_707
 PASS subtest_708
 PASS subtest_709
-FAIL subtest_710 assert_true: expected true got false
-FAIL subtest_711 assert_true: expected true got false
-FAIL subtest_712 assert_true: expected true got false
-PASS subtest_713
-PASS subtest_714
-PASS subtest_715
+PASS subtest_710
+PASS subtest_711
+PASS subtest_712
+FAIL subtest_713 assert_true: expected true got false
+FAIL subtest_714 assert_true: expected true got false
+FAIL subtest_715 assert_true: expected true got false
 PASS subtest_716
 PASS subtest_717
 PASS subtest_718
 PASS subtest_719
-FAIL subtest_720 assert_true: not all and (scan) should apply expected true got false
-FAIL subtest_721 assert_true: not all and (scan: progressive) should apply expected true got false
-FAIL subtest_722 assert_true: not all and (scan: interlace) should apply expected true got false
-PASS subtest_723
-PASS subtest_724
-PASS subtest_725
+PASS subtest_720
+PASS subtest_721
+PASS subtest_722
+FAIL subtest_723 assert_true: not all and (scan) should apply expected true got false
+FAIL subtest_724 assert_true: not all and (scan: progressive) should apply expected true got false
+FAIL subtest_725 assert_true: not all and (scan: interlace) should apply expected true got false
 PASS subtest_726
 PASS subtest_727
 PASS subtest_728
@@ -741,17 +864,17 @@
 PASS subtest_734
 PASS subtest_735
 PASS subtest_736
-FAIL subtest_737 assert_true: (orientation should apply expected true got false
+PASS subtest_737
 PASS subtest_738
 PASS subtest_739
-PASS subtest_740
+FAIL subtest_740 assert_true: (orientation should apply expected true got false
 PASS subtest_741
 PASS subtest_742
 PASS subtest_743
-FAIL subtest_744 assert_true: not all and (grid should apply expected true got false
+PASS subtest_744
 PASS subtest_745
 PASS subtest_746
-PASS subtest_747
+FAIL subtest_747 assert_true: not all and (grid should apply expected true got false
 PASS subtest_748
 PASS subtest_749
 PASS subtest_750
@@ -773,10 +896,13 @@
 PASS subtest_766
 PASS subtest_767
 PASS subtest_768
-FAIL subtest_769 assert_true: expected true got false
-FAIL subtest_770 assert_true: expected true got false
-FAIL subtest_771 assert_true: expected true got false
+PASS subtest_769
+PASS subtest_770
+PASS subtest_771
 FAIL subtest_772 assert_true: expected true got false
 FAIL subtest_773 assert_true: expected true got false
-PASS subtest_774
+FAIL subtest_774 assert_true: expected true got false
+FAIL subtest_775 assert_true: expected true got false
+FAIL subtest_776 assert_true: expected true got false
+PASS subtest_777
 

Modified: trunk/LayoutTests/platform/gtk/TestExpectations (282356 => 282357)


--- trunk/LayoutTests/platform/gtk/TestExpectations	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/platform/gtk/TestExpectations	2021-09-13 21:13:49 UTC (rev 282357)
@@ -546,10 +546,6 @@
 webkit.org/b/187064 webrtc/libwebrtc/descriptionGetters.html
 webkit.org/b/177533 webrtc/video-interruption.html
 
-# Requires Resolution Media Query support
-webkit.org/b/100137 fast/media/mq-resolution.html [ Failure ]
-webkit.org/b/100137 fast/media/mq-resolution-dpi-dpcm-warning.html [ Failure ]
-
 # Skip the perf/ tests in debug builds
 Bug(GTK) [ Debug ] perf [ Skip ]
 

Modified: trunk/LayoutTests/platform/ios/TestExpectations (282356 => 282357)


--- trunk/LayoutTests/platform/ios/TestExpectations	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/platform/ios/TestExpectations	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1639,8 +1639,6 @@
 fast/media/mq-max-pixel-ratio.html [ ImageOnlyFailure ]
 fast/media/mq-min-pixel-ratio.html [ ImageOnlyFailure ]
 fast/media/mq-pixel-ratio.html [ ImageOnlyFailure ]
-fast/media/mq-resolution-dpi-dpcm-warning.html [ Failure ]
-fast/media/mq-resolution.html [ Failure ]
 fast/media/viewport-media-query.html [ ImageOnlyFailure ]
 fast/multicol/mixed-opacity-fixed-test.html [ ImageOnlyFailure ]
 fast/multicol/newmulticol/multicol-clip-rounded-corners.html [ ImageOnlyFailure ]

Modified: trunk/LayoutTests/platform/mac/TestExpectations (282356 => 282357)


--- trunk/LayoutTests/platform/mac/TestExpectations	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/platform/mac/TestExpectations	2021-09-13 21:13:49 UTC (rev 282357)
@@ -430,10 +430,6 @@
 # CSS image-resolution is not yet enabled.
 webkit.org/b/85262 fast/css/image-resolution
 
-# Resolution media query is not yet enabled.
-webkit.org/b/85262 fast/media/mq-resolution.html [ Skip ]
-webkit.org/b/85262 fast/media/mq-resolution-dpi-dpcm-warning.html [ Skip ]
-
 # CSS image-orientation is not yet enabled.
 webkit.org/b/89052 fast/css/image-orientation
 

Modified: trunk/LayoutTests/platform/win/TestExpectations (282356 => 282357)


--- trunk/LayoutTests/platform/win/TestExpectations	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/LayoutTests/platform/win/TestExpectations	2021-09-13 21:13:49 UTC (rev 282357)
@@ -951,9 +951,6 @@
 #webkit.org/b/95806 media/video-source-error-no-candidate.html [ Pass Failure ]
 #webkit.org/b/95806 media/video-source-moved.html [ Pass Failure ]
 
-# Resolution media query is not yet enabled.
-webkit.org/b/85262 fast/media/mq-resolution.html [ Skip ]
-webkit.org/b/85262 fast/media/mq-resolution-dpi-dpcm-warning.html [ Skip ]
 http/tests/media/media-document.html [ Skip ]
 http/tests/media/video-useragent.html [ Skip ]
 

Modified: trunk/Source/WTF/ChangeLog (282356 => 282357)


--- trunk/Source/WTF/ChangeLog	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WTF/ChangeLog	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,13 @@
+2021-09-13  Sam Sneddon  <gsnedd...@apple.com>
+
+        Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
+        https://bugs.webkit.org/show_bug.cgi?id=229776
+
+        Reviewed by Simon Fraser.
+
+        * Scripts/Preferences/WebPreferencesExperimental.yaml:
+        Add ResolutionMediaFeatureEnabled
+
 2021-09-13  Youenn Fablet  <you...@apple.com>
 
         Remove WritableStream runtime flag

Modified: trunk/Source/WTF/Scripts/Preferences/WebPreferencesExperimental.yaml (282356 => 282357)


--- trunk/Source/WTF/Scripts/Preferences/WebPreferencesExperimental.yaml	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WTF/Scripts/Preferences/WebPreferencesExperimental.yaml	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1037,6 +1037,18 @@
     WebCore:
       default: false
 
+ResolutionMediaFeatureEnabled:
+  type: bool
+  humanReadableName: "Resolution media feature"
+  humanReadableDescription: "Enable resolution media feature support"
+  defaultValue:
+    WebKitLegacy:
+      default: false
+    WebKit:
+      default: false
+    WebCore:
+      default: false
+
 # FIXME: Is this implemented for WebKitLegacy? If not, this should be excluded from WebKitLegacy entirely.
 # FIXME: This should have it's own ENABLE.
 ScreenCaptureEnabled:

Modified: trunk/Source/WebCore/ChangeLog (282356 => 282357)


--- trunk/Source/WebCore/ChangeLog	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WebCore/ChangeLog	2021-09-13 21:13:49 UTC (rev 282357)
@@ -1,3 +1,24 @@
+2021-09-13  Sam Sneddon  <gsnedd...@apple.com>
+
+        Move ENABLE_RESOLUTION_MEDIA_QUERY to a runtime flag, start running tests again
+        https://bugs.webkit.org/show_bug.cgi?id=229776
+
+        Reviewed by Simon Fraser.
+
+        No new tests, unskipped & rebaselined existing tests.
+
+        * css/CSSUnits.cpp:
+        (WebCore::canonicalUnitTypeForCategory):
+        * css/MediaList.cpp:
+        Fix compilation with resolution enabled.
+        (WebCore::addResolutionWarningMessageToConsole):
+        Simplify code generating message.
+        (WebCore::reportMediaQueryWarningIfNeeded):
+        * css/MediaList.h:
+        (WebCore::reportMediaQueryWarningIfNeeded): Deleted.
+        * css/MediaQueryEvaluator.cpp:
+        (WebCore::resolutionEvaluate):
+
 2021-09-13  Johnson Zhou  <qiaosong_z...@apple.com>
 
         Addition of CSSNumericValue and subclasses. (CSS Typed OM)

Modified: trunk/Source/WebCore/css/CSSUnits.cpp (282356 => 282357)


--- trunk/Source/WebCore/css/CSSUnits.cpp	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WebCore/css/CSSUnits.cpp	2021-09-13 21:13:49 UTC (rev 282357)
@@ -75,10 +75,8 @@
         return CSSUnitType::CSS_DEG;
     case CSSUnitCategory::Frequency:
         return CSSUnitType::CSS_HZ;
-#if ENABLE(CSS_IMAGE_RESOLUTION) || ENABLE(RESOLUTION_MEDIA_QUERY)
     case CSSUnitCategory::Resolution:
         return CSSUnitType::CSS_DPPX;
-#endif
     default:
         return CSSUnitType::CSS_UNKNOWN;
     }

Modified: trunk/Source/WebCore/css/MediaList.cpp (282356 => 282357)


--- trunk/Source/WebCore/css/MediaList.cpp	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WebCore/css/MediaList.cpp	2021-09-13 21:13:49 UTC (rev 282357)
@@ -25,6 +25,7 @@
 #include "CSSStyleSheet.h"
 #include "DOMWindow.h"
 #include "Document.h"
+#include "MediaFeatureNames.h"
 #include "MediaQuery.h"
 #include "MediaQueryParser.h"
 #include <wtf/NeverDestroyed.h>
@@ -223,32 +224,20 @@
     m_mediaQueries = mediaQueries;
 }
 
-#if ENABLE(RESOLUTION_MEDIA_QUERY)
-
 static void addResolutionWarningMessageToConsole(Document& document, const String& serializedExpression, const CSSPrimitiveValue& value)
 {
-    static NeverDestroyed<String> mediaQueryMessage(MAKE_STATIC_STRING_IMPL("Consider using 'dppx' units instead of '%replacementUnits%', as in CSS '%replacementUnits%' means dots-per-CSS-%lengthUnit%, not dots-per-physical-%lengthUnit%, so does not correspond to the actual '%replacementUnits%' of a screen. In media query _expression_: "));
-    static NeverDestroyed<String> mediaValueDPI(MAKE_STATIC_STRING_IMPL("dpi"));
-    static NeverDestroyed<String> mediaValueDPCM(MAKE_STATIC_STRING_IMPL("dpcm"));
-    static NeverDestroyed<String> lengthUnitInch(MAKE_STATIC_STRING_IMPL("inch"));
-    static NeverDestroyed<String> lengthUnitCentimeter(MAKE_STATIC_STRING_IMPL("centimeter"));
+    ASSERT(value.isDotsPerInch() || value.isDotsPerCentimeter());
+    auto replacementUnit = CSSPrimitiveValue::unitTypeString(value.primitiveType());
+    auto lengthUnit = value.isDotsPerInch() ? "inch" : "centimeter";
 
-    String message;
-    if (value.isDotsPerInch())
-        message = mediaQueryMessage.get().replace("%replacementUnits%", mediaValueDPI).replace("%lengthUnit%", lengthUnitInch);
-    else if (value.isDotsPerCentimeter())
-        message = mediaQueryMessage.get().replace("%replacementUnits%", mediaValueDPCM).replace("%lengthUnit%", lengthUnitCentimeter);
-    else
-        ASSERT_NOT_REACHED();
+    auto message = makeString("Consider using 'dppx' units instead of '", replacementUnit, "', as in CSS '", replacementUnit, "' means dots-per-CSS-", lengthUnit, ", not dots-per-physical-", lengthUnit, ", so does not correspond to the actual '", replacementUnit, "' of a screen. In media query _expression_: ", serializedExpression);
 
-    message.append(serializedExpression);
-
     document.addConsoleMessage(MessageSource::CSS, MessageLevel::Debug, message);
 }
 
 void reportMediaQueryWarningIfNeeded(Document* document, const MediaQuerySet* mediaQuerySet)
 {
-    if (!mediaQuerySet || !document)
+    if (!mediaQuerySet || !document || !document->settings().resolutionMediaFeatureEnabled())
         return;
 
     for (auto& query : mediaQuerySet->queryVector()) {
@@ -268,8 +257,6 @@
     }
 }
 
-#endif
-
 TextStream& operator<<(TextStream& ts, const MediaQuerySet& querySet)
 {
     ts << querySet.mediaText();

Modified: trunk/Source/WebCore/css/MediaList.h (282356 => 282357)


--- trunk/Source/WebCore/css/MediaList.h	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WebCore/css/MediaList.h	2021-09-13 21:13:49 UTC (rev 282357)
@@ -113,14 +113,6 @@
 // FIXME: Seems strange to have this here in this file, and unclear exactly who should call this and when.
 void reportMediaQueryWarningIfNeeded(Document*, const MediaQuerySet*);
 
-#if !ENABLE(RESOLUTION_MEDIA_QUERY)
-
-inline void reportMediaQueryWarningIfNeeded(Document*, const MediaQuerySet*)
-{
-}
-
-#endif
-
 WTF::TextStream& operator<<(WTF::TextStream&, const MediaQuerySet&);
 WTF::TextStream& operator<<(WTF::TextStream&, const MediaList&);
 

Modified: trunk/Source/WebCore/css/MediaQueryEvaluator.cpp (282356 => 282357)


--- trunk/Source/WebCore/css/MediaQueryEvaluator.cpp	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/WebCore/css/MediaQueryEvaluator.cpp	2021-09-13 21:13:49 UTC (rev 282357)
@@ -440,14 +440,10 @@
 
 static bool resolutionEvaluate(CSSValue* value, const CSSToLengthConversionData&, Frame& frame, MediaFeaturePrefix op)
 {
-#if ENABLE(RESOLUTION_MEDIA_QUERY)
+    if (!frame.settings().resolutionMediaFeatureEnabled())
+        return false;
+
     return (!value || (is<CSSPrimitiveValue>(*value) && downcast<CSSPrimitiveValue>(*value).isResolution())) && evaluateResolution(value, frame, op);
-#else
-    UNUSED_PARAM(value);
-    UNUSED_PARAM(frame);
-    UNUSED_PARAM(op);
-    return false;
-#endif
 }
 
 static bool dynamicRangeEvaluate(CSSValue* value, const CSSToLengthConversionData&, Frame& frame, MediaFeaturePrefix)

Modified: trunk/Source/cmake/OptionsFTW.cmake (282356 => 282357)


--- trunk/Source/cmake/OptionsFTW.cmake	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/cmake/OptionsFTW.cmake	2021-09-13 21:13:49 UTC (rev 282357)
@@ -93,7 +93,6 @@
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_OVERFLOW_SCROLLING_TOUCH PRIVATE OFF)
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_PUBLIC_SUFFIX_LIST PRIVATE ON)
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_RESIZE_OBSERVER PRIVATE ON)
-WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_RESOLUTION_MEDIA_QUERY PRIVATE OFF)
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_SAMPLING_PROFILER PRIVATE OFF)
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_SPELLCHECK PRIVATE OFF)
 WEBKIT_OPTION_DEFAULT_PORT_VALUE(ENABLE_TOUCH_EVENTS PRIVATE OFF)

Modified: trunk/Source/cmake/WebKitFeatures.cmake (282356 => 282357)


--- trunk/Source/cmake/WebKitFeatures.cmake	2021-09-13 20:58:24 UTC (rev 282356)
+++ trunk/Source/cmake/WebKitFeatures.cmake	2021-09-13 21:13:49 UTC (rev 282357)
@@ -197,7 +197,6 @@
     WEBKIT_OPTION_DEFINE(ENABLE_PUBLIC_SUFFIX_LIST "Toggle public suffix list support" PRIVATE ON)
     WEBKIT_OPTION_DEFINE(ENABLE_REMOTE_INSPECTOR "Toggle remote inspector support" PRIVATE ON)
     WEBKIT_OPTION_DEFINE(ENABLE_RESIZE_OBSERVER "Toggle Resize Observer support" PRIVATE ON)
-    WEBKIT_OPTION_DEFINE(ENABLE_RESOLUTION_MEDIA_QUERY "Toggle resolution media query support" PRIVATE OFF)
     WEBKIT_OPTION_DEFINE(ENABLE_RESOURCE_LOAD_STATISTICS "Toggle resource load statistics support" PRIVATE OFF)
     WEBKIT_OPTION_DEFINE(ENABLE_RESOURCE_USAGE "Toggle resource usage support" PRIVATE OFF)
     WEBKIT_OPTION_DEFINE(ENABLE_RUBBER_BANDING "Toggle rubber banding support" PRIVATE OFF)
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to