Add UserActivation member to MessageEvent

Add an API to query user activation state on a posted message event. Add includeUserActivation attribute on the WindowPostMessageOptions so that indication of user gesture behavior can be opted in. https://github.com/dtapuska/useractivation whatwg/html#1983 BUG=846858 Change-Id: I2459b21004afbe00c41ddf992533c60728768bb4
web-platform-tests · Jul 24, 2018 · 771d51b · 771d51b
1 parent 4273df6
commit 771d51b
Show file tree

Hide file tree

Showing 3 changed files with 89 additions and 0 deletions.
diff --git a/html/user-activation/message-event-activation-api-iframe-cross-origin.sub.tentative.html b/html/user-activation/message-event-activation-api-iframe-cross-origin.sub.tentative.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+   Tentative due to:
+    https://github.com/whatwg/html/issues/3739
+
+-->
+<html>
+<head>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+</head>
+<body>
+  <h1>Clicking in iframe has activation state in child via MessageEvent</h1>
+  <ol id="instructions">
+    <li>Click inside the red area.
+  </ol>
+  <iframe id="child" width="200" height="200"></iframe>
+  <script>
+    async_test(function(t) {
+      var child = document.getElementById("child");
+      assert_false(navigator.userActivation.isActive);
+      assert_false(navigator.userActivation.hasBeenActive);
+      window.addEventListener("message", t.step_func(event => {
+        if (event.data == 'child-three-loaded') {
+          // values have false after load
+          assert_true(event.userActivation != null);
+          assert_false(event.userActivation.isActive);
+          assert_false(event.userActivation.hasBeenActive);
+          test_driver.click(child);
+        } else if (event.data == 'child-three-clicked') {
+          // values have activation state on click
+          assert_true(navigator.userActivation.hasBeenActive);
+          assert_true(event.userActivation != null);
+          assert_true(event.userActivation.isActive);
+          assert_true(event.userActivation.hasBeenActive);
+          child.contentWindow.postMessage('report', "*");
+        } else if (event.data == 'child-three-report') {
+          assert_false(navigator.userActivation.isActive);
+          assert_true(navigator.userActivation.hasBeenActive);
+          assert_true(event.userActivation != null);
+          assert_false(event.userActivation.isActive);
+          assert_true(event.userActivation.hasBeenActive);
+          child.contentWindow.postMessage('report-no-activation', "*");
+        } else if (event.data == 'child-three-report-no-activation') {
+          assert_true(event.userActivation === null);
+          t.done();
+        }
+      }));
+      child.src = "http://{{domains[www]}}:{{ports[http][0]}}/html/user-activation/resources/child-three.html";
+    }, "Message propagates values on post");
+  </script>
+</body>
+</html>
diff --git a/html/user-activation/message-event-init.tentative.html b/html/user-activation/message-event-init.tentative.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<title>MessageEvent constructor</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+test(function() {
+  var ev = new MessageEvent("test", { userActivation: navigator.userActivation })
+  assert_equals(ev.userActivation, navigator.userActivation, "userActivation attribute")
+}, "MessageEventInit user activation set")
+test(function() {
+  var ev = new MessageEvent("test")
+  assert_equals(ev.userActivation, null, "userActivation attribute")
+}, "MessageEventInit user activation not set")
+
+</script>
diff --git a/html/user-activation/resources/child-three.html b/html/user-activation/resources/child-three.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<body style="background: red;">
+  <script>
+    window.parent.postMessage("child-three-loaded", [], {targetOrigin: "*", includeUserActivation: true});
+    window.addEventListener("click", event => {
+      window.parent.postMessage("child-three-clicked", [], {targetOrigin: "*", includeUserActivation: true});
+      var win = window.open('404.html');
+      win.close();
+  });
+
+  window.addEventListener("message", event => {
+    if (event.data == "report")
+      window.parent.postMessage("child-three-report", [], {targetOrigin: "*", includeUserActivation: true});
+    if (event.data == "report-no-activation")
+      window.parent.postMessage("child-three-report-no-activation", [], {targetOrigin: "*", includeUserActivation: false});
+  });
+
+</script>
+</body>