target_blank_useractivation.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /html/semantics/links/links-created-by-a-and-area-elements/target_blank_useractivation.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8>

<title>Test that clicking target=_blank links consumes userActivation</title>

<link rel="help" href="https://html.spec.whatwg.org/#following-hyperlinks-2">

<link rel="help" href="https://html.spec.whatwg.org/#the-rules-for-choosing-a-navigable">

<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>

</head>

<body>

<a target="_blank" id="a_click_target">Click me</a>

<map id="map">

<area coords="0,0,50,50" target="_blank">

</map>

<img src="/images/blue.png" usemap="#map" style="width: 50px; height: 50px" id="area_click_target">

<script>

const testUrl = "support/target-blank-useractivation.html";

function waitForNewWindow(aBroadcastChannelId) {

  return new Promise(resolve => {

    let channel = new BroadcastChannel(aBroadcastChannelId);

    channel.addEventListener("message", (e) => {

      assert_equals(e.data, "ready");

      channel.postMessage("close");

      resolve();

    }, {once: true});

});

["a", "area"].forEach(tag => {

  const link = document.querySelector(tag);

  promise_test(async () => {

    let broadcastChannelId = `${tag}_click_script`;

    link.href = `${testUrl}?${broadcastChannelId}`;

    await test_driver.bless('transient activation');

    assert_true(navigator.userActivation.isActive, 'should have user activation');

    let newWindowPromise = waitForNewWindow(broadcastChannelId);

    link.click();

    await newWindowPromise;

    assert_false(navigator.userActivation.isActive, 'navigator.userActivation.isActive after opening a new window');

  }, `<${tag} target=_blank">.click()`);

  promise_test(async () => {

    let broadcastChannelId = `${tag}_click`;

    link.href = `${testUrl}?${broadcastChannelId}`;

    let newWindowPromise = waitForNewWindow(broadcastChannelId);

    link.addEventListener("click", () => {

      assert_true(navigator.userActivation.isActive, 'should have user activation');

});

    // test_driver.click() doesn't work with <area> element in Chrome.

    await new test_driver.Actions()

        .pointerMove(1, 1, { origin: document.getElementById(`${tag}_click_target`) })

        .pointerDown()

        .pointerUp()

        .send();

    await newWindowPromise;

    assert_false(navigator.userActivation.isActive, 'navigator.userActivation.isActive after opening a new window');

  }, `<${tag} target=_blank"> mouse click`);

});

</script>

</body>

</html>