tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

persistentdeviceid-is-unique-manual.tentative.html (4434B)

      1 <!DOCTYPE html>
      2 <!--
      3   Tentative; contingent on merge of:
      4   https://github.com/w3c/pointerevents/pull/495
      5 
      6   This manual test validates the behavior of PointerEvent.persistentDeviceId.
      7   Specifically, this test ensures that pointing devices get their own unique id, and
      8   that the unique id is persistent over the session.
      9 
     10   In order to run this test, it is necessary to have multiple pointing devices; such as a
     11   pen and a mouse. Please follow the instructions exactly as written in order to ensure
     12   the correct results are obtained.
     13 -->
     14 <title>persistentDeviceId is unique for pointer events from different devices</title>
     15 <script src="/resources/testharness.js"></script>
     16 <script src="/resources/testharnessreport.js"></script>
     17 <style>
     18    #instructions {
     19        display: inline-block;
     20        border-right: 1px solid black;
     21        padding-right: 10px;
     22        width: 600px;
     23    }
     24    #testcontainer {
     25        display: inline-block;
     26        width: 300px;
     27        touch-action: none;
     28    }
     29 
     30    #currentuniqueid {
     31        display: inline-block;
     32    }
     33 
     34    .point1 {
     35        height: 50px;
     36        width: 50px;
     37        background-color: #00eeee;
     38        display: inline-block;
     39    }
     40    .point2 {
     41        height: 50px;
     42        width: 50px;
     43        background-color: #aa33aa;
     44        display: inline-block;
     45        float: right;
     46    }
     47 
     48    .testarea {
     49        border: 1px solid #000000;
     50        margin-bottom: 50px;
     51        width: 100%;
     52    }
     53 
     54    p {
     55        padding-bottom: 10px;
     56    }
     57 
     58    html {
     59        font-family: Arial, Helvetica, sans-serif;
     60    }
     61 </style>
     62 <html>
     63 <div id="instructions">
     64 <h2>Instructions</h2>
     65 <p>1. With one pointing device (pointing device #1), drag the pointer from A to B</p>
     66 <p>2. With another pointing device (pointing device #2), drag the pointer from C to D</p>
     67 <p>3. Repeat step 1.</p>
     68 <p>4. Repeat step 2.</p>
     69 <p>5. Click finish and verify the test passes. There should be 4 passing test cases. </p>
     70 </div>
     71 <div id="testcontainer">
     72    <div>
     73        Current pointer's unique id: <p id="currentuniqueid"></p>
     74    </div>
     75    <div class="testarea" id="device1">
     76        <div class="point1">A</div>
     77        <div class="point2">B</div>
     78    </div>
     79    <div class="testarea" id="device2">
     80        <div class="point1">C</div>
     81        <div class="point2">D</div>
     82    </div>
     83 
     84    <p>Click on the button below after completing. If a "PASS" result appears the test
     85    passes, otherwise it fails</p>
     86    <button onclick="Finish()">Finish Test</button>
     87 </div>
     88 </html>
     89 
     90 <script>
     91    let device1Ids = [];
     92    let device2Ids = [];
     93 
     94    setup({explicit_timeout: true, explicit_done: true});
     95 
     96    function LogDeviceId(event, list) {
     97        if (event.persistentDeviceId) {
     98            const persistentDeviceId = event.persistentDeviceId;
     99            currentuniqueid.innerText = persistentDeviceId ? persistentDeviceId : "Unknown";
    100            list.push(persistentDeviceId);
    101        }
    102    }
    103 
    104    function LogDeviceId1(event) {
    105        LogDeviceId(event, device1Ids);
    106    }
    107 
    108    function LogDeviceId2(event) {
    109        LogDeviceId(event, device2Ids);
    110    }
    111 
    112    function Finish() {
    113        let device1UniqueIds = new Set(device1Ids);
    114        let device2UniqueIds = new Set(device2Ids);
    115 
    116        test(function () {
    117            assert_greater_than(device1Ids.length, 1, "Events from Device 1 have deviceIds.");
    118            assert_equals(device1UniqueIds.size, 1, "Device 1 has a consistent deviceId.");
    119        }, "deviceId is consistent for device 1");
    120        test(function () {
    121            assert_greater_than(device2Ids.length, 1, "Events from Device 2 have deviceIds.");
    122            assert_equals(device2UniqueIds.size, 1, "Device 2 has a consistent deviceId.");
    123        }, "deviceId is consistent for device 2");
    124        test(function () {
    125            // Ensure the two sets are different.
    126            assert_equals(device1UniqueIds.intersection(device2UniqueIds).size, 0, "Device 1 and 2 have different deviceIds.");
    127        }, "deviceId is unique to device 1 and device 2");
    128        done();
    129    }
    130 
    131    device1.addEventListener("pointerdown", LogDeviceId1, false);
    132    device1.addEventListener("pointermove", LogDeviceId1, false);
    133    device1.addEventListener("pointerup", LogDeviceId1, false);
    134 
    135    device2.addEventListener("pointerdown", LogDeviceId2, false);
    136    device2.addEventListener("pointermove", LogDeviceId2, false);
    137    device2.addEventListener("pointerup", LogDeviceId2, false);
    138 
    139 </script>