chromium/third_party/blink/web_tests/media/controls/keynav-display-none.html

<!DOCTYPE html>
<meta charset="utf-8">
<link rel="author" title="Di Zhang" href="mailto:[email protected]">
<link rel="help" href="https://crbug.com/1510366">
<title>Media inside hidden element should not receive focus.</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>

<button id="start">start</button>
<div style="display: none">
  <video controls></video>
  <button>inside</button>
</div>
<button id="end">end</button>

<script>
test(function(t) {
  const video = document.querySelector('video');
  video.src = "../content/test.ogv";

  const start = document.getElementById('start');
  const end = document.getElementById('end');

  start.focus();
  assert_equals(document.activeElement, start);
  eventSender.keyDown('\t');
  assert_equals(document.activeElement, end);
}, `Verifies that focus only goes between elements that are displayed.`);

</script>