summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/html/interaction/focus/the-autofocus-attribute/supported-elements.html
blob: 29b3f3fb7b6c361ac6f6435f8ddf8ac4b0302b65 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<meta charset="utf-8">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/utils.js"></script>
<script>
"use strict";

promise_test(async t => {
  let w = window.open('/common/blank.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  w.document.body.innerHTML = '<div contenteditable=true autofocus></div>';
  await waitUntilStableAutofocusState(w);
  assert_equals(w.document.activeElement.tagName, 'DIV');
}, 'Contenteditable element should support autofocus');

promise_test(async t => {
  let w = window.open('/common/blank.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  w.document.body.innerHTML = '<span tabindex=0 autofocus></span>';
  await waitUntilStableAutofocusState(w);
  assert_equals(w.document.activeElement.tagName, 'SPAN');
}, 'Element with tabindex should support autofocus');

promise_test(async t => {
  let w = window.open('/common/blank.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  let element = w.document.createElementNS('uri1', 'prefix:local');
  element.setAttribute('autofocus', '');
  w.document.body.appendChild(element);
  await waitUntilStableAutofocusState(w);
  assert_equals(w.document.activeElement.tagName, 'BODY');
}, 'Non-HTMLElement should not support autofocus');

promise_test(async t => {
  let w = window.open('/common/blank.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  const host = w.document.createElement('div');
  host.autofocus = true;
  const shadow = host.attachShadow({mode:'closed', delegatesFocus:true});
  shadow.appendChild(w.document.createElement('input'));
  w.document.body.appendChild(host);
  await waitUntilStableAutofocusState(w);
  assert_equals(w.document.activeElement, host);
  assert_equals(shadow.activeElement.tagName, 'INPUT');
}, 'Host element with delegatesFocus should support autofocus');

promise_test(async t => {
  let w = window.open('/common/blank.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  const host = w.document.createElement('div');
  host.autofocus = true;
  host.attachShadow({mode:'closed', delegatesFocus:true});
  w.document.body.appendChild(host);
  const next = w.document.createElement('input');
  next.autofocus = true;
  w.document.body.appendChild(next);
  await waitUntilStableAutofocusState(w);
  assert_equals(w.document.activeElement, next);
}, 'Host element with delegatesFocus including no focusable descendants should be skipped');

promise_test(async t => {
  let w = window.open('./resources/imagemap.html');
  await waitForLoad(w);
  t.add_cleanup(() => { w.close(); });
  const area = w.document.createElement('area');
  area.autofocus = true;
  area.shape = 'rect';
  area.coords = '1,1,99,99';
  area.href = '/common/blank.html';
  w.document.querySelector('map').appendChild(area);
  await waitUntilStableAutofocusState(w);
  // According to the specification, DOM anchor for an AREA shape is an IMG
  // element, but major browsers don't follow it.
  // See https://github.com/whatwg/html/issues/5054
  assert_equals(w.document.activeElement, area);
}, 'Area element should support autofocus');
</script>