[csswg-drafts] [css-selectors-4] `:user-invalid` and `:user-valid` should not require a blur event to trigger (#9583)

argyleink has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-selectors-4] `:user-invalid` and `:user-valid` should not require a blur event to trigger ==
I think we should remove [this line from the spec](https://drafts.csswg.org/selectors-4/#user-pseudos:~:text=and%20changed%20the%20focus%20to%20another%20element): `and changed the focus to another element`.

The goal of this selector is to signal a user has actually touched (focused in) and changed the value of the input. It has nothing to do with blur or moving to another input. It's more about a hook for authors to know it's a good time to show the validity of the input because a user has "tried" something. 

Before :user-valid, the signal was premature, sent on form load, before a user has had a chance to interact, showing errors states when they havent even done anything.

https://codepen.io/web-dot-dev/pen/wvNJGrO

In the above demo, each input is empty and invalid. Type some information, it becomes valid, but should additionally be user-valid, not awaiting blur to trigger. Furthermore, browsers do the proposed behavior in this issue, but only after blur; meaning **subsequent interactions with the input do realtime trigger user-invalid and user-valid**. I'm proposing this is how it always is, and isn't gated by a one time blur event. I'm also pointing out that the implementations from browsers seem confused on the spec prose as well, only respecting the "changed focus" clause on interactions before blur, not after. This proposal change would make the behavior consistent and more desirable to authors.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9583 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 9 November 2023 18:21:16 UTC