1648733 - missing console warning when an invalid and hidden form control is not focusable

Status: VERIFIED FIXED

(Core :: DOM: Forms, defect)

Description

[marco acorte]

Attachment: google-chrome-83-windows.jpg

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:77.0) Gecko/20100101 Firefox/77.0

Steps to reproduce:

click on a submit button in a form with hidden and invalid input
test form here to reproduce... https://www.codeply.com/p/F2laD7MDjv

Actual results:

in the developer console there are no warnings regarding the impossibility of placing the focus on the control

Expected results:

in the developer console there should be a warning.
ex: An invalid form control with name='inputfilehidden' is not focusable.

ps. I copied the message from other chromium based browsers (ms-edge/google chrome)

Comment 1

[marco acorte]

Attachment: ms-edge.jpg

Comment 2

[marco acorte]

Attachment: firefox77-windows.png

Comment 3

[marco acorte]

the biggest problem in the lack of warning in the console that in the web development phase the problem is not noticed

Comment 4

[BugBot [:suhaib / :marco/ :calixte]]

Bugbug thinks this bug should belong to this component, but please revert this change in case of error.

Comment 5

[Nicolas Chevobbe [:nchevobbe]]

Yura, is this something that is/should be handled by the Accessibility panel? or should we have an error like in Chromium-based browsers?

Comment 6

[Yura Zenevich [:yzen] (please use "needinfo")]

I'm not sure this is an issue. I would probably categorize it as an author error. I'm curious why there's an expectation of something that has display:hidden to be focusable. In fact the accessibility issue would've been if something was focusable in a hidden subtree (e.g. inaccessible to assistive tech).

Accessibility panel will not catch this on audit because hidden elements will not have an accessible object in the first place.

I guess though, this bug reminds me of a conversation about having, possibly, a filter category for console messages that are related to accessibility. Maybe we should revisit it at some point sooner rather than later?

Comment 7

[marco acorte]

@yura i agree with you, it's not an Accessibility issue, imho this is just a lack of diagnostic messages in the consoles that do not allow the webdeveloper (the main user of the webdev console) to understand what's going on.

in my opinion it's dev tools bug , the effect of making an invisible field mandatory (sure it's a webdeveloper/author fault) is that the form is not submitted at all.

There are no traces in the network console and there are no traces in the javascript console.

in this way the developer/author has no help from webtools to understand what's going on and that's why, in my opinion, a diagnostic message (as other browsers do) would be a clarifier

Comment 8

[Nicolas Chevobbe [:nchevobbe]]

Let's see if the DOM team can help here

Comment 9

[marco acorte]

(In reply to Nicolas Chevobbe [:nchevobbe] from comment #8)

Let's see if the DOM team can help here

i think it's related to firefox built-in form validation of HTML5 form controls, that try (without success) to put focus on the first and only hidden invalid field.

Comment 10

[Vincent Hilla [:vhilla]]

Attachment: Bug 1648733 - Report invalid and hidden form controls to console. r=#dom-core

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/0b493a86f116
Report invalid and hidden form controls to console. r=dom-core,jjaschke

Comment 12

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/0b493a86f116

Comment 13

[Ardelean Oana, Desktop QA [:oardelean]]

Reproducible on a 2023-10-28 Nightly build on Windows 10.
Verified as fixed on Firefox 121.0 and Nightly 122.0a1 on Windows 10, Ubuntu 22, macOS 12.