[whatwg] :invalid

[whatwg at alanhogan.com]

On Fri, Dec 31, 2010 at 3:28 AM, Mounir Lamouri <mounir.lamouri at gmail.com> wrote:
> On 12/31/2010 02:13 AM, Ian Hickson wrote:
> > On Thu, 23 Sep 2010, Mounir Lamouri wrote:
> >>
> >> The current specification of :invalid is pretty simple: it matches all
> >> invalid elements which are candidate for constraint validation.
> >>
> >> … Unfortunately, :invalid is far from being perfect and most
> >> UI/UX guys would tell you that the current :invalid behavior is really
> >> bad. For example, having the invalid style applying as soon as you load
> >> the page (ie. for <input required>) is not a good thing. 
> >>

I consider myself a UI/UX guy and I completely agree on this point.

> Since then, we have implemented something you can try with Firefox
> 4.0b8: :-moz-ui-invalid and :-moz-ui-valid. By default, all element
> matching :-moz-ui-invalid have a red box shadow.
>
> The rules for :-moz-ui-invalid are the following:
> a. When not focused (AND list)
>  1. The element has its default value changed OR the element is in a
> form that the user tried to submit (but was invalid) ;
>  2. The element is invalid (:invalid applies).
> b. When focused (OR list):
>  1. If the element had :-moz-ui-invalid before it was focused,
> :-moz-ui-invalid applies if the element is invalid (IOW, if the element
> was valid or no style was applying, the element will not be shown as
> invalid as long as the user do not blur the elemnet) ;
>  2. Otherwise, :-moz-ui-invalid will not apply as long as the element is
> focused.
>

This sounds fantastic. I will have to play with this beta, but it sounds like exactly what UAs should be doing to let authors easily create a fantastic user experience.

Alan Hogan