HTML: Set focus in ElementInternals-reportValidity-bubble-notref.html

[zcorpan]

The test currently passes in Firefox and Safari despite not showing a validation message because reportValidity() sets focus, and the element in notref did not have focus.

[rniwa]

The test currently passes in Firefox and Safari despite not showing a validation message because reportValidity() sets focus, and the element in notref did not have focus.

Safari definitely shows the validation message. But that happens outside of the viewport as a separate popup so perhaps the test harness isn't smart enough to capture it?

[zcorpan]

@rniwa ah, my bad. I was testing http://wpt.live/custom-elements/form-associated/ElementInternals-reportValidity-bubble.html manually and somehow didn't see the popup in Safari TP, but I see it now. Since the test passes there are no screenshots available in wpt.fyi.

The test still passes in Firefox though, which is not what I expected: https://wpt.fyi/results/custom-elements/form-associated/ElementInternals-reportValidity-bubble.html?sha=76665c1ae6&label=pr_head

The relevant Gecko bug is https://bugzilla.mozilla.org/show_bug.cgi?id=1915786

[rniwa]

ok, this seems like an improvement in any case.

[zcorpan]

I changed the test to more closely match what seems to happen in browsers, which is to focus the input element. Now the test fails in Firefox, as expected. Though this doesn't match what the spec says, which tries to focus the custom element instead of the validation anchor element. I'll file a spec issue. Edit: whatwg/html#10600

Interestingly, in Live DOM Viewer, Firefox does show the validation error. https://software.hixie.ch/utilities/js/live-dom-viewer/saved/13058

[zcorpan]

I have changed the test to leave space above the control and wait with taking the screenshot, in case the validation bubble doesn't show up immediately. But it still fails in Safari TP in wpt.fyi.