diff --git a/pointerevents/pointerevent_attributes_nohover_pointers.html b/pointerevents/pointerevent_attributes_nohover_pointers.html
index 374279135d0c182..d501ae0afd45612 100644
--- a/pointerevents/pointerevent_attributes_nohover_pointers.html
+++ b/pointerevents/pointerevent_attributes_nohover_pointers.html
@@ -1,124 +1,134 @@
 <!doctype html>
-<title>Pointer Events no-hover pointer attributes test</title>
-<meta name="variant" content="?touch">
-<meta name="viewport" content="width=device-width">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/testdriver.js"></script>
-<script src="/resources/testdriver-actions.js"></script>
-<script src="/resources/testdriver-vendor.js"></script>
-<script type="text/javascript" src="pointerevent_support.js"></script>
-<style>
-  div {
-    height: 80px;
-    width: 80px;
-  }
-</style>
-<body onload="run()">
-  <div id="square1"></div>
-  <iframe id="innerFrame"
-      src="resources/pointerevent_attributes_hoverable_pointers-iframe.html">
-  </iframe>
-  <div id="done"></div>
-</body>
-<script>
-  'use strict';
-  const pointer_type = location.search.substring(1);
-  const test_pointer = pointer_type + "TestPointer";
-
-  const logged_events = [
-    "pointerover", "pointerenter", "pointerdown",
-    "pointerup", "pointerout", "pointerleave"
-  ];
-
-  // TODO(mustaq@chromium.org): add pointermove coverage with touch-action:none.
-
-  function checkPointerEventAttributes(event,
-      expected_pointer_id, expected_event_type,
-      expected_bounding_rect) {
-    assert_equals(event.pointerType, pointer_type,
-        expected_event_type + ".pointerType should match test input");
-
-    assert_equals(event.pointerId, expected_pointer_id,
-        expected_event_type + ".pointerId should match all other events");
-    assert_equals(event.type, expected_event_type,
-        expected_event_type + ".type should be " + expected_event_type);
-
-    assert_equals(event.button, 0,
-        expected_event_type + ".button should be 0");
-
-    if (['pointerover', 'pointerenter', 'pointerdown'].includes(event.type)) {
-      assert_equals(event.buttons, 1,
-          expected_event_type + ".buttons should be 1");
-    } else {
-      assert_equals(event.buttons, 0,
-          expected_event_type + ".buttons should be 0");
-    }
-
-    assert_true(event.clientX >= expected_bounding_rect.left &&
-        event.clientX < expected_bounding_rect.right,
-        expected_event_type + ".clientX should be within bounding client rect.");
-
-    assert_true(event.clientY >= expected_bounding_rect.top &&
-        event.clientY < expected_bounding_rect.bottom,
-        expected_event_type + ".clientY should be within bounding client rect.");
-
-    check_PointerEvent(event, expected_event_type);
-
-    assert_equals(event.isPrimary, true,
-        expected_event_type + ".isPrimary is true.");
-  }
-
-  async function checkEventsOnTarget(test, elem) {
-    const done = document.getElementById("done");
-
-    let logged_event_promises = [];
-    for (let i = 0; i < logged_events.length; i++) {
-      logged_event_promises.push(getEvent(logged_events[i], elem, test));
-    }
-    let done_promise = getEvent("pointerup", done, test);
-
-    let actions = new test_driver.Actions();
-    actions = actions
-      .addPointer(test_pointer, pointer_type)
-      .pointerMove(0, 0, {origin:elem, sourceName:test_pointer})
-      .pointerDown({sourceName:test_pointer})
-      .pointerUp({sourceName:test_pointer})
-      .pointerMove(0, 0, {origin:done, sourceName:test_pointer})
-      .pointerDown({sourceName:test_pointer})
-      .pointerUp({sourceName:test_pointer});
-    await actions.send();
-
-    let done_event = await done_promise;
-
-    let expected_pointer_id;
-
-    // All Promises in logged_event_promises are already resolved bynow.
-    for (let i = 0; i < logged_event_promises.length; i++) {
-      let event = await logged_event_promises[i];
-      if (expected_pointer_id === undefined) {
-        expected_pointer_id = event.pointerId;
-      }
-      checkPointerEventAttributes(event, expected_pointer_id,
-          logged_events[i], elem.getBoundingClientRect());
-    }
-  }
-
-  function run() {
-    promise_test(async test => {
-      const target = document.getElementById("square1");
-      checkEventsOnTarget(test, target);
-    }, "PointerEvent attributes");
-
-    promise_test(async test => {
-      const target = frames[0].document.getElementById("square2");
-
-      // In Chromium, `test_driver.Actions()` sent to a subframe does not work
-      // even though  the `onload` event here fires after a sqame-origin
-      // subframe is loaded.  Waiting for 2 animation frames resolves this.
-      await waitForAnimationFrames(2);
-
-      checkEventsOnTarget(test, target);
-    }, "PointerEvent attributes in a subframe");
-  }
-</script>
+<html>
+    <head>
+        <title>Pointer Events properties tests</title>
+        <meta name="viewport" content="width=device-width">
+        <link rel="stylesheet" type="text/css" href="pointerevent_styles.css">
+        <script src="/resources/testharness.js"></script>
+        <script src="/resources/testharnessreport.js"></script>
+        <script src="/resources/testdriver.js"></script>
+        <script src="/resources/testdriver-actions.js"></script>
+        <script src="/resources/testdriver-vendor.js"></script>
+        <!-- Additional helper script for common checks across event types -->
+        <script type="text/javascript" src="pointerevent_support.js"></script>
+        <script>
+            var detected_pointertypes = {};
+            var detected_eventTypes = {};
+            var eventList = ['pointerover', 'pointerenter', 'pointerdown', 'pointerup', 'pointerout', 'pointerleave'];
+            // TODO(mustaq@chromium.org): missing touch pointermove coverage!
+            var expectedPointerId = NaN;
+
+            function resetTestState() {
+                detected_eventTypes = {};
+                document.getElementById("square1").style.visibility = 'visible';
+                document.getElementById('innerFrame').contentDocument.getElementById("square2").style.visibility = 'hidden';
+            }
+            function checkPointerEventAttributes(event, targetBoundingClientRect, testNamePrefix) {
+                if (detected_eventTypes[event.type])
+                    return;
+                var expectedEventType =  eventList[Object.keys(detected_eventTypes).length];
+                detected_eventTypes[event.type] = true;
+                var pointerTestName = (testNamePrefix ? testNamePrefix + ' ' : '')
+                    + expectedPointerType + ' ' + expectedEventType;
+
+                detected_pointertypes[event.pointerType] = true;
+
+                test(function() {
+                    assert_equals(event.type, expectedEventType);
+                }, pointerTestName + ".type should be " + expectedEventType);
+
+                // Test button and buttons
+                test(function() {
+                    assert_equals(event.button, 0);
+                }, pointerTestName + ".button attribute is 0 on touch-down.");
+
+                if (event.type == 'pointerdown' || event.type == 'pointerover' || event.type == 'pointerenter') {
+                    test(function() {
+                        assert_equals(event.buttons, 1);
+                    }, pointerTestName + ".buttons attribute is 1 on touch-down.");
+                } else {
+                    test(function() {
+                        assert_equals(event.buttons, 0);
+                    }, pointerTestName + ".buttons is 0 on touch-release.");
+                }
+
+                // Test clientX and clientY
+                test(function () {
+                    assert_true(event.clientX >= targetBoundingClientRect.left && event.clientX < targetBoundingClientRect.right && event.clientY >= targetBoundingClientRect.top && event.clientY < targetBoundingClientRect.bottom);
+                }, pointerTestName + ".clientX and .clientY attributes are correct.");
+
+                check_PointerEvent(event, testNamePrefix);
+
+                // Test isPrimary
+                test(function () {
+                    assert_equals(event.isPrimary, true);
+                }, pointerTestName + ".isPrimary attribute is true.");
+
+                // Test pointerId value
+                if (isNaN(expectedPointerId)) {
+                    expectedPointerId = event.pointerId;
+                } else {
+                    test(function () {
+                        assert_equals(event.pointerId, expectedPointerId);
+                    }, pointerTestName + ".pointerId should be the same as previous pointer events for this active pointer.");
+                }
+            }
+
+            async function run() {
+                var test_pointerEvent = setup_pointerevent_test("pointerevent attributes", ['touch']);
+                var square1 = document.getElementById("square1");
+                var rectSquare1 = square1.getBoundingClientRect();
+                var innerFrame = document.getElementById('innerFrame');
+                var square2 = innerFrame.contentDocument.getElementById('square2');
+                var rectSquare2 = square2.getBoundingClientRect();
+
+                eventList.forEach(function(eventName) {
+                    on_event(square1, eventName, function (event) {
+                        if (square1.style.visibility == 'hidden')
+                            return;
+                        checkPointerEventAttributes(event, rectSquare1, "");
+                        if (Object.keys(detected_eventTypes).length == eventList.length) {
+                            square1.style.visibility = 'hidden';
+                            detected_eventTypes = {};
+                            square2.style.visibility = 'visible';
+                            expectedPointerId = NaN;
+                        }
+                    });
+                    on_event(square2, eventName, function (event) {
+                        checkPointerEventAttributes(event, rectSquare2, "Inner frame ");
+                        if (Object.keys(detected_eventTypes).length == eventList.length) {
+                            square2.style.visibility = 'hidden';
+                            test_pointerEvent.done();
+                        }
+                    });
+                });
+
+                // Inject touch inputs.
+                await clickInTarget("touch", square1);
+                await clickInTarget("touch", square2);
+            }
+        </script>
+    </head>
+    <body onload="run()">
+        <h1>Pointer Events no-hover pointer attributes test</h1>
+        <h2 id="pointerTypeDescription"></h2>
+        <h4>
+            Test Description: This test checks the properties of pointer events that do not support hover.
+            <ol>
+                 <li>Tap the black square.</li>
+                 <li>Then move it off the black square so that it disappears.</li>
+                 <li>When the red square appears tap on that as well.</li>
+            </ol>
+
+            Test passes if the proper behavior of the events is observed.
+        </h4>
+        <div id="square1" class="square"></div>
+        <iframe id="innerFrame" src="resources/pointerevent_attributes_hoverable_pointers-iframe.html"></iframe>
+        <div class="spacer"></div>
+        <div id="complete-notice">
+            <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p>
+            <p>Refresh the page to run the tests again with a different pointer type.</p>
+        </div>
+        <div id="log"></div>
+    </body>
+</html>
