Click focus testing

This table shows how every interactive element responds to clicks focusing on the element (or some delegated element). The tests run check for these aspects:

• The :focus selector matches the element or its delegate
• The activeElement matches the element or its delegate
• The following events dispatch in order:

  1. mousedown

  2. blur

  3. focusout

  4. focus

  5. focusin

  6. mouseup

  7. click

To run a test, click into the "start here" input, then click the blue element (usually with the text "click me").

Tests for click focusability

Description	Expected Results	Element	Safari	Firefox	Chrome	Edge
Focusable Elements
Text input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
number input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
checkbox input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT	click this checkbox (this text is not a label)	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
radio input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT	click this radio button (this text is not a label)	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
radio group	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT	click this radio button (this text is not a label)	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
color input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Partial On Windows devices, the :focus selector does not match. Passes tests on MacOS.	Pass	Pass
date input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.
datetime-local input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.
email input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
file input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Partial Clicking on the generated button element does not make the input match the :focus selector	Partial Clicking on the generated button element does not make the input match the :focus selector	Partial Clicking on the generated button element does not make the input match the :focus selector
image input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
month input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.
password input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
button input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
range input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
reset input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
search input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
submit input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
tel input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
time input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.
url input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
week input	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.	Partial On MacOS, :focus selector does not match the <input> if the calendar picker button is clicked. Passes test on Windows.
textarea	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element TEXTAREA :focus matches TEXTAREA		Pass	Pass	Pass	Pass
select	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element SELECT :focus matches SELECT	1 2 3	Pass	Pass	Pass	Pass
button	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	Click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Button with nested elements	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
reset button	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
submit button	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
anchor with href	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element A :focus matches A	click me	Partial Focus goes to the body after clicking an anchor element with an href attribute. If only a mousedown event is dispatched on the element (i.e. you do not release the mouse button) then the element becomes focused	Partial Focus goes to the body after clicking an anchor element with an href attribute. If only a mousedown event is dispatched on the element (i.e. you do not release the mouse button) then the element becomes focused	Partial Focus goes to the body after clicking an anchor element with an href attribute. If only a mousedown event is dispatched on the element (i.e. you do not release the mouse button) then the element becomes focused	Partial Focus goes to the body after clicking an anchor element with an href attribute. If only a mousedown event is dispatched on the element (i.e. you do not release the mouse button) then the element becomes focused
Area with href	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element AREA :focus matches AREA		Partial Focus goes to the body after clicking an anchor element with an href attribute. The "focus" and "focusin" events are dispatched, though.	Fail Focus goes to the body after clicking an anchor element with an href attribute. A set of "blur" and "focusout" events are dispatched on the <area> immediately after the "focusin" event.	Partial Focus goes to the body after clicking an anchor element with an href attribute. The "focus" and "focusin" events are dispatched, though.	Partial Focus goes to the body after clicking an anchor element with an href attribute. The "focus" and "focusin" events are dispatched, though.
contenteditable attribute on div	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element DIV :focus matches DIV	Click me	Pass	Pass	Pass	Pass
contenteditable="false" and tabindex="-1" on div	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element DIV :focus matches DIV	Click me	Pass	Pass	Pass	Pass
Tabindex	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element DIV :focus matches DIV	Click me	Pass	Pass	Pass	Pass
Tabindex (empty attribute)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Tabindex (non-numeric value)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Tabindex (non-numeric value set by Element API)	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element DIV :focus matches DIV	Click me	Pass	Pass	Pass	Pass
Details with summary	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element SUMMARY :focus matches SUMMARY	Click me other content	Pass	Pass	Pass	Pass
Audio	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element AUDIO :focus matches AUDIO		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of an <audio> element or its controls.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of an <audio> element or its controls. :focus styles do not apply to the <audio> element if the control elements are clicked, but the <audio> element still becomes the active element.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of an <audio> element or its controls. :focus styles do not apply to the <audio> element if the control elements are clicked, but the <audio> element still becomes the active element.
Video with controls	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element VIDEO :focus matches VIDEO		Fail The <video> element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of a <video> element or its controls.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of a <video> element's controls. Mouse events do dispatch if some other area of the <video> element is clicked.	Partial No mouse events ("mousedown", "mouseup", and "click") are dispatched when clicking on any part of a <video> element's controls. Mouse events do dispatch if some other area of the <video> element is clicked.
Visible input within invisible div	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
Visible checkbox within invisible div	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Unfocusable Elements (disabled, inert, unrendered, or invalid)
Disabled input	Expected Actual Events blur focusout Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
Disabled fieldset	Expected Actual Events blur focusout Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
Inert input	Expected Actual Events blur focusout Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
Inert tree	Expected Actual Events blur focusout Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
anchor without href	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	click me	Pass	Pass	Pass	Pass
Area without href	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
contenteditable="false"	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Inert div with contenteditable attribute	Expected Actual Events blur focusout Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Inert div with tabindex attribute	Expected Actual Events blur focusout Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Details with multiple summary elements. Summary elements other than the first should not be click focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	(first summary element) Click me (second summary element)	Pass	Pass	Pass	Pass
Video (no controls)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null		Pass	Fail Video element is focusable but shouldn't be. It matches the :focus selector, becomes the active element and dispatches "focus" and "focusin" events.	Pass	Pass
Labeled Elements
Wrapping (some tests are repeated with text inputs and checkboxes to check Safari)
Label wrapping text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label wrapping checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox does not recieve focus. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Focusable label wrapping text input	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Focusable label wrapping checkbox	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox does not recieve focus. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Label wrapping disabled text input	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping disabled checkbox	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping inert text input	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping inert checkbox	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping unrendered text input (visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
label wrapping visible input within invisible div	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order.	Pass	Pass	Pass
Label wrapping unrendered checkbox (visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
label wrapping visible checkbox within invisible div	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label wrapping unrendered text input (content-visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	content-visibility is not supported in this browser	content-visibility is not supported in this browser	Partial No "focus" or "focusin" events are dispatched (correctly) but the <input> becomes the active element and matches the :focus selector (incorrectly).	Partial No "focus" or "focusin" events are dispatched (correctly) but the <input> becomes the active element and matches the :focus selector (incorrectly).
Label wrapping unrendered checkbox (content-visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	content-visibility is not supported in this browser	content-visibility is not supported in this browser	Partial No "focus" or "focusin" events are dispatched (correctly) but the <input> becomes the active element and matches the :focus selector (incorrectly).	Partial No "focus" or "focusin" events are dispatched (correctly) but the <input> becomes the active element and matches the :focus selector (incorrectly).
Label wrapping unrendered text input (display: none;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping unrendered checkbox (display: none;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label wrapping focusable non-labelable element	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me Am I focused?	Pass	Pass	Pass	Pass
Label wrapping non-focusable labelable element Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label wrapping focusable labelable element (progress bar with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element PROGRESS :focus matches PROGRESS	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label wrapping non-focusable labelable element (meter bar) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label wrapping focusable labelable element (meter bar with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element METER :focus matches METER	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label wrapping non-focusable labelable element (output) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label wrapping focusable labelable element (output with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element OUTPUT :focus matches OUTPUT	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute but no target wrapping text input	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label with "for" attribute but no target wrapping checkbox	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label with "for" attribute wrapping text input that is not the target of the "for" attribute	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute wrapping checkbox that is not the target of the "for" attribute	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Wrapping AND Targeting (some tests are repeated with text inputs and checkboxes to check Safari)
Label with "for" attribute wrapping text input it targets	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute wrapping checkbox it targets	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox does not recieve focus. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Label with valid text input target within label targeting other text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Pass	Pass
Label with valid checkbox target within label targeting other checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Element does not become focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label with valid text input target within label targeting other text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Pass	Pass
Label with valid checkbox target within label targeting other checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Element does not become focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label with valid text input target within label targeting other text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Pass	Pass
Label with valid checkbox target within label targeting other checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Element does not become focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label with valid text input target within label targeting other text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Pass	Pass
Label with valid checkbox target within label targeting other checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Element does not become focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label without wrapped or targeted element within label with valid text input target	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label without wrapped or targeted element within label with valid checkbox target	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label without wrapped or targeted element within label with text input descendant	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label without wrapped or targeted element within label with checkbox descendant	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Targeting (some tests are repeated with text inputs and checkboxes to check Safari)
Label targeting non-focusable labelable element (progress bar) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label targeting focusable labelable element (progress bar with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element PROGRESS :focus matches PROGRESS	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label targeting non-focusable labelable element (meter bar) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label targeting focusable labelable element (meter bar with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element METER :focus matches METER	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label targeting non-focusable labelable element (output) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me 70%	Pass	Pass	Pass	Pass
Label targeting focusable labelable element (output with tabindex) Explanation Elements that can be associated with a <label> element include <button>, <input> (except for type="hidden"), <meter>, <output>, <progress>, <select> and <textarea>. Meters, outputs, and progress elements are not natively focusable.	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element OUTPUT :focus matches OUTPUT	Click me 70%	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute targeting text input	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute targeting checkbox	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Label with "for" attribute that matches multiple text inputs	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order. The focused element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label with "for" attribute that matches multiple checkboxes	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Label with "for" attribute that matches multiple text inputs, the first of which is unfocusable	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label with "for" attribute that matches multiple checkboxes, the first of which is unfocusable	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting disabled text input	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting disabled checkbox	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting inert text input	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting inert checkbox	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting unrendered text input (visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
label targeting visible input within invisible div	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events dispatched out of order.	Pass	Pass	Pass
Label targeting unrendered checkbox (visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
label targeting visible checkbox within invisible div	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail The element never becomes focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Label targeting unrendered text input (content-visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	content-visibility is not supported in this browser	content-visibility is not supported in this browser	Pass	Pass
Label targeting unrendered checkbox (content-visibility: hidden;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	content-visibility is not supported in this browser	content-visibility is not supported in this browser	Pass	Pass
Label targeting unrendered text input (display: none;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting unrendered checkbox (display: none;)	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me	Pass	Pass	Pass	Pass
Label targeting focusable non-labelable element	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null	Click me Am I focused?	Pass	Pass	Pass	Pass
Label within a button that has a valid text input target	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial The <button> element never dispatches "focus", "focusin", "blur", or "focusout" events. The targeted element dispatches the "click" event before dispatching "focus" and "focusin" events.	Pass	Pass	Pass
Label within a button that has a valid checkbox target	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
button within label that has valid text input target	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	Click me	Fail Button is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
button within label that has valid checkbox target	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	Click me	Fail Button is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Focusable click target within label that targets text input	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Partial Events are dispatched out of order.	Pass	Pass	Pass
Focusable click target within label that targets checkbox	Expected Actual Events mousedown blur focusout focus focusin mouseup click blur focusout focus focusin click Active Element INPUT :focus matches INPUT	Click me	Fail Checkbox is not focused. No "focus" or "focusin" events are dispatched.	Pass	Pass	Pass
Label without "for" attribute within a button	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element BUTTON :focus matches BUTTON	Click me	Fail Element does not become focused. No "focus" or "focusin" events are dispatched, it does not become the active element, and it does not match the :focus selector.	Pass	Pass	Pass
Web Components
With unfocusable shadow element click target	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
With focusable shadow element click target	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element WEB-COMPONENT-00 Active Shadow Element INPUT :focus matches WEB-COMPONENT-00		Pass	Pass	Pass	Pass
With focusable light element click target	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
Labeled form associated	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element WEB-COMPONENT-6 :focus matches WEB-COMPONENT-6	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Pass	Pass
Delegates Focus
With focusable shadow element	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element WEB-COMPONENT-1 Active Shadow Element INPUT :focus matches WEB-COMPONENT-1		Pass	Pass	Pass	Pass
With unfocusable shadow element	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element WEB-COMPONENT-5 Active Shadow Element INPUT :focus matches WEB-COMPONENT-5		Pass	Pass	Pass	Pass
Without focusable shadow element	Expected Actual Events mousedown blur focusout mouseup click Active Element BODY :focus matches null		Pass	Pass	Pass	Pass
With multiple focusable shadow elements	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element WEB-COMPONENT-2 Active Shadow Element INPUT :focus matches WEB-COMPONENT-2		Pass	Pass	Pass	Pass
Focusable light element	Expected Actual Events mousedown blur focusout focus focusin mouseup click Active Element INPUT :focus matches INPUT		Pass	Pass	Pass	Pass
Labeled form associated	Expected Actual Events mousedown blur focusout mouseup click focus focusin click Active Element WEB-COMPONENT-7 :focus matches WEB-COMPONENT-7	Click me	Partial Events dispatched out of order. "click" event is dispatched before "focus" and "focusin" on the focused element.	Pass	Partial Events dispatched out of order.	Partial Events dispatched out of order.