layout/style/test/test_mq_any_hover_and_any_pointer.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=1483111
   5 -->
   6 <head>
   7   <meta charset="utf-8">
   8   <title>Test for Bug 1035774</title>
   9   <script src="/tests/SimpleTest/SimpleTest.js"></script>
  10   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11 </head>
  12 <body>
  13 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1483111">Mozilla Bug 1483111</a>
  14 <p id="display"></p>
  15 <div id="content" style="display: none">
  16
  17 </div>
  18 <pre id="test">
  19 </pre>
  20 <script>
  21
  22 const NO_POINTER            = 0x00;
  23 const COARSE_POINTER        = 0x01;
  24 const FINE_POINTER          = 0x02;
  25 const HOVER_CAPABLE_POINTER = 0x04;
  26
  27 var isAndroid = navigator.appVersion.includes("Android");
  28
  29 add_task(async () => {
  30   await SpecialPowers.pushPrefEnv({
  31     set: [ ['privacy.resistFingerprinting', true] ]
  32   });
  33
  34   // When resistFingerprinting is enabled, we pretend that the system has a
  35   // mouse pointer (or finger on mobile).
  36   let invertIfAndroid = function(b) { return isAndroid ? !b : b; };
  37
  38   ok(!matchMedia("(any-pointer: none)").matches,
  39                  "Doesn't match (any-pointer: none)");
  40   ok(matchMedia("(any-pointer)").matches, "Matches (any-pointer)");
  41
  42   ok(invertIfAndroid(!matchMedia("(any-pointer: coarse)").matches),
  43                  "Doesn't match (any-pointer: coarse)");
  44   ok(invertIfAndroid(matchMedia("(any-pointer: fine)").matches), "Matches (any-pointer: fine)");
  45
  46   ok(invertIfAndroid(!matchMedia("(any-hover: none)").matches),
  47                  "Doesn't match (any-hover: none)");
  48   ok(invertIfAndroid(matchMedia("(any-hover: hover)").matches),
  49                 "Matches (any-hover: hover)");
  50   ok(invertIfAndroid(matchMedia("(any-hover)").matches), "Matches (any-hover)");
  51
  52   await SpecialPowers.flushPrefEnv();
  53 });
  54
  55 add_task(async () => {
  56   // No pointer.
  57   await SpecialPowers.pushPrefEnv({
  58     set: [ ['ui.allPointerCapabilities', NO_POINTER] ]
  59   });
  60
  61   ok(matchMedia("(any-pointer: none)").matches, "Matches (any-pointer: none)");
  62   ok(!matchMedia("(any-pointer: coarse)").matches,
  63                  "Doesn't match (any-pointer: coarse)");
  64   ok(!matchMedia("(any-pointer: fine)").matches,
  65                  "Doesn't match (any-pointer: fine)");
  66   ok(!matchMedia("(any-pointer)").matches, "Matches (any-pointer)");
  67
  68   ok(matchMedia("(any-hover: none)").matches, "Matches (any-hover: none)");
  69   ok(!matchMedia("(any-hover: hover)").matches,
  70                  "Doesn't match (any-hover: hover)");
  71   ok(!matchMedia("(any-hover)").matches, "Doesn't match (any-hover)");
  72 });
  73
  74 add_task(async () => {
  75   // Mouse type pointer and touchscreen
  76   await SpecialPowers.pushPrefEnv({
  77     set: [ ['ui.allPointerCapabilities',
  78             FINE_POINTER | COARSE_POINTER | HOVER_CAPABLE_POINTER] ]
  79   });
  80
  81   ok(!matchMedia("(any-pointer: none)").matches,
  82                  "Doesn't match (any-pointer: none)");
  83   ok(matchMedia("(any-pointer: coarse)").matches,
  84                  "Matches (any-pointer: coarse)");
  85   ok(matchMedia("(any-pointer: fine)").matches, "Matches (any-pointer: fine)");
  86   ok(matchMedia("(any-pointer)").matches, "Matches (any-pointer)");
  87
  88   ok(!matchMedia("(any-hover: none)").matches,
  89                  "Doesn't match (any-hover: none)");
  90   ok(matchMedia("(any-hover: hover)").matches,
  91                 "Matches (any-hover: hover)");
  92   ok(matchMedia("(any-hover)").matches, "Matches (any-hover)");
  93 });
  94
  95 </script>
  96 </body>
  97 </html>