tab-focus-last-element.https.html | Explore in Territory

<!DOCTYPE html>
<title>Tab focus last element</title>
<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 src="/common/utils.js"></script>
<script src="resources/utils.js"></script>

<body>

  <input id="input"></input>
  <fencedframe id="fenced_frame"></fencedframe>

<script>
  var events = [];
  var combined_events = [];
  function addEventListeners(element, name) {
    element.addEventListener('focus', () => {
      events.push(name + '/focus');
    });
    element.addEventListener('blur', () => {
      events.push(name + '/blur');
    });
  }
  addEventListeners(document.getElementById('input'), "input");

  document.body.addEventListener('focusout', () => {
    combined_events.push(...events);
    events = [];
  });

  promise_test(async () => {
    const focus_ready_key = token();
    const focus_changed_key = token();

    const frame_url = generateURL("resources/tab-focus-inner.https.html",
      [focus_ready_key, focus_changed_key, /*send_reverse_sequence=*/false]);
    document.getElementById('fenced_frame').config =
        new FencedFrameConfig(frame_url);

    // Click the fenced frame so it gets user activated.
    // TODO(crbug.com/1289792) This is needed due to a bug in the experimental
    // flag BlockingFocusWithoutUserActivation for cross-origin iframes,
    // or any other frame where user activations are isolated.
    var fencedframe = document.body.getElementsByTagName('fencedframe')[0]
    await multiClick(10, 10, fencedframe, 5);

    document.getElementById('input').focus();
    testRunner.setBrowserHandlesFocus(true);

    await nextValueFromServer(focus_ready_key);

    // Move focus away from input
    test_driver.send_keys(document.documentElement, '\uE004');

    var focus_result = await nextValueFromServer(focus_changed_key);
    combined_events.push(...focus_result.split(','));

    // Now cycle reset focus to another element and continue.
    document.getElementById('input').focus();
    test_driver.send_keys(document.documentElement, '\uE004');

    focus_result = await nextValueFromServer(focus_changed_key);
    combined_events.push(...events);
    combined_events.push(...focus_result.split(','));

    var expected_events = [
        "input/focus",
        "input/blur",
        "fencedframe_input/focus",
        "fencedframe_input/blur",
        "fencedframe_select/focus",
        "fencedframe_select/blur",
        "input/focus",
        "input/blur",
        "fencedframe_input/focus",
        "fencedframe_input/blur",
        "fencedframe_select/focus",
        "fencedframe_select/blur",
    ];
    assert_array_equals(combined_events, expected_events, "events do not match");
  });
</script>
chromium/third_party/blink/web_tests/wpt_internal/fenced_frame/tab-focus-last-element.https.html
