mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Bug 717181 - Make <fieldset> invalid if they contain an invalid form control; r=mounir
This adds a CSS psuedo class to fieldset that acts much in the same way as the one on form.
This commit is contained in:
parent
46c6e64d77
commit
a87af7052e
@ -15,6 +15,7 @@ class nsFormSubmission;
|
||||
namespace mozilla {
|
||||
namespace dom {
|
||||
class Element;
|
||||
class HTMLFieldSetElement;
|
||||
} // namespace dom
|
||||
} // namespace mozilla
|
||||
|
||||
@ -87,6 +88,12 @@ public:
|
||||
|
||||
NS_DECLARE_STATIC_IID_ACCESSOR(NS_IFORMCONTROL_IID)
|
||||
|
||||
/**
|
||||
* Get the fieldset for this form control.
|
||||
* @return the fieldset
|
||||
*/
|
||||
virtual mozilla::dom::HTMLFieldSetElement *GetFieldSet() = 0;
|
||||
|
||||
/**
|
||||
* Get the form for this form control.
|
||||
* @return the form
|
||||
|
@ -17,12 +17,13 @@ HTMLFieldSetElement::HTMLFieldSetElement(already_AddRefed<nsINodeInfo> aNodeInfo
|
||||
: nsGenericHTMLFormElement(aNodeInfo)
|
||||
, mElements(nullptr)
|
||||
, mFirstLegend(nullptr)
|
||||
, mInvalidElementsCount(0)
|
||||
{
|
||||
// <fieldset> is always barred from constraint validation.
|
||||
SetBarredFromConstraintValidation(true);
|
||||
|
||||
// We start out enabled
|
||||
AddStatesSilently(NS_EVENT_STATE_ENABLED);
|
||||
// We start out enabled and valid.
|
||||
AddStatesSilently(NS_EVENT_STATE_ENABLED | NS_EVENT_STATE_VALID);
|
||||
}
|
||||
|
||||
HTMLFieldSetElement::~HTMLFieldSetElement()
|
||||
@ -210,6 +211,32 @@ HTMLFieldSetElement::RemoveChildAt(uint32_t aIndex, bool aNotify)
|
||||
}
|
||||
}
|
||||
|
||||
void
|
||||
HTMLFieldSetElement::AddElement(nsGenericHTMLFormElement* aElement)
|
||||
{
|
||||
mDependentElements.AppendElement(aElement);
|
||||
|
||||
// We need to update the validity of the fieldset.
|
||||
nsCOMPtr<nsIConstraintValidation> cvElmt = do_QueryObject(aElement);
|
||||
if (cvElmt &&
|
||||
cvElmt->IsCandidateForConstraintValidation() && !cvElmt->IsValid()) {
|
||||
UpdateValidity(false);
|
||||
}
|
||||
}
|
||||
|
||||
void
|
||||
HTMLFieldSetElement::RemoveElement(nsGenericHTMLFormElement* aElement)
|
||||
{
|
||||
mDependentElements.RemoveElement(aElement);
|
||||
|
||||
// We need to update the validity of the fieldset.
|
||||
nsCOMPtr<nsIConstraintValidation> cvElmt = do_QueryObject(aElement);
|
||||
if (cvElmt &&
|
||||
cvElmt->IsCandidateForConstraintValidation() && !cvElmt->IsValid()) {
|
||||
UpdateValidity(true);
|
||||
}
|
||||
}
|
||||
|
||||
void
|
||||
HTMLFieldSetElement::NotifyElementsForFirstLegendChange(bool aNotify)
|
||||
{
|
||||
@ -231,6 +258,46 @@ HTMLFieldSetElement::NotifyElementsForFirstLegendChange(bool aNotify)
|
||||
}
|
||||
}
|
||||
|
||||
void
|
||||
HTMLFieldSetElement::UpdateValidity(bool aElementValidity)
|
||||
{
|
||||
if (aElementValidity) {
|
||||
--mInvalidElementsCount;
|
||||
} else {
|
||||
++mInvalidElementsCount;
|
||||
}
|
||||
|
||||
MOZ_ASSERT(mInvalidElementsCount >= 0);
|
||||
|
||||
// The fieldset validity has just changed if:
|
||||
// - there are no more invalid elements ;
|
||||
// - or there is one invalid elmement and an element just became invalid.
|
||||
if (!mInvalidElementsCount || (mInvalidElementsCount == 1 && !aElementValidity)) {
|
||||
UpdateState(true);
|
||||
}
|
||||
|
||||
// We should propagate the change to the fieldset parent chain.
|
||||
if (mFieldSet) {
|
||||
mFieldSet->UpdateValidity(aElementValidity);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
nsEventStates
|
||||
HTMLFieldSetElement::IntrinsicState() const
|
||||
{
|
||||
nsEventStates state = nsGenericHTMLFormElement::IntrinsicState();
|
||||
|
||||
if (mInvalidElementsCount) {
|
||||
state |= NS_EVENT_STATE_INVALID;
|
||||
} else {
|
||||
state |= NS_EVENT_STATE_VALID;
|
||||
}
|
||||
|
||||
return state;
|
||||
}
|
||||
|
||||
JSObject*
|
||||
HTMLFieldSetElement::WrapNode(JSContext* aCx, JS::Handle<JSObject*> aScope)
|
||||
{
|
||||
|
@ -55,13 +55,9 @@ public:
|
||||
|
||||
const nsIContent* GetFirstLegend() const { return mFirstLegend; }
|
||||
|
||||
void AddElement(nsGenericHTMLFormElement* aElement) {
|
||||
mDependentElements.AppendElement(aElement);
|
||||
}
|
||||
void AddElement(nsGenericHTMLFormElement* aElement);
|
||||
|
||||
void RemoveElement(nsGenericHTMLFormElement* aElement) {
|
||||
mDependentElements.RemoveElement(aElement);
|
||||
}
|
||||
void RemoveElement(nsGenericHTMLFormElement* aElement);
|
||||
|
||||
NS_DECL_CYCLE_COLLECTION_CLASS_INHERITED(HTMLFieldSetElement,
|
||||
nsGenericHTMLFormElement)
|
||||
@ -97,6 +93,21 @@ public:
|
||||
|
||||
// XPCOM SetCustomValidity is OK for us
|
||||
|
||||
virtual nsEventStates IntrinsicState() const;
|
||||
|
||||
|
||||
/*
|
||||
* This method will update the fieldset's validity. This method has to be
|
||||
* called by fieldset elements whenever their validity state or status regarding
|
||||
* constraint validation changes.
|
||||
*
|
||||
* @note If an element becomes barred from constraint validation, it has to
|
||||
* be considered as valid.
|
||||
*
|
||||
* @param aElementValidityState the new validity state of the element
|
||||
*/
|
||||
void UpdateValidity(bool aElementValidityState);
|
||||
|
||||
protected:
|
||||
virtual JSObject* WrapNode(JSContext* aCx,
|
||||
JS::Handle<JSObject*> aScope) MOZ_OVERRIDE;
|
||||
@ -120,10 +131,17 @@ private:
|
||||
nsTArray<nsGenericHTMLFormElement*> mDependentElements;
|
||||
|
||||
nsIContent* mFirstLegend;
|
||||
|
||||
/**
|
||||
* Number of invalid and candidate for constraint validation
|
||||
* elements in the fieldSet the last time UpdateValidity has been called.
|
||||
*
|
||||
* @note Should only be used by UpdateValidity() and IntrinsicState()!
|
||||
*/
|
||||
int32_t mInvalidElementsCount;
|
||||
};
|
||||
|
||||
} // namespace dom
|
||||
} // namespace mozilla
|
||||
|
||||
#endif /* mozilla_dom_HTMLFieldSetElement_h */
|
||||
|
||||
|
@ -2105,6 +2105,12 @@ nsGenericHTMLFormElement::GetFormElement()
|
||||
return mForm;
|
||||
}
|
||||
|
||||
HTMLFieldSetElement*
|
||||
nsGenericHTMLFormElement::GetFieldSet()
|
||||
{
|
||||
return mFieldSet;
|
||||
}
|
||||
|
||||
nsresult
|
||||
nsGenericHTMLFormElement::GetForm(nsIDOMHTMLFormElement** aForm)
|
||||
{
|
||||
|
@ -1275,6 +1275,7 @@ public:
|
||||
virtual void SaveSubtreeState() MOZ_OVERRIDE;
|
||||
|
||||
// nsIFormControl
|
||||
virtual mozilla::dom::HTMLFieldSetElement* GetFieldSet();
|
||||
virtual mozilla::dom::Element* GetFormElement() MOZ_OVERRIDE;
|
||||
mozilla::dom::HTMLFormElement* GetForm() const
|
||||
{
|
||||
|
@ -8,12 +8,16 @@
|
||||
#include "nsAString.h"
|
||||
#include "nsGenericHTMLElement.h"
|
||||
#include "mozilla/dom/HTMLFormElement.h"
|
||||
#include "mozilla/dom/HTMLFieldSetElement.h"
|
||||
#include "mozilla/dom/ValidityState.h"
|
||||
#include "nsIFormControl.h"
|
||||
#include "nsContentUtils.h"
|
||||
|
||||
const uint16_t nsIConstraintValidation::sContentSpecifiedMaxLengthMessage = 256;
|
||||
|
||||
using namespace mozilla;
|
||||
using namespace mozilla::dom;
|
||||
|
||||
nsIConstraintValidation::nsIConstraintValidation()
|
||||
: mValidityBitField(0)
|
||||
// By default, all elements are subjects to constraint validation.
|
||||
@ -131,16 +135,20 @@ nsIConstraintValidation::SetValidityState(ValidityStateType aState,
|
||||
mValidityBitField &= ~aState;
|
||||
}
|
||||
|
||||
// Inform the form element if our validity has changed.
|
||||
// Inform the form and fieldset elements if our validity has changed.
|
||||
if (previousValidity != IsValid() && IsCandidateForConstraintValidation()) {
|
||||
nsCOMPtr<nsIFormControl> formCtrl = do_QueryInterface(this);
|
||||
NS_ASSERTION(formCtrl, "This interface should be used by form elements!");
|
||||
|
||||
mozilla::dom::HTMLFormElement* form =
|
||||
static_cast<mozilla::dom::HTMLFormElement*>(formCtrl->GetFormElement());
|
||||
HTMLFormElement* form =
|
||||
static_cast<HTMLFormElement*>(formCtrl->GetFormElement());
|
||||
if (form) {
|
||||
form->UpdateValidity(IsValid());
|
||||
}
|
||||
HTMLFieldSetElement* fieldSet = formCtrl->GetFieldSet();
|
||||
if (fieldSet) {
|
||||
fieldSet->UpdateValidity(IsValid());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -158,20 +166,24 @@ nsIConstraintValidation::SetBarredFromConstraintValidation(bool aBarred)
|
||||
|
||||
mBarredFromConstraintValidation = aBarred;
|
||||
|
||||
// Inform the form element if our status regarding constraint validation
|
||||
// is going to change.
|
||||
// Inform the form and fieldset elements if our status regarding constraint
|
||||
// validation is going to change.
|
||||
if (!IsValid() && previousBarred != mBarredFromConstraintValidation) {
|
||||
nsCOMPtr<nsIFormControl> formCtrl = do_QueryInterface(this);
|
||||
NS_ASSERTION(formCtrl, "This interface should be used by form elements!");
|
||||
|
||||
mozilla::dom::HTMLFormElement* form =
|
||||
static_cast<mozilla::dom::HTMLFormElement*>(formCtrl->GetFormElement());
|
||||
// If the element is going to be barred from constraint validation, we can
|
||||
// inform the form and fieldset that we are now valid. Otherwise, we are now
|
||||
// invalid.
|
||||
HTMLFormElement* form =
|
||||
static_cast<HTMLFormElement*>(formCtrl->GetFormElement());
|
||||
if (form) {
|
||||
// If the element is going to be barred from constraint validation,
|
||||
// we can inform the form that we are now valid.
|
||||
// Otherwise, we are now invalid.
|
||||
form->UpdateValidity(aBarred);
|
||||
}
|
||||
HTMLFieldSetElement* fieldSet = formCtrl->GetFieldSet();
|
||||
if (fieldSet) {
|
||||
fieldSet->UpdateValidity(aBarred);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -89,8 +89,8 @@ function checkConstraintValidationAPIDefaultValues(element)
|
||||
function checkDefaultPseudoClass()
|
||||
{
|
||||
is(window.getComputedStyle(document.getElementById('f'), null)
|
||||
.getPropertyValue('background-color'), "rgb(0, 0, 0)",
|
||||
"Nor :valid and :invalid should apply");
|
||||
.getPropertyValue('background-color'), "rgb(0, 255, 0)",
|
||||
":valid should apply");
|
||||
|
||||
is(window.getComputedStyle(document.getElementById('o'), null)
|
||||
.getPropertyValue('background-color'), "rgb(0, 255, 0)",
|
||||
@ -227,9 +227,16 @@ function checkCustomError(element, isBarred)
|
||||
ok(element.validity.customError, "The element should suffer from a custom error");
|
||||
ok(!element.validity.valid, "The element should not be valid with a custom error");
|
||||
|
||||
is(window.getComputedStyle(element, null).getPropertyValue('background-color'),
|
||||
isBarred ? "rgb(0, 0, 0)" : "rgb(255, 0, 0)",
|
||||
":invalid pseudo-classs should apply");
|
||||
if (element.tagName == "FIELDSET") {
|
||||
is(window.getComputedStyle(element, null).getPropertyValue('background-color'),
|
||||
isBarred ? "rgb(0, 255, 0)" : "rgb(255, 0, 0)",
|
||||
":invalid pseudo-classs should apply" + element.tagName);
|
||||
}
|
||||
else {
|
||||
is(window.getComputedStyle(element, null).getPropertyValue('background-color'),
|
||||
isBarred ? "rgb(0, 0, 0)" : "rgb(255, 0, 0)",
|
||||
":invalid pseudo-classs should apply" + element.tagName);
|
||||
}
|
||||
|
||||
element.setCustomValidity("");
|
||||
is(element.validationMessage, "", "The element should not have a validation message when reseted");
|
||||
@ -237,7 +244,7 @@ function checkCustomError(element, isBarred)
|
||||
ok(element.validity.valid, "The element should now be valid");
|
||||
|
||||
is(window.getComputedStyle(element, null).getPropertyValue('background-color'),
|
||||
isBarred ? "rgb(0, 0, 0)" : "rgb(0, 255, 0)",
|
||||
isBarred && element.tagName != "FIELDSET" ? "rgb(0, 0, 0)" : "rgb(0, 255, 0)",
|
||||
":valid pseudo-classs should apply");
|
||||
}
|
||||
|
||||
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with invalid barred for constraint validation element -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none ;}
|
||||
</style>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="onloadHandler();">
|
||||
<input required readonly id="i">
|
||||
<fieldset id="fieldset">
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with no elements and invalid element is added dynamically -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display:none }
|
||||
</style>
|
||||
<script>
|
||||
function onLoadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className='';
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload='onLoadHandler();'>
|
||||
<input id='i' required>
|
||||
<fieldset id="fieldset">
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with one invalid element and another invalid one is added dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<input id='i' type='email' value='foo'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='j' type='email' value='foo'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with one valid element and invalid one is added dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<input id='i' type='email' value='bar'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='j' type='text' value='foo'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with one valid element and another valid one is added dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<input id='i' type='text' value='bar'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='j' type='text' value='foo'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with one invalid element and another valid one is added dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<input id='i' type='text' value='foo'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='j' type='email' value='emailfoo'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with no valid element and another valid one is added dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<input id='i' type='text' value='foo'>
|
||||
<fieldset id="fieldset">
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with input in div should become invalid -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none ;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<div>
|
||||
<input required value="">
|
||||
</div>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and dynamically made it element with
|
||||
barred constraints -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById('i').readOnly = true;
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById('i').readOnly = false;
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' required readonly>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element which is made invalid dynamically -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById('i').value = '';
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' value='foo' required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one valid element which is made valid dynamically -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid {display: none;}
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById('i').value = 'foo';
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload="onloadHandler();">
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and a barred for constraint
|
||||
validation element then you remove the second element -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").removeChild(document.getElementById('j'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input required>
|
||||
<input id='j' value='foo' readonly>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and a barred for constraint
|
||||
validation element then you remove the second element -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").removeChild(document.getElementById('j'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='j' required>
|
||||
<input value='foo' readonly>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and a barred for constraint validation element -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset id="fieldset">
|
||||
<input required>
|
||||
<input id='i' value='foo' readonly required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -1,12 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: even if it has a custom error, a fieldset should not be affected by
|
||||
:invalid pseudo-class. -->
|
||||
<style>
|
||||
fieldset { background-color: green; }
|
||||
fieldset:invalid { background-color: red; }
|
||||
</style>
|
||||
<body onload="document.getElementById('f').setCustomValidity('foo'); document.documentElement.className='';">
|
||||
<fieldset id='f'></fieldset>
|
||||
</body>
|
||||
<!-- Invalid fieldset -->
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
<body onload="document.getElementById('input').setCustomValidity('foo'); document.documentElement.className='';">
|
||||
<fieldset>
|
||||
<input id="input">
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
11
layout/reftests/css-invalid/fieldset/fieldset-is-barred.html
Normal file
11
layout/reftests/css-invalid/fieldset/fieldset-is-barred.html
Normal file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Fieldset is barred -->
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
<body onload="document.getElementById('f').setCustomValidity('foo'); document.documentElement.className='';">
|
||||
<fieldset id="f">
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- Reference for input in nested fieldset becomes barred -->
|
||||
<html>
|
||||
<body>
|
||||
<fieldset style="background-color: green;">
|
||||
<fieldset style="background-color: green;">
|
||||
<input id='i' required readonly>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- input in nested fieldset becomes barred -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { background-color: green; }
|
||||
fieldset:invalid { background-color: red; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById('i').readOnly = true;
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset>
|
||||
<fieldset>
|
||||
<input id='i' required>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- Nested fieldsets should all become invalid -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none ;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<fieldset>
|
||||
<input required value="">
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -0,0 +1,22 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!-- Nested fieldsets should be assigned validation correctly -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { background-color: green; }
|
||||
fieldset:invalid { background-color: red; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset style="background-color:red;">
|
||||
<fieldset style="background-color: green;">
|
||||
<input>
|
||||
</fieldset>
|
||||
<fieldset style="background-color: red">
|
||||
<input required>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- Nested fieldsets should be assigned validation correctly -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { background-color: green; }
|
||||
fieldset:invalid { background-color: red; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<fieldset>
|
||||
<input>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<input required>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -1,6 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<fieldset style="background-color: green;"></fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and the element is dynamically removed -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").removeChild(document.getElementById('i'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' type='email' value='foo'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset id="fieldset">
|
||||
<input required readonly>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<!--fieldset with only invalid elements -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset id="fieldset">
|
||||
<input required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with only valid elements -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset id="fieldset">
|
||||
<input value='foo' required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one valid element and a barred for constraint
|
||||
validation element then you remove the second element -->
|
||||
<html class='reftest-wait'>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<script>
|
||||
function onloadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").removeChild(document.getElementById('j'));
|
||||
document.documentElement.className = '';
|
||||
}
|
||||
</script>
|
||||
<body onload='onloadHandler();'>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' value='foo' required>
|
||||
<input id='j' value='bar' readonly>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one invalid element and a barred for constraint validation element -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset id="fieldset">
|
||||
<input id='i' value='bar' required>
|
||||
<input id='i' value='foo' readonly required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -1,12 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- Valid fieldset. -->
|
||||
<html>
|
||||
<!-- Test: fieldset is always barred from constraint validation.
|
||||
It should not be affected by :invalid pseudo-class. -->
|
||||
<style>
|
||||
fieldset { background-color: green; }
|
||||
fieldset:invalid { background-color: red; }
|
||||
</style>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display: none ;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset></fieldset>
|
||||
<fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one valid element and you dynamically add a barred constraint
|
||||
validation element -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display:none }
|
||||
</style>
|
||||
<script>
|
||||
function onLoadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className='';
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload='onLoadHandler();'>
|
||||
<input id='i' value='foo' readonly>
|
||||
<fieldset id="fieldset">
|
||||
<input required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with invalid and valid elements -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<input id='i' value='foo'>
|
||||
<input required>
|
||||
<fieldset/>
|
||||
<body>
|
||||
<html>
|
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<!-- fieldset with one valid element and you dynamically add a barred constraint
|
||||
validation element -->
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
fieldset:valid { display:none }
|
||||
</style>
|
||||
<script>
|
||||
function onLoadHandler()
|
||||
{
|
||||
document.getElementById("fieldset").appendChild(document.getElementById('i'));
|
||||
document.documentElement.className='';
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload='onLoadHandler();'>
|
||||
<input id='i' value='foo' readonly>
|
||||
<fieldset id="fieldset" id="fieldset">
|
||||
<input id='j' value='bar' required>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
@ -1,2 +1,29 @@
|
||||
== fieldset-valid.html fieldset-ref.html
|
||||
== fieldset-invalid.html fieldset-ref.html
|
||||
== fieldset-valid.html about:blank
|
||||
== fieldset-invalid.html about:blank
|
||||
== fieldset-add-invalid-barred.html about:blank
|
||||
== fieldset-add-invalid-element-dynamic.html about:blank
|
||||
== fieldset-add-invalid-element.html about:blank
|
||||
== fieldset-add-invalid-with-valid-element.html about:blank
|
||||
== fieldset-add-valid-element.html about:blank
|
||||
== fieldset-add-valid-with-invalid-element.html about:blank
|
||||
== fieldset-add-valid-with-no-element.html about:blank
|
||||
== fieldset-dynamic-invalid-barred.html about:blank
|
||||
== fieldset-dynamic-invalid-not-barred.html about:blank
|
||||
== fieldset-dynamic-invalid.html about:blank
|
||||
== fieldset-dynamic-valid.html about:blank
|
||||
== fieldset-invalid-and-barred-remove-barred.html about:blank
|
||||
== fieldset-invalid-and-barred-remove-invalid.html about:blank
|
||||
== fieldset-invalid-and-barred.html about:blank
|
||||
== fieldset-remove-invalid-element.html about:blank
|
||||
== fieldset-static-invalid-barred.html about:blank
|
||||
== fieldset-static-invalid.html about:blank
|
||||
== fieldset-static-valid.html about:blank
|
||||
== fieldset-valid-and-barred-remove-barred.html about:blank
|
||||
== fieldset-valid-and-barred.html about:blank
|
||||
== fieldset-with-invalid-element-add-barred-dynamic.html about:blank
|
||||
== fieldset-with-valid-and-invalid.html about:blank
|
||||
== fieldset-with-valid-element-add-barred-dynamic.html about:blank
|
||||
== fieldset-nested-invalid.html about:blank
|
||||
== fieldset-div-invalid.html about:blank
|
||||
== fieldset-nested-valid-invalid.html fieldset-nested-valid-invalid-ref.html
|
||||
== fieldset-nested-barred.html fieldset-nested-barred-ref.html
|
||||
|
@ -1,12 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: fieldset is always barred from constraint validation.
|
||||
It should not be affected by :valid pseudo-class. -->
|
||||
<!-- Test: fieldset undergoes constraint validation.
|
||||
It should be affected by :invalid pseudo-class. -->
|
||||
<style>
|
||||
fieldset { background-color: green; }
|
||||
fieldset:valid { background-color: red; }
|
||||
fieldset:invalid { display: none; }
|
||||
</style>
|
||||
<body onload="document.getElementById('f').setCustomValidity('foo'); document.documentElement.className='';">
|
||||
<fieldset id='f'></fieldset>
|
||||
<fieldset>
|
||||
<input id='f'>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -1,6 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<fieldset style="background-color: green;"></fieldset>
|
||||
</body>
|
||||
</html>
|
@ -1,12 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: fieldset is always barred from constraint validation.
|
||||
It should not be affected by :valid pseudo-class. -->
|
||||
<!-- Test: fieldset undergoes constraint validation.
|
||||
It should be affected by :valid pseudo-class. -->
|
||||
<style>
|
||||
fieldset { background-color: green; }
|
||||
fieldset:valid { background-color: red; }
|
||||
fieldset:valid { display: none; }
|
||||
</style>
|
||||
<body>
|
||||
<fieldset></fieldset>
|
||||
<fieldset>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -1,2 +1,2 @@
|
||||
== fieldset-valid.html fieldset-ref.html
|
||||
== fieldset-invalid.html fieldset-ref.html
|
||||
== fieldset-valid.html about:blank
|
||||
== fieldset-invalid.html about:blank
|
||||
|
Loading…
Reference in New Issue
Block a user