Testing - Password

Pristine

<hx-password-control>

<input type="password">

:valid	:invalid
Pristine, Optional, Enabled, Valid (blur) Pristine, Optional, Enabled, Valid (focus)	Pristine, Optional, Enabled, Invalid (blur) Pristine, Optional, Enabled, Invalid (focus)
Pristine, Optional, Disabled, Valid (blur) Pristine, Optional, Disabled, Valid (focus)	Pristine, Optional, Disabled, Invalid (blur) Pristine, Optional, Disabled, Invalid (focus)

<input type="password" required>

:valid	:invalid
Pristine, Required, Enabled, Valid (blur) Pristine, Required, Enabled, Valid (focus)	Pristine, Required, Enabled, Invalid (blur) Pristine, Required, Enabled, Invalid (focus)
Pristine, Required, Disabled, Valid (blur) Pristine, Required, Disabled, Valid (focus)	Pristine, Required, Disabled, Invalid (blur) Pristine, Required, Disabled, Invalid (focus)

<hx-password-control hx-dirty>

<input type="password">

:valid	:invalid
Dirty, Optional, Enabled, Valid (blur) Dirty, Optional, Enabled, Valid (focus)	Dirty, Optional, Enabled, Invalid (blur) Dirty, Optional, Enabled, Invalid (focus)
Dirty, Optional, Disabled, Valid (blur) Dirty, Optional, Disabled, Valid (focus)	Dirty, Optional, Disabled, Invalid (blur) Dirty, Optional, Disabled, Invalid (focus)

<input type="password" required>

:valid	:invalid
Dirty, Required, Enabled, Valid (blur) Dirty, Required, Enabled, Valid (focus)	Dirty, Required, Enabled, Invalid (blur) Dirty, Required, Enabled, Invalid (focus)
Dirty, Required, Disabled, Valid (blur) Dirty, Required, Disabled, Valid (focus)	Dirty, Required, Disabled, Invalid (blur) Dirty, Required, Disabled, Invalid (focus)

<hx-password-control class="hxInvalid">

<input type="password">

:valid	:invalid
.hxInvalid, Optional, Enabled, Valid (blur) .hxInvalid, Optional, Enabled, Valid (focus)	.hxInvalid, Optional, Enabled, Invalid (blur) .hxInvalid, Optional, Enabled, Invalid (focus)
.hxInvalid, Optional, Disabled, Valid (blur) .hxInvalid, Optional, Disabled, Valid (focus)	.hxInvalid, Optional, Disabled, Invalid (blur) .hxInvalid, Optional, Disabled, Invalid (focus)

<input type="password" required>

:valid	:invalid
.hxInvalid, Required, Enabled, Valid (blur) .hxInvalid, Required, Enabled, Valid (focus)	.hxInvalid, Required, Enabled, Invalid (blur) .hxInvalid, Required, Enabled, Invalid (focus)
.hxInvalid, Required, Disabled, Valid (blur) .hxInvalid, Required, Disabled, Valid (focus)	.hxInvalid, Required, Disabled, Invalid (blur) .hxInvalid, Required, Disabled, Invalid (focus)

<input type="password" placeholder="Please Enter Password" />

Valid w/ Placeholder

Invalid w/ Placeholder

Disabled w/ Placeholder

Extra elements should not be visible.

input + label

Password

input + label.hxRequired

Password

input + label + div

Password

DIV