<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[176174] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/176174">176174</a></dd>
<dt>Author</dt> <dd>benjamin@webkit.org</dd>
<dt>Date</dt> <dd>2014-11-16 23:01:21 -0800 (Sun, 16 Nov 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>Implement :valid and :invalid matching for the fieldset element
https://bugs.webkit.org/show_bug.cgi?id=138769
Reviewed by Darin Adler.
Source/WebCore:
In the latest HTML spec, the pseudo classes :valid and :invalid match
a fieldset element based on its descendants:
https://html.spec.whatwg.org/#selector-valid
https://html.spec.whatwg.org/#selector-invalid
This patch adds that behavior.
There are two key problems to solve with these pseudo classes on fieldset:
-Efficient matching.
-Style invalidation when any of the descendant changes.
To implement the style invalidation, I have modified HTMLFormControlElement
to notify its ancestor when its state changes.
The first change is making the state fully internal to HTMLFormControlElement,
we do not want subclass to be able to change the behavior and forget to update
the ancestors.
To achieve that encapsulation, the interface was changed a bit:
-Neither willValidate() nor isValidFormControlElement() inherit from Element.
Instead, willValidate() is the implementation of FormAssociatedElement's interface
and it is final. The method isValidFormControlElement() becomes completely internal
to HTMLFormControlElement.
-Since willValidate() should no longer be re-implemented by subclass, the elements
that were depending on it have been migrated to recalcWillValidate() to set
the initial state as needed.
With the validity state fully encapsulated in HTMLFormControlElement, all I need
is a way to communicate that information to HTMLFieldSetElement ancestors.
This is done in two cases:
-The validity state changes.
-The tree changes in a way that would make the input element not a descendant
of a HTMLFieldSetElement.
The invalidation is simply done by walking up the ancestors and adding the current
element to a "validity dependency list" on each HTMLFieldSetElement.
Tests: fast/css/pseudo-invalid-fieldset-invalidation-optimization.html
fast/css/pseudo-invalid-fieldset-style-sharing.html
fast/css/pseudo-invalid-fieldset.html
fast/css/pseudo-valid-fieldset-invalidation-optimization.html
fast/css/pseudo-valid-fieldset-style-sharing.html
fast/css/pseudo-valid-fieldset.html
fast/selectors/invalid-fieldset-style-update-1.html
fast/selectors/invalid-fieldset-style-update-2.html
fast/selectors/invalid-fieldset-style-update-3.html
fast/selectors/invalid-fieldset-style-update-4.html
fast/selectors/invalid-fieldset-style-update-5.html
fast/selectors/valid-fieldset-style-update-1.html
fast/selectors/valid-fieldset-style-update-2.html
fast/selectors/valid-fieldset-style-update-3.html
fast/selectors/valid-fieldset-style-update-4.html
fast/selectors/valid-fieldset-style-update-5.html
* css/SelectorCheckerTestFunctions.h:
(WebCore::isInRange):
(WebCore::isOutOfRange):
(WebCore::isInvalid):
(WebCore::isValid):
The hack "ContainsValidityStyleRules" is in the way of correct styling
of FieldSet and Form.
It is not the right way to get stylesheet properties anyway.
* css/StyleResolver.cpp:
(WebCore::StyleResolver::canShareStyleWithControl):
Make sure style sharing does not incorrectly share style for fieldset elements.
* dom/Document.cpp:
(WebCore::Document::Document):
* dom/Document.h:
(WebCore::Document::containsValidityStyleRules): Deleted.
(WebCore::Document::setContainsValidityStyleRules): Deleted.
* dom/Element.h:
(WebCore::Element::matchesValidPseudoClass):
(WebCore::Element::matchesInvalidPseudoClass):
(WebCore::Element::willValidate): Deleted.
(WebCore::Element::isValidFormControlElement): Deleted.
* html/FormAssociatedElement.cpp:
(WebCore::FormAssociatedElement::customError):
* html/FormAssociatedElement.h:
* html/HTMLFieldSetElement.cpp:
(WebCore::HTMLFieldSetElement::matchesValidPseudoClass):
(WebCore::HTMLFieldSetElement::matchesInvalidPseudoClass):
(WebCore::HTMLFieldSetElement::addInvalidDescendant):
(WebCore::HTMLFieldSetElement::removeInvalidDescendant):
Each HTMLFormControlElement that has constraint validation adds or removes
itself from its HTMLFieldSetElement ancestors.
It should be possible to just keep track of a count instead of a HashSet.
I decided to got with the HashSet to make the code more robust and easier
to debug. A few assertions ensure that the HashSet is actually used as a counter.
* html/HTMLFieldSetElement.h:
* html/HTMLFormControlElement.cpp:
(WebCore::addInvalidElementToAncestorFromInsertionPoint):
(WebCore::removeInvalidElementToAncestorFromInsertionPoint):
(WebCore::HTMLFormControlElement::insertedInto):
(WebCore::HTMLFormControlElement::removedFrom):
One tricky part of those two functions is that we cannot use
matchesValidPseudoClass() or matchesInvalidPseudoClass().
The reason is that HTMLFieldSetElement is a subclass of HTMLFormControlElement
and it has its own definition of what Valid and Invalid mean when matching selectors.
In HTMLFormControlElement, we must use the internal state,
willValidate() and isValidFormControlElement() must be used directly.
(WebCore::HTMLFormControlElement::matchesValidPseudoClass):
(WebCore::HTMLFormControlElement::matchesInvalidPseudoClass):
(WebCore::HTMLFormControlElement::willValidate):
(WebCore::addInvalidElementToAncestors):
(WebCore::removeInvalidElementFromAncestors):
(WebCore::HTMLFormControlElement::setNeedsWillValidateCheck):
(WebCore::HTMLFormControlElement::setNeedsValidityCheck):
(WebCore::HTMLFormControlElement::isValidFormControlElement): Deleted.
* html/HTMLFormControlElement.h:
(WebCore::HTMLFormControlElement::isValidFormControlElement):
* html/HTMLKeygenElement.h:
* html/HTMLObjectElement.h:
* html/HTMLOutputElement.h:
LayoutTests:
There are many ways to change the validation state of a submittable element.
I included a series of test trying to exercises as many combination
as possible.
* fast/css/pseudo-valid-unapplied-expected.txt:
* fast/css/pseudo-valid-unapplied.html:
This test was checking that :valid and :invalid are not applied
to fieldset. Such results are incorrect with the latest specification.
* fast/css/pseudo-invalid-fieldset-expected.html: Added.
* fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt: Added.
* fast/css/pseudo-invalid-fieldset-invalidation-optimization.html: Added.
* fast/css/pseudo-invalid-fieldset-style-sharing-expected.html: Added.
* fast/css/pseudo-invalid-fieldset-style-sharing.html: Added.
* fast/css/pseudo-invalid-fieldset.html: Added.
* fast/css/pseudo-valid-fieldset-expected.html: Added.
* fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt: Added.
* fast/css/pseudo-valid-fieldset-invalidation-optimization.html: Added.
* fast/css/pseudo-valid-fieldset-style-sharing-expected.html: Added.
* fast/css/pseudo-valid-fieldset-style-sharing.html: Added.
* fast/css/pseudo-valid-fieldset.html: Added.
* fast/selectors/invalid-fieldset-style-update-1-expected.txt: Added.
* fast/selectors/invalid-fieldset-style-update-1.html: Added.
* fast/selectors/invalid-fieldset-style-update-2-expected.txt: Added.
* fast/selectors/invalid-fieldset-style-update-2.html: Added.
* fast/selectors/invalid-fieldset-style-update-3-expected.txt: Added.
* fast/selectors/invalid-fieldset-style-update-3.html: Added.
* fast/selectors/invalid-fieldset-style-update-4-expected.txt: Added.
* fast/selectors/invalid-fieldset-style-update-4.html: Added.
* fast/selectors/invalid-fieldset-style-update-5-expected.txt: Added.
* fast/selectors/invalid-fieldset-style-update-5.html: Added.
* fast/selectors/valid-fieldset-style-update-1-expected.txt: Added.
* fast/selectors/valid-fieldset-style-update-1.html: Added.
* fast/selectors/valid-fieldset-style-update-2-expected.txt: Added.
* fast/selectors/valid-fieldset-style-update-2.html: Added.
* fast/selectors/valid-fieldset-style-update-3-expected.txt: Added.
* fast/selectors/valid-fieldset-style-update-3.html: Added.
* fast/selectors/valid-fieldset-style-update-4-expected.txt: Added.
* fast/selectors/valid-fieldset-style-update-4.html: Added.
* fast/selectors/valid-fieldset-style-update-5-expected.txt: Added.
* fast/selectors/valid-fieldset-style-update-5.html: Added.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidunappliedexpectedtxt">trunk/LayoutTests/fast/css/pseudo-valid-unapplied-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidunappliedhtml">trunk/LayoutTests/fast/css/pseudo-valid-unapplied.html</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorecssSelectorCheckerTestFunctionsh">trunk/Source/WebCore/css/SelectorCheckerTestFunctions.h</a></li>
<li><a href="#trunkSourceWebCorecssStyleResolvercpp">trunk/Source/WebCore/css/StyleResolver.cpp</a></li>
<li><a href="#trunkSourceWebCoredomDocumentcpp">trunk/Source/WebCore/dom/Document.cpp</a></li>
<li><a href="#trunkSourceWebCoredomDocumenth">trunk/Source/WebCore/dom/Document.h</a></li>
<li><a href="#trunkSourceWebCoredomElementh">trunk/Source/WebCore/dom/Element.h</a></li>
<li><a href="#trunkSourceWebCorehtmlFormAssociatedElementcpp">trunk/Source/WebCore/html/FormAssociatedElement.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlFormAssociatedElementh">trunk/Source/WebCore/html/FormAssociatedElement.h</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLFieldSetElementcpp">trunk/Source/WebCore/html/HTMLFieldSetElement.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLFieldSetElementh">trunk/Source/WebCore/html/HTMLFieldSetElement.h</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLFormControlElementcpp">trunk/Source/WebCore/html/HTMLFormControlElement.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLFormControlElementh">trunk/Source/WebCore/html/HTMLFormControlElement.h</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLKeygenElementh">trunk/Source/WebCore/html/HTMLKeygenElement.h</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLObjectElementh">trunk/Source/WebCore/html/HTMLObjectElement.h</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLOutputElementh">trunk/Source/WebCore/html/HTMLOutputElement.h</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsetexpectedhtml">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsetinvalidationoptimizationexpectedtxt">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsetinvalidationoptimizationhtml">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsetstylesharingexpectedhtml">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsetstylesharinghtml">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudoinvalidfieldsethtml">trunk/LayoutTests/fast/css/pseudo-invalid-fieldset.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsetexpectedhtml">trunk/LayoutTests/fast/css/pseudo-valid-fieldset-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsetinvalidationoptimizationexpectedtxt">trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsetinvalidationoptimizationhtml">trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsetstylesharingexpectedhtml">trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsetstylesharinghtml">trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing.html</a></li>
<li><a href="#trunkLayoutTestsfastcsspseudovalidfieldsethtml">trunk/LayoutTests/fast/css/pseudo-valid-fieldset.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate1expectedtxt">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate1html">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate2expectedtxt">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate2html">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate3expectedtxt">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate3html">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate4expectedtxt">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate4html">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate5expectedtxt">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate5html">trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate1expectedtxt">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate1html">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate2expectedtxt">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate2html">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate3expectedtxt">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate3html">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate4expectedtxt">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate4html">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4.html</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate5expectedtxt">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate5html">trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/LayoutTests/ChangeLog 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -1,3 +1,52 @@
</span><ins>+2014-11-16 Benjamin Poulain <benjamin@webkit.org>
+
+ Implement :valid and :invalid matching for the fieldset element
+ https://bugs.webkit.org/show_bug.cgi?id=138769
+
+ Reviewed by Darin Adler.
+
+ There are many ways to change the validation state of a submittable element.
+ I included a series of test trying to exercises as many combination
+ as possible.
+
+ * fast/css/pseudo-valid-unapplied-expected.txt:
+ * fast/css/pseudo-valid-unapplied.html:
+ This test was checking that :valid and :invalid are not applied
+ to fieldset. Such results are incorrect with the latest specification.
+
+ * fast/css/pseudo-invalid-fieldset-expected.html: Added.
+ * fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt: Added.
+ * fast/css/pseudo-invalid-fieldset-invalidation-optimization.html: Added.
+ * fast/css/pseudo-invalid-fieldset-style-sharing-expected.html: Added.
+ * fast/css/pseudo-invalid-fieldset-style-sharing.html: Added.
+ * fast/css/pseudo-invalid-fieldset.html: Added.
+ * fast/css/pseudo-valid-fieldset-expected.html: Added.
+ * fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt: Added.
+ * fast/css/pseudo-valid-fieldset-invalidation-optimization.html: Added.
+ * fast/css/pseudo-valid-fieldset-style-sharing-expected.html: Added.
+ * fast/css/pseudo-valid-fieldset-style-sharing.html: Added.
+ * fast/css/pseudo-valid-fieldset.html: Added.
+ * fast/selectors/invalid-fieldset-style-update-1-expected.txt: Added.
+ * fast/selectors/invalid-fieldset-style-update-1.html: Added.
+ * fast/selectors/invalid-fieldset-style-update-2-expected.txt: Added.
+ * fast/selectors/invalid-fieldset-style-update-2.html: Added.
+ * fast/selectors/invalid-fieldset-style-update-3-expected.txt: Added.
+ * fast/selectors/invalid-fieldset-style-update-3.html: Added.
+ * fast/selectors/invalid-fieldset-style-update-4-expected.txt: Added.
+ * fast/selectors/invalid-fieldset-style-update-4.html: Added.
+ * fast/selectors/invalid-fieldset-style-update-5-expected.txt: Added.
+ * fast/selectors/invalid-fieldset-style-update-5.html: Added.
+ * fast/selectors/valid-fieldset-style-update-1-expected.txt: Added.
+ * fast/selectors/valid-fieldset-style-update-1.html: Added.
+ * fast/selectors/valid-fieldset-style-update-2-expected.txt: Added.
+ * fast/selectors/valid-fieldset-style-update-2.html: Added.
+ * fast/selectors/valid-fieldset-style-update-3-expected.txt: Added.
+ * fast/selectors/valid-fieldset-style-update-3.html: Added.
+ * fast/selectors/valid-fieldset-style-update-4-expected.txt: Added.
+ * fast/selectors/valid-fieldset-style-update-4.html: Added.
+ * fast/selectors/valid-fieldset-style-update-5-expected.txt: Added.
+ * fast/selectors/valid-fieldset-style-update-5.html: Added.
+
</ins><span class="cx"> 2014-11-16 Chris Dumez <cdumez@apple.com>
</span><span class="cx">
</span><span class="cx"> Crash when setting 'order' CSS property to a calculated value
</span></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsetexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-expected.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-expected.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-expected.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,175 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ </style>
+</head>
+<body style="color: green;">
+ <p style="color: green;">Test the styling with the pseudo class :valid with the &lt;fieldset&gt; element.</p>
+
+ <!-- Fieldset by itself. -->
+ <fieldset style="color: green;">Text</fieldset>
+
+ <!-- Fieldset with a direct child inputs without any requirements. -->
+ <fieldset style="color: green;">
+ Text
+ <input style="color: green;">
+ <input style="color: green;" value>
+ <input style="color: green;" value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs without any requirements. -->
+ <fieldset style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="color: green;">
+ <input style="color: green;" value>
+ <input style="color: green;" value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with unsatisfied requirements. -->
+ <fieldset style="background-color: red;">
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with unsatisfied requirements. -->
+ <fieldset style="background-color: red;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with satisfied requirements. -->
+ <fieldset style="color: green;">
+ <input style="color: green;" required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied requirements. -->
+ <fieldset style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with a mix of satisfied and unsatisfied requirements. -->
+ <fieldset style="background-color: red;">
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ <input style="color: green;" required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied and unsatisfied requirements. -->
+ <fieldset style="background-color: red;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ <input style="color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- The cases above repeated with multiple nested fieldset -->
+ <fieldset style="color: green;">
+ <div style="color: green;">
+ <fieldset style="color: green;">
+ <fieldset style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="color: green;">
+ <input style="color: green;" value>
+ <input style="color: green;" value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="background-color: red;">
+ <div style="color: green;">
+ <fieldset style="background-color: red;">
+ <fieldset style="background-color: red;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="color: green;">
+ <div style="color: green;">
+ <fieldset style="color: green;">
+ <fieldset style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="background-color: red;">
+ <div style="color: green;">
+ <fieldset style="background-color: red;">
+ <fieldset style="background-color: red;">
+ Text
+ <div style="color: green;">
+ Text
+ <div style="color: green;">
+ Text
+ <input style="background-color: red;" required>
+ <input style="background-color: red;" required value>
+ <input style="background-color: red;" required value="">
+ <input style="color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsetinvalidationoptimizationexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,29 @@
</span><ins>+Test that we do not invalidate the style of <fieldset> excessively when matching :invalid based on the descendants.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 0, 0)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 0, 0)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is true
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is true
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 1, 2)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 1, 2)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 1, 2)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 1, 2)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 1, 2)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 1, 2)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is true
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is true
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 0, 0)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 0, 0)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsetinvalidationoptimizationhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-invalidation-optimization.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,96 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+fieldset {
+ color: black;
+}
+fieldset:invalid {
+ color: rgb(0, 1, 2);
+}
+</style>
+</head>
+<body>
+ <div>
+ <!-- With renderer -->
+ <fieldset id="with-renderer">
+ <input class="input1" required value="Valid">
+ <input class="input2" required value="Valid">
+ <input class="input3" required value="Valid">
+ <input class="input4" required value="Valid">
+ </fieldset>
+ </div>
+ <div style="display:none;">
+ <!-- Without renderer -->
+ <fieldset id="without-renderer">
+ <input class="input1" required value="Valid">
+ <input class="input2" required value="Valid">
+ <input class="input3" required value="Valid">
+ <input class="input4" required value="Valid">
+ </fieldset>
+ </div>
+</body>
+<script>
+
+description('Test that we do not invalidate the style of &lt;fieldset&gt; excessively when matching :invalid based on the descendants.');
+
+function shouldNeedStyleRecalc(expected) {
+ var testFunction = expected ? shouldBeTrue : shouldBeFalse;
+ testFunction('window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer"))');
+ testFunction('window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer"))');
+}
+
+function checkStyle(expectedColor) {
+ shouldBeEqualToString('getComputedStyle(document.getElementById("with-renderer")).color', expectedColor);
+ shouldBeEqualToString('getComputedStyle(document.getElementById("without-renderer")).color', expectedColor);
+}
+
+// Force a layout to ensure we don't have dirty styles.
+var offsetTop = document.documentElement.offsetTop;
+
+// Initial state.
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 0, 0)');
+
+// Make input3 invalid, the fieldset should also become invalid.
+var inputs3 = document.querySelectorAll('.input3');
+inputs3[0].value = '';
+inputs3[1].value = '';
+
+shouldNeedStyleRecalc(true);
+checkStyle('rgb(0, 1, 2)');
+
+// Making more fields invalid should not invalidate the fieldset's style.
+var inputs = document.querySelectorAll(':matches(.input2, .input4)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].value = '';
+
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 1, 2)');
+
+// Removing valid fields should not invalidate the style.
+var inputs1 = document.querySelectorAll(':matches(.input1)');
+for (var i = 0; i < inputs1.length; ++i)
+ inputs1[i].parentNode.removeChild(inputs1[i]);
+
+// Making all fields valid but one, fieldset still does not need to be invalidated.
+var inputs = document.querySelectorAll(':matches(.input2, .input3)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].removeAttribute('required');
+
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 1, 2)');
+
+// Making the last input valid. The style must update, fieldset must be invalidated.
+var inputs = document.querySelectorAll(':matches(.input4)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].removeAttribute('required');
+
+shouldNeedStyleRecalc(true);
+checkStyle('rgb(0, 0, 0)');
+
+document.getElementById("with-renderer").style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsetstylesharingexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing-expected.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing-expected.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing-expected.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,66 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ fieldset:invalid {
+ style="background-color: blue;"
+ }
+ </style>
+</head>
+<body>
+ <p>Verify style sharing does not ignore :invalid affecting a &lt;fieldset&gt;.</p>
+
+ <!-- Empty fieldset are :valid, non-empty's :valid depend on the children. -->
+ <div>
+ <fieldset></fieldset>
+ <fieldset></fieldset>
+ <fieldset>
+ <textarea></textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+
+ <fieldset></fieldset>
+ </div>
+
+ <!-- The style of field set varies with its required children. -->
+ <div>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ </div>
+ <div>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ <fieldset style="background-color: blue;">
+ <textarea style="background-color: red;" required></textarea>
+ </fieldset>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsetstylesharinghtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset-style-sharing.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,69 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ textarea:invalid {
+ background-color: red;
+ }
+ fieldset:invalid {
+ background-color: blue;
+ }
+ </style>
+</head>
+<body>
+ <p>Verify style sharing does not ignore :invalid affecting a &lt;fieldset&gt;.</p>
+
+ <!-- Empty fieldset are :valid, non-empty's :valid depend on the children. -->
+ <div>
+ <fieldset></fieldset>
+ <fieldset></fieldset>
+ <fieldset>
+ <textarea></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+
+ <fieldset></fieldset>
+ </div>
+
+ <!-- The style of field set varies with its required children. -->
+ <div>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+ <div>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudoinvalidfieldsethtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-invalid-fieldset.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-invalid-fieldset.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-invalid-fieldset.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,181 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ :invalid {
+ background-color: red;
+ }
+ :not(:invalid) {
+ color: green;
+ }
+ </style>
+</head>
+<body>
+ <p>Test the styling with the pseudo class :valid with the &lt;fieldset&gt; element.</p>
+
+ <!-- Fieldset by itself. -->
+ <fieldset>Text</fieldset>
+
+ <!-- Fieldset with a direct child inputs without any requirements. -->
+ <fieldset>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs without any requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with unsatisfied requirements. -->
+ <fieldset>
+ <input required>
+ <input required value>
+ <input required value="">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with unsatisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with satisfied requirements. -->
+ <fieldset>
+ <input required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with a mix of satisfied and unsatisfied requirements. -->
+ <fieldset>
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied and unsatisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- The cases above repeated with multiple nested fieldset -->
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsetexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset-expected.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset-expected.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset-expected.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,174 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ </style>
+</head>
+<body style="color: red;">
+ <p style="color: red;">Test the styling with the pseudo class :valid with the &lt;fieldset&gt; element.</p>
+
+ <!-- Fieldset by itself. -->
+ <fieldset style="background-color: green;">Text</fieldset>
+
+ <!-- Fieldset with a direct child inputs without any requirements. -->
+ <fieldset style="background-color: green;">
+ Text
+ <input style="background-color: green;">
+ <input style="background-color: green;" value>
+ <input style="background-color: green;" value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs without any requirements. -->
+ <fieldset style="background-color: green;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="background-color: green;">
+ <input style="background-color: green;" value>
+ <input style="background-color: green;" value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with unsatisfied requirements. -->
+ <fieldset style="color: red;">
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with unsatisfied requirements. -->
+ <fieldset style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with satisfied requirements. -->
+ <fieldset style="background-color: green;">
+ <input style="background-color: green;" required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied requirements. -->
+ <fieldset style="background-color: green;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="background-color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with a mix of satisfied and unsatisfied requirements. -->
+ <fieldset style="color: red;">
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ <input style="background-color: green;" required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied and unsatisfied requirements. -->
+ <fieldset style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ <input style="background-color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- The cases above repeated with multiple nested fieldset -->
+ <fieldset style="background-color: green;">
+ <div style="color: red;">
+ <fieldset style="background-color: green;">
+ <fieldset style="background-color: green;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="background-color: green;">
+ <input style="background-color: green;" value>
+ <input style="background-color: green;" value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="color: red;">
+ <div style="color: red;">
+ <fieldset style="color: red;">
+ <fieldset style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="background-color: green;">
+ <div style="color: red;">
+ <fieldset style="background-color: green;">
+ <fieldset style="background-color: green;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="background-color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset style="color: red;">
+ <div style="color: red;">
+ <fieldset style="color: red;">
+ <fieldset style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <div style="color: red;">
+ Text
+ <input style="color: red;" required>
+ <input style="color: red;" required value>
+ <input style="color: red;" required value="">
+ <input style="background-color: green;" required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsetinvalidationoptimizationexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,29 @@
</span><ins>+Test that we do not invalidate the style of <fieldset> excessively when matching :valid based on the descendants.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 1, 2)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 1, 2)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is true
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is true
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 0, 0)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 0, 0)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 0, 0)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 0, 0)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is false
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is false
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 0, 0)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 0, 0)"
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer")) is true
+PASS window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer")) is true
+PASS getComputedStyle(document.getElementById("with-renderer")).color is "rgb(0, 1, 2)"
+PASS getComputedStyle(document.getElementById("without-renderer")).color is "rgb(0, 1, 2)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsetinvalidationoptimizationhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset-invalidation-optimization.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,96 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+fieldset {
+ color: black;
+}
+fieldset:valid {
+ color: rgb(0, 1, 2);
+}
+</style>
+</head>
+<body>
+ <div>
+ <!-- With renderer -->
+ <fieldset id="with-renderer">
+ <input class="input1" required value="Valid">
+ <input class="input2" required value="Valid">
+ <input class="input3" required value="Valid">
+ <input class="input4" required value="Valid">
+ </fieldset>
+ </div>
+ <div style="display:none;">
+ <!-- Without renderer -->
+ <fieldset id="without-renderer">
+ <input class="input1" required value="Valid">
+ <input class="input2" required value="Valid">
+ <input class="input3" required value="Valid">
+ <input class="input4" required value="Valid">
+ </fieldset>
+ </div>
+</body>
+<script>
+
+description('Test that we do not invalidate the style of &lt;fieldset&gt; excessively when matching :valid based on the descendants.');
+
+function shouldNeedStyleRecalc(expected) {
+ var testFunction = expected ? shouldBeTrue : shouldBeFalse;
+ testFunction('window.internals.nodeNeedsStyleRecalc(document.getElementById("with-renderer"))');
+ testFunction('window.internals.nodeNeedsStyleRecalc(document.getElementById("without-renderer"))');
+}
+
+function checkStyle(expectedColor) {
+ shouldBeEqualToString('getComputedStyle(document.getElementById("with-renderer")).color', expectedColor);
+ shouldBeEqualToString('getComputedStyle(document.getElementById("without-renderer")).color', expectedColor);
+}
+
+// Force a layout to ensure we don't have dirty styles.
+var offsetTop = document.documentElement.offsetTop;
+
+// Initial state.
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 1, 2)');
+
+// Make input3 invalid, the fieldset should also become invalid.
+var inputs3 = document.querySelectorAll('.input3');
+inputs3[0].value = '';
+inputs3[1].value = '';
+
+shouldNeedStyleRecalc(true);
+checkStyle('rgb(0, 0, 0)');
+
+// Making more fields invalid should not invalidate the fieldset's style.
+var inputs = document.querySelectorAll(':matches(.input2, .input4)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].value = '';
+
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 0, 0)');
+
+// Removing valid fields should not invalidate the style.
+var inputs1 = document.querySelectorAll(':matches(.input1)');
+for (var i = 0; i < inputs1.length; ++i)
+ inputs1[i].parentNode.removeChild(inputs1[i]);
+
+// Making all fields valid but one, fieldset still does not need to be invalidated.
+var inputs = document.querySelectorAll(':matches(.input2, .input3)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].removeAttribute('required');
+
+shouldNeedStyleRecalc(false);
+checkStyle('rgb(0, 0, 0)');
+
+// Making the last input valid. The style must update, fieldset must be invalidated.
+var inputs = document.querySelectorAll(':matches(.input4)');
+for (var i = 0; i < inputs.length; ++i)
+ inputs[i].removeAttribute('required');
+
+shouldNeedStyleRecalc(true);
+checkStyle('rgb(0, 1, 2)');
+
+document.getElementById("with-renderer").style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsetstylesharingexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing-expected.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing-expected.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing-expected.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,61 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>Verify style sharing does not ignore :valid affecting a &lt;fieldset&gt;.</p>
+
+ <div>
+ <fieldset style="background-color: lime;"></fieldset>
+ <fieldset style="background-color: lime;"></fieldset>
+ <fieldset style="background-color: lime;">
+ <textarea style="background-color: green;"></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset style="background-color: lime;">
+ <textarea style="background-color: green;" required>Foobar</textarea>
+ </fieldset>
+
+ <fieldset style="background-color: lime;"></fieldset>
+ </div>
+
+ <div>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset style="background-color: lime;">
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset style="background-color: lime;">
+ <textarea style="background-color: green;" required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+ <div>
+ <fieldset style="background-color: lime;">
+ <textarea style="background-color: green;" required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsetstylesharinghtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset-style-sharing.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,69 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ textarea:valid {
+ background-color: green;
+ }
+ fieldset:valid {
+ background-color: lime;
+ }
+ </style>
+</head>
+<body>
+ <p>Verify style sharing does not ignore :valid affecting a &lt;fieldset&gt;.</p>
+
+ <!-- Empty fieldset are :valid, non-empty's :valid depend on the children. -->
+ <div>
+ <fieldset></fieldset>
+ <fieldset></fieldset>
+ <fieldset>
+ <textarea></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+
+ <fieldset></fieldset>
+ </div>
+
+ <!-- The style of field set varies with its required children. -->
+ <div>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+ <div>
+ <fieldset>
+ <textarea required>Foobar</textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ <fieldset>
+ <textarea required></textarea>
+ </fieldset>
+ </div>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidfieldsethtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css/pseudo-valid-fieldset.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-fieldset.html (rev 0)
+++ trunk/LayoutTests/fast/css/pseudo-valid-fieldset.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,181 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+ <style>
+ /* Pack them to fit everything in 800*600 */
+ fieldset {
+ padding: 5px;
+ width: 100px;
+ float: left;
+ }
+ :valid {
+ background-color: green;
+ }
+ :not(:valid) {
+ color: red;
+ }
+ </style>
+</head>
+<body>
+ <p>Test the styling with the pseudo class :valid with the &lt;fieldset&gt; element.</p>
+
+ <!-- Fieldset by itself. -->
+ <fieldset>Text</fieldset>
+
+ <!-- Fieldset with a direct child inputs without any requirements. -->
+ <fieldset>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs without any requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with unsatisfied requirements. -->
+ <fieldset>
+ <input required>
+ <input required value>
+ <input required value="">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with unsatisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with satisfied requirements. -->
+ <fieldset>
+ <input required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- Fieldset with a direct child inputs with a mix of satisfied and unsatisfied requirements. -->
+ <fieldset>
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </fieldset>
+
+ <!-- Fieldset with an indirect direct child inputs with satisfied and unsatisfied requirements. -->
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+
+ <!-- The cases above repeated with multiple nested fieldset -->
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input>
+ <input value>
+ <input value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <fieldset>
+ <fieldset>
+ Text
+ <div>
+ Text
+ <div>
+ Text
+ <input required>
+ <input required value>
+ <input required value="">
+ <input required value="text">
+ </div>
+ </div>
+ </fieldset>
+ </fieldset>
+ </div>
+ </fieldset>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidunappliedexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css/pseudo-valid-unapplied-expected.txt (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-unapplied-expected.txt 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/LayoutTests/fast/css/pseudo-valid-unapplied-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -9,7 +9,6 @@
</span><span class="cx"> PASS getBackgroundColor('input-reset') is normalColor
</span><span class="cx"> PASS getBackgroundColor('input-hidden') is normalColor
</span><span class="cx"> PASS getBackgroundColor('input-image') is normalColor
</span><del>-PASS getBackgroundColor('fieldset') is normalColor
</del><span class="cx"> PASS getBackgroundColor('object') is normalColor
</span><span class="cx"> PASS getBackgroundColor('button-button') is normalColor
</span><span class="cx"> PASS getBackgroundColor('button-reset') is normalColor
</span></span></pre></div>
<a id="trunkLayoutTestsfastcsspseudovalidunappliedhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css/pseudo-valid-unapplied.html (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css/pseudo-valid-unapplied.html 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/LayoutTests/fast/css/pseudo-valid-unapplied.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -49,7 +49,6 @@
</span><span class="cx"> "input-reset",
</span><span class="cx"> "input-hidden",
</span><span class="cx"> "input-image",
</span><del>- "fieldset",
</del><span class="cx"> "object",
</span><span class="cx"> "button-button",
</span><span class="cx"> "button-reset",
</span></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate1expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,259 @@
</span><ins>+Test style update for :invalid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Back to invalid. We should be in the initial state.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move the invalid text area into fieldset3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+
+Make the text area valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the input invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+
+Move text area as a child of fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move text area as a child of div1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the input valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area valid, everything should be valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the input invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move fieldset2 inside div3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+
+Destroy the content of div2
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate1html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-1.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,171 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :invalid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="valid">
+ </div>
+ </fieldset>
+ <textarea class="textarea1" required></textarea>
+ </div>
+ </fieldset>
+ <fieldset class="fieldset3">
+ <div class="div3">
+ </div>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :invalid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset1', 'textarea1']);
+
+debug('');
+debug("Make the text area valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle([]);
+
+debug('');
+debug("Back to invalid. We should be in the initial state.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "";
+});
+testStyle(['fieldset1', 'textarea1']);
+
+
+debug('');
+debug("Move the invalid text area into fieldset3.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var fieldset3 = root.querySelector('.fieldset3');
+ fieldset3.appendChild(textArea);
+});
+testStyle(['fieldset3', 'textarea1']);
+
+debug('');
+debug("Make the text area valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle([]);
+
+debug('');
+debug("Make the input invalid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1']);
+
+debug('');
+debug("Move text area as a child of fieldset1.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var fieldset1 = root.querySelector('.fieldset1');
+ fieldset1.appendChild(textArea);
+});
+testStyle(['fieldset1', 'fieldset2', 'input1']);
+
+debug('');
+debug("Move text area as a child of div1.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var div1 = root.querySelector('.div1');
+ div1.appendChild(textArea);
+});
+testStyle(['fieldset1', 'fieldset2', 'input1']);
+
+debug('');
+debug("Make the text area invalid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1', 'textarea1']);
+
+debug('');
+debug("Make the input valid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "Valid";
+});
+testStyle(['fieldset1', 'textarea1']);
+
+debug('');
+debug("Make the text area valid, everything should be valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle([]);
+
+debug('');
+debug("Make the input invalid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1']);
+
+
+debug('');
+debug("Move fieldset2 inside div3");
+modifyTree(function(root) {
+ var fieldset2 = root.querySelector('.fieldset2');
+ var div3 = root.querySelector('.div3');
+ div3.appendChild(fieldset2);
+});
+testStyle(['fieldset3', 'fieldset2', 'input1']);
+
+debug('');
+debug("Destroy the content of div2");
+modifyTree(function(root) {
+ root.querySelector('.div2').textContent = '';
+});
+testStyle([]);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate2expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,369 @@
</span><ins>+Test style update for :invalid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input3 to something that validates.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input7 to something that validates.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input9 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input5 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input6 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input7 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Change the type of input10 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable the text area.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate2html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-2.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,136 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :invalid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="valid">
+ <input class="input2" type="button" required value="valid">
+ <input class="input3" type="hidden" required value="valid">
+ <input class="input4" type="email" required value="awesome@webkit.org">
+ <input class="input5" type="password" required value="valid">
+ <button class="button1">Base button</button>
+ <button class="button2" type="submit">Submit button</button>
+ </div>
+ </fieldset>
+ <textarea class="textarea1" required></textarea>
+ <input class="input6" required>
+ <input class="input7" type="button" required>
+ <input class="input8" type="hidden" required>
+ <input class="input9" type="email" required>
+ <input class="input10" type="password" required>
+ <button class="button3">Base button</button>
+ <button class="button4" type="submit">Submit button</button>
+ </div>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :invalid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset1', 'textarea1', 'input6', 'input9', 'input10']);
+
+debug('');
+debug("Change the type of input3 to something that validates.");
+modifyTree(function(root) {
+ root.querySelector('.input3').type = "search";
+});
+testStyle(['fieldset1', 'textarea1', 'input6', 'input9', 'input10']);
+
+debug('');
+debug("Change the type of input7 to something that validates.");
+modifyTree(function(root) {
+ root.querySelector('.input7').type = "search";
+});
+testStyle(['fieldset1', 'textarea1', 'input6', 'input7', 'input9', 'input10']);
+
+debug('');
+debug("Change the type of input9 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input9').type = "hidden";
+});
+testStyle(['fieldset1', 'textarea1', 'input6', 'input7', 'input10']);
+
+debug('');
+debug("Change the type of input5 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input5').type = "button";
+});
+testStyle(['fieldset1', 'textarea1', 'input6', 'input7', 'input10']);
+
+// Change everything in the second half of controls without validation, eventually, fieldset1 should validate.
+debug('');
+debug("Change the type of input6 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input6').type = "button";
+});
+testStyle(['fieldset1', 'textarea1', 'input7', 'input10']);
+
+debug('');
+debug("Change the type of input7 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input7').type = "reset";
+});
+testStyle(['fieldset1', 'textarea1', 'input10']);
+
+debug('');
+debug("Change the type of input10 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input10').type = "reset";
+});
+testStyle(['fieldset1', 'textarea1']);
+
+debug('');
+debug("Disable the text area.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').setAttribute('disabled', '');
+});
+testStyle([]);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate3expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,195 @@
</span><ins>+Test style update for :invalid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input1 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input2 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input3 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input4 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input5 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input6 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Enable fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input1
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input2
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input4
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input5
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Remove input6
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate3html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-3.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,183 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :invalid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ </fieldset>
+ <fieldset class="fieldset2" disabled>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :invalid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle([]);
+
+debug('');
+debug("Add input1 to fieldset1.");
+modifyTree(function(root) {
+ var input1 = document.createElement('input');
+ input1.className = 'input1';
+ root.querySelector('.fieldset1').appendChild(input1);
+});
+testStyle([]);
+
+debug('');
+debug("Add input2 to fieldset1.");
+modifyTree(function(root) {
+ var input2 = document.createElement('input');
+ input2.className = 'input2';
+ input2.setAttribute('required', '');
+ root.querySelector('.fieldset1').appendChild(input2);
+});
+testStyle(['fieldset1', 'input2']);
+
+debug('');
+debug("Add input3 to fieldset1.");
+modifyTree(function(root) {
+ var input3 = document.createElement('input');
+ input3.className = 'input3';
+ input3.setAttribute('required', '');
+ input3.value = "valid";
+ root.querySelector('.fieldset1').appendChild(input3);
+});
+testStyle(['fieldset1', 'input2']);
+
+debug('');
+debug("Add input4 to fieldset2.");
+modifyTree(function(root) {
+ var input4 = document.createElement('input');
+ input4.className = 'input4';
+ root.querySelector('.fieldset2').appendChild(input4);
+});
+testStyle(['fieldset1', 'input2']);
+
+debug('');
+debug("Add input5 to fieldset2.");
+modifyTree(function(root) {
+ var input5 = document.createElement('input');
+ input5.className = 'input5';
+ input5.setAttribute('required', '');
+ root.querySelector('.fieldset2').appendChild(input5);
+});
+testStyle(['fieldset1', 'input2']);
+
+debug('');
+debug("Add input6 to fieldset2.");
+modifyTree(function(root) {
+ var input6 = document.createElement('input');
+ input6.className = 'input6';
+ input6.setAttribute('required', '');
+ input6.value = "valid"
+ root.querySelector('.fieldset2').appendChild(input6);
+});
+testStyle(['fieldset1', 'input2']);
+
+debug('');
+debug("Enable fieldset2.");
+modifyTree(function(root) {
+ root.querySelector('.fieldset2').removeAttribute('disabled');
+});
+testStyle(['fieldset1', 'input2', 'fieldset2', 'input5']);
+
+debug('');
+debug("Disable fieldset1.");
+modifyTree(function(root) {
+ root.querySelector('.fieldset1').setAttribute('disabled', '');
+});
+testStyle(['fieldset2', 'input5']);
+
+debug('');
+debug("Remove input1");
+modifyTree(function(root) {
+ var input = root.querySelector('.input1');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset2', 'input5']);
+
+debug('');
+debug("Remove input2");
+modifyTree(function(root) {
+ var input = root.querySelector('.input2');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset2', 'input5']);
+
+debug('');
+debug("Remove input3");
+modifyTree(function(root) {
+ var input = root.querySelector('.input3');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset2', 'input5']);
+
+debug('');
+debug("Remove input4");
+modifyTree(function(root) {
+ var input = root.querySelector('.input4');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset2', 'input5']);
+
+debug('');
+debug("Remove input5");
+modifyTree(function(root) {
+ var input = root.querySelector('.input5');
+ input.parentNode.removeChild(input);
+});
+testStyle([]);
+
+debug('');
+debug("Remove input6");
+modifyTree(function(root) {
+ var input = root.querySelector('.input6');
+ input.parentNode.removeChild(input);
+});
+testStyle([]);
+
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate4expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,191 @@
</span><ins>+Test style update for :invalid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input1 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input1 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input2 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input2 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input3 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input3 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input4 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input4.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input4.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input4 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate4html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-4.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,182 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :invalid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ </fieldset>
+ <fieldset class="fieldset2" disabled>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :invalid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle([]);
+
+debug('');
+debug("Add input1 to fieldset1.");
+modifyTree(function(root) {
+ var input1 = document.createElement('input');
+ input1.className = 'input1';
+ root.querySelector('.fieldset1').appendChild(input1);
+});
+testStyle([]);
+
+debug('');
+debug("Disable input1.");
+modifyTree(function(root) {
+ root.querySelector('.input1').setAttribute('disabled', '');
+});
+testStyle([]);
+
+debug('');
+debug("Re-enable input1.");
+modifyTree(function(root) {
+ root.querySelector('.input1').removeAttribute('disabled');
+});
+testStyle([]);
+
+debug('');
+debug("Make input1 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input1').setAttribute('readonly', '');
+});
+testStyle([]);
+
+debug('');
+debug("Add input2 to fieldset2.");
+modifyTree(function(root) {
+ var input2 = document.createElement('input');
+ input2.className = 'input2';
+ root.querySelector('.fieldset2').appendChild(input2);
+});
+testStyle([]);
+
+debug('');
+debug("Disable input2.");
+modifyTree(function(root) {
+ root.querySelector('.input2').setAttribute('disabled', '');
+});
+testStyle([]);
+
+debug('');
+debug("Re-enable input2.");
+modifyTree(function(root) {
+ root.querySelector('.input2').removeAttribute('disabled');
+});
+testStyle([]);
+
+debug('');
+debug("Make input2 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input2').setAttribute('readonly', '');
+});
+testStyle([]);
+
+debug('');
+debug("Add input3 to fieldset1.");
+modifyTree(function(root) {
+ var input3 = document.createElement('input');
+ input3.className = 'input3';
+ input3.setAttribute('required', '');
+ root.querySelector('.fieldset1').appendChild(input3);
+});
+testStyle(['fieldset1', 'input3']);
+
+debug('');
+debug("Disable input3.");
+modifyTree(function(root) {
+ root.querySelector('.input3').setAttribute('disabled', '');
+});
+testStyle([]);
+
+debug('');
+debug("Re-enable input3.");
+modifyTree(function(root) {
+ root.querySelector('.input3').removeAttribute('disabled');
+});
+testStyle(['fieldset1', 'input3']);
+
+debug('');
+debug("Make input3 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input3').setAttribute('readonly', '');
+});
+testStyle([]);
+
+debug('');
+debug("Add input4 to fieldset2.");
+modifyTree(function(root) {
+ var input4 = document.createElement('input');
+ input4.className = 'input4';
+ input4.setAttribute('required', '');
+ root.querySelector('.fieldset2').appendChild(input4);
+});
+testStyle([]);
+
+debug('');
+debug("Disable input4.");
+modifyTree(function(root) {
+ root.querySelector('.input4').setAttribute('disabled', '');
+});
+testStyle([]);
+
+debug('');
+debug("Re-enable input4.");
+modifyTree(function(root) {
+ root.querySelector('.input4').removeAttribute('disabled');
+});
+testStyle([]);
+
+debug('');
+debug("Make input4 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input4').setAttribute('readonly', '');
+});
+testStyle([]);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate5expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,23 @@
</span><ins>+Test style update for :invalid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Move fieldset2 inside div3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsinvalidfieldsetstyleupdate5html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/invalid-fieldset-style-update-5.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,73 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :invalid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="">
+ </div>
+ </fieldset>
+ </div>
+ </fieldset>
+ <div class="div3">
+ </div>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :invalid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug("Move fieldset2 inside div3");
+modifyTree(function(root) {
+ var fieldset2 = root.querySelector('.fieldset2');
+ var div3 = root.querySelector('.div3');
+ div3.appendChild(fieldset2);
+});
+testStyle(['fieldset2', 'input1']);
+
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate1expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,259 @@
</span><ins>+Test style update for :valid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Back to invalid. We should be in the initial state.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move the invalid text area into fieldset3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+
+Make the input invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+
+Move text area as a child of fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move text area as a child of div1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the input valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the text area valid, everything should be valid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Make the input invalid.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+
+Move fieldset2 inside div3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+
+Destroy the content of div2
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate1html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-1.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,171 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :valid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="valid">
+ </div>
+ </fieldset>
+ <textarea class="textarea1" required></textarea>
+ </div>
+ </fieldset>
+ <fieldset class="fieldset3">
+ <div class="div3">
+ </div>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :valid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset2', 'input1', 'fieldset3']);
+
+debug('');
+debug("Make the text area valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1', 'fieldset3', 'textarea1']);
+
+debug('');
+debug("Back to invalid. We should be in the initial state.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "";
+});
+testStyle(['fieldset2', 'input1', 'fieldset3']);
+
+
+debug('');
+debug("Move the invalid text area into fieldset3.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var fieldset3 = root.querySelector('.fieldset3');
+ fieldset3.appendChild(textArea);
+});
+testStyle(['fieldset1', 'fieldset2', 'input1']);
+
+debug('');
+debug("Make the text area valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1', 'fieldset3', 'textarea1']);
+
+debug('');
+debug("Make the input invalid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "";
+});
+testStyle(['fieldset3', 'textarea1']);
+
+debug('');
+debug("Move text area as a child of fieldset1.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var fieldset1 = root.querySelector('.fieldset1');
+ fieldset1.appendChild(textArea);
+});
+testStyle(['textarea1', 'fieldset3']);
+
+debug('');
+debug("Move text area as a child of div1.");
+modifyTree(function(root) {
+ var textArea = root.querySelector('.textarea1');
+ var div1 = root.querySelector('.div1');
+ div1.appendChild(textArea);
+});
+testStyle(['textarea1', 'fieldset3']);
+
+debug('');
+debug("Make the text area invalid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "";
+});
+testStyle(['fieldset3']);
+
+debug('');
+debug("Make the input valid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "Valid";
+});
+testStyle(['fieldset2', 'input1', 'fieldset3']);
+
+debug('');
+debug("Make the text area valid, everything should be valid.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').value = "Valid";
+});
+testStyle(['fieldset1', 'fieldset2', 'input1', 'textarea1', 'fieldset3']);
+
+debug('');
+debug("Make the input invalid.");
+modifyTree(function(root) {
+ root.querySelector('.input1').value = "";
+});
+testStyle(['fieldset3', 'textarea1']);
+
+
+debug('');
+debug("Move fieldset2 inside div3");
+modifyTree(function(root) {
+ var fieldset2 = root.querySelector('.fieldset2');
+ var div3 = root.querySelector('.div3');
+ div3.appendChild(fieldset2);
+});
+testStyle(['fieldset1', 'textarea1']);
+
+debug('');
+debug("Destroy the content of div2");
+modifyTree(function(root) {
+ root.querySelector('.div2').textContent = '';
+});
+testStyle(['fieldset1', 'textarea1', 'fieldset3', 'fieldset2']);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate2expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,369 @@
</span><ins>+Test style update for :valid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input3 to something that validates.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input7 to something that validates.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input9 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input5 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input6 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input7 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Change the type of input10 to something that does not validate.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+
+Disable the text area.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".textarea1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input7")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input8")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input9")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input10")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".button4")).backgroundColor is "rgb(4, 5, 6)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate2html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-2.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,136 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :valid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="valid">
+ <input class="input2" type="button" required value="valid">
+ <input class="input3" type="hidden" required value="valid">
+ <input class="input4" type="email" required value="awesome@webkit.org">
+ <input class="input5" type="password" required value="valid">
+ <button class="button1">Base button</button>
+ <button class="button2" type="submit">Submit button</button>
+ </div>
+ </fieldset>
+ <textarea class="textarea1" required></textarea>
+ <input class="input6" required>
+ <input class="input7" type="button" required>
+ <input class="input8" type="hidden" required>
+ <input class="input9" type="email" required>
+ <input class="input10" type="password" required>
+ <button class="button3">Base button</button>
+ <button class="button4" type="submit">Submit button</button>
+ </div>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :valid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset2', 'input1', 'input4', 'input5', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input3 to something that validates.");
+modifyTree(function(root) {
+ root.querySelector('.input3').type = "search";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'input5', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input7 to something that validates.");
+modifyTree(function(root) {
+ root.querySelector('.input7').type = "search";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'input5', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input9 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input9').type = "hidden";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'input5', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input5 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input5').type = "button";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'button1', 'button2', 'button3', 'button4']);
+
+// Change everything in the second half of controls without validation, eventually, fieldset1 should validate.
+debug('');
+debug("Change the type of input6 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input6').type = "button";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input7 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input7').type = "reset";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Change the type of input10 to something that does not validate.");
+modifyTree(function(root) {
+ root.querySelector('.input10').type = "reset";
+});
+testStyle(['fieldset2', 'input1', 'input3', 'input4', 'button1', 'button2', 'button3', 'button4']);
+
+debug('');
+debug("Disable the text area.");
+modifyTree(function(root) {
+ root.querySelector('.textarea1').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'fieldset2', 'input1', 'input3', 'input4', 'button1', 'button2', 'button3', 'button4']);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate3expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,195 @@
</span><ins>+Test style update for :valid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input1 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input2 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input3 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input4 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input5 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input6 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(1, 2, 3)"
+
+Enable fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Disable fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input1
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input2
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input4
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input5")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input5
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input6")).backgroundColor is "rgb(4, 5, 6)"
+
+Remove input6
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate3html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-3.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,183 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :valid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ </fieldset>
+ <fieldset class="fieldset2" disabled>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :valid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Add input1 to fieldset1.");
+modifyTree(function(root) {
+ var input1 = document.createElement('input');
+ input1.className = 'input1';
+ root.querySelector('.fieldset1').appendChild(input1);
+});
+testStyle(['fieldset1', 'input1', 'fieldset2']);
+
+debug('');
+debug("Add input2 to fieldset1.");
+modifyTree(function(root) {
+ var input2 = document.createElement('input');
+ input2.className = 'input2';
+ input2.setAttribute('required', '');
+ root.querySelector('.fieldset1').appendChild(input2);
+});
+testStyle(['input1', 'fieldset2']);
+
+debug('');
+debug("Add input3 to fieldset1.");
+modifyTree(function(root) {
+ var input3 = document.createElement('input');
+ input3.className = 'input3';
+ input3.setAttribute('required', '');
+ input3.value = "valid";
+ root.querySelector('.fieldset1').appendChild(input3);
+});
+testStyle(['input1', 'input3', 'fieldset2']);
+
+debug('');
+debug("Add input4 to fieldset2.");
+modifyTree(function(root) {
+ var input4 = document.createElement('input');
+ input4.className = 'input4';
+ root.querySelector('.fieldset2').appendChild(input4);
+});
+testStyle(['input1', 'input3', 'fieldset2']);
+
+debug('');
+debug("Add input5 to fieldset2.");
+modifyTree(function(root) {
+ var input5 = document.createElement('input');
+ input5.className = 'input5';
+ input5.setAttribute('required', '');
+ root.querySelector('.fieldset2').appendChild(input5);
+});
+testStyle(['input1', 'input3', 'fieldset2']);
+
+debug('');
+debug("Add input6 to fieldset2.");
+modifyTree(function(root) {
+ var input6 = document.createElement('input');
+ input6.className = 'input6';
+ input6.setAttribute('required', '');
+ input6.value = "valid"
+ root.querySelector('.fieldset2').appendChild(input6);
+});
+testStyle(['input1', 'input3', 'fieldset2']);
+
+debug('');
+debug("Enable fieldset2.");
+modifyTree(function(root) {
+ root.querySelector('.fieldset2').removeAttribute('disabled');
+});
+testStyle(['input1', 'input3', 'input4', 'input6']);
+
+debug('');
+debug("Disable fieldset1.");
+modifyTree(function(root) {
+ root.querySelector('.fieldset1').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'input4', 'input6']);
+
+debug('');
+debug("Remove input1");
+modifyTree(function(root) {
+ var input = root.querySelector('.input1');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'input4', 'input6']);
+
+debug('');
+debug("Remove input2");
+modifyTree(function(root) {
+ var input = root.querySelector('.input2');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'input4', 'input6']);
+
+debug('');
+debug("Remove input3");
+modifyTree(function(root) {
+ var input = root.querySelector('.input3');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'input4', 'input6']);
+
+debug('');
+debug("Remove input4");
+modifyTree(function(root) {
+ var input = root.querySelector('.input4');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'input6']);
+
+debug('');
+debug("Remove input5");
+modifyTree(function(root) {
+ var input = root.querySelector('.input5');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'fieldset2', 'input6']);
+
+debug('');
+debug("Remove input6");
+modifyTree(function(root) {
+ var input = root.querySelector('.input6');
+ input.parentNode.removeChild(input);
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate4expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,191 @@
</span><ins>+Test style update for :valid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Initial state
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input1 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Disable input1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Re-enable input1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Make input1 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+
+Add input2 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input2 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input3 to fieldset1.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input3.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input3 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+
+Add input4 to fieldset2.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Disable input4.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Re-enable input4.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+
+Make input4 readonly.
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input4")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate4html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-4.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,182 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :valid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ </fieldset>
+ <fieldset class="fieldset2" disabled>
+ </fieldset>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :valid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug('Initial state');
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Add input1 to fieldset1.");
+modifyTree(function(root) {
+ var input1 = document.createElement('input');
+ input1.className = 'input1';
+ root.querySelector('.fieldset1').appendChild(input1);
+});
+testStyle(['fieldset1', 'input1', 'fieldset2']);
+
+debug('');
+debug("Disable input1.");
+modifyTree(function(root) {
+ root.querySelector('.input1').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Re-enable input1.");
+modifyTree(function(root) {
+ root.querySelector('.input1').removeAttribute('disabled');
+});
+testStyle(['fieldset1', 'input1', 'fieldset2']);
+
+debug('');
+debug("Make input1 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input1').setAttribute('readonly', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Add input2 to fieldset2.");
+modifyTree(function(root) {
+ var input2 = document.createElement('input');
+ input2.className = 'input2';
+ root.querySelector('.fieldset2').appendChild(input2);
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Disable input2.");
+modifyTree(function(root) {
+ root.querySelector('.input2').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Re-enable input2.");
+modifyTree(function(root) {
+ root.querySelector('.input2').removeAttribute('disabled');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Make input2 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input2').setAttribute('readonly', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Add input3 to fieldset1.");
+modifyTree(function(root) {
+ var input3 = document.createElement('input');
+ input3.className = 'input3';
+ input3.setAttribute('required', '');
+ root.querySelector('.fieldset1').appendChild(input3);
+});
+testStyle(['fieldset2']);
+
+debug('');
+debug("Disable input3.");
+modifyTree(function(root) {
+ root.querySelector('.input3').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Re-enable input3.");
+modifyTree(function(root) {
+ root.querySelector('.input3').removeAttribute('disabled');
+});
+testStyle(['fieldset2']);
+
+debug('');
+debug("Make input3 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input3').setAttribute('readonly', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Add input4 to fieldset2.");
+modifyTree(function(root) {
+ var input4 = document.createElement('input');
+ input4.className = 'input4';
+ input4.setAttribute('required', '');
+ root.querySelector('.fieldset2').appendChild(input4);
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Disable input4.");
+modifyTree(function(root) {
+ root.querySelector('.input4').setAttribute('disabled', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Re-enable input4.");
+modifyTree(function(root) {
+ root.querySelector('.input4').removeAttribute('disabled');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+debug('');
+debug("Make input4 readonly.");
+modifyTree(function(root) {
+ root.querySelector('.input4').setAttribute('readonly', '');
+});
+testStyle(['fieldset1', 'fieldset2']);
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate5expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5-expected.txt (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5-expected.txt 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,23 @@
</span><ins>+Test style update for :valid applied on a fieldset.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+Move fieldset2 inside div3
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("with-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset1")).backgroundColor is "rgb(4, 5, 6)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div1")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div3")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".fieldset2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".div2")).backgroundColor is "rgb(1, 2, 3)"
+PASS getComputedStyle(document.getElementById("without-renderer").querySelector(".input1")).backgroundColor is "rgb(1, 2, 3)"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastselectorsvalidfieldsetstyleupdate5html"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5.html (0 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5.html (rev 0)
+++ trunk/LayoutTests/fast/selectors/valid-fieldset-style-update-5.html 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -0,0 +1,73 @@
</span><ins>+<!doctype html>
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+<style>
+:matches(#with-renderer, #without-renderer) * {
+ background-color: rgb(1, 2, 3);
+}
+:matches(#with-renderer, #without-renderer) :valid {
+ background-color: rgb(4, 5, 6);
+}
+</style>
+</head>
+<body>
+ <template id="test-source">
+ <fieldset class="fieldset1">
+ <div class="div1">
+ <fieldset class="fieldset2">
+ <div class="div2">
+ <input class="input1" required value="">
+ </div>
+ </fieldset>
+ </div>
+ </fieldset>
+ <div class="div3">
+ </div>
+ </template>
+ <div id="with-renderer"></div>
+ <div id="without-renderer" style="display:none;"></div>
+</body>
+<script>
+description('Test style update for :valid applied on a fieldset.');
+
+var withRenderer = document.getElementById("with-renderer");
+var withoutRenderer = document.getElementById("without-renderer");
+var source = document.getElementById("test-source").content;
+
+withRenderer.appendChild(source.cloneNode(true));
+withoutRenderer.appendChild(source.cloneNode(true));
+
+function testStyleAtId(rootId, matchedClass) {
+ var allElements = document.getElementById(rootId).querySelectorAll('*');
+ for (var i = 0; i < allElements.length; ++i) {
+ var expectedStyle = matchedClass.indexOf(allElements[i].className) >= 0 ? 'rgb(4, 5, 6)' : 'rgb(1, 2, 3)';
+ shouldBeEqualToString('getComputedStyle(document.getElementById("' + rootId + '").querySelector(".' + allElements[i].className + '")).backgroundColor', expectedStyle);
+ }
+}
+
+function testStyle(matchedClass) {
+ testStyleAtId('with-renderer', matchedClass);
+ testStyleAtId('without-renderer', matchedClass);
+}
+
+function modifyTree(updateFunction) {
+ updateFunction(withRenderer);
+ updateFunction(withoutRenderer);
+}
+
+debug('');
+debug("Move fieldset2 inside div3");
+modifyTree(function(root) {
+ var fieldset2 = root.querySelector('.fieldset2');
+ var div3 = root.querySelector('.div3');
+ div3.appendChild(fieldset2);
+});
+testStyle(['fieldset1']);
+
+
+// Remove the content otherwise it will appear in the results.
+withRenderer.style.display = 'none';
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</html>
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/ChangeLog 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -1,3 +1,133 @@
</span><ins>+2014-11-16 Benjamin Poulain <benjamin@webkit.org>
+
+ Implement :valid and :invalid matching for the fieldset element
+ https://bugs.webkit.org/show_bug.cgi?id=138769
+
+ Reviewed by Darin Adler.
+
+ In the latest HTML spec, the pseudo classes :valid and :invalid match
+ a fieldset element based on its descendants:
+ https://html.spec.whatwg.org/#selector-valid
+ https://html.spec.whatwg.org/#selector-invalid
+
+ This patch adds that behavior.
+
+ There are two key problems to solve with these pseudo classes on fieldset:
+ -Efficient matching.
+ -Style invalidation when any of the descendant changes.
+
+ To implement the style invalidation, I have modified HTMLFormControlElement
+ to notify its ancestor when its state changes.
+
+ The first change is making the state fully internal to HTMLFormControlElement,
+ we do not want subclass to be able to change the behavior and forget to update
+ the ancestors.
+
+ To achieve that encapsulation, the interface was changed a bit:
+ -Neither willValidate() nor isValidFormControlElement() inherit from Element.
+ Instead, willValidate() is the implementation of FormAssociatedElement's interface
+ and it is final. The method isValidFormControlElement() becomes completely internal
+ to HTMLFormControlElement.
+ -Since willValidate() should no longer be re-implemented by subclass, the elements
+ that were depending on it have been migrated to recalcWillValidate() to set
+ the initial state as needed.
+
+ With the validity state fully encapsulated in HTMLFormControlElement, all I need
+ is a way to communicate that information to HTMLFieldSetElement ancestors.
+ This is done in two cases:
+ -The validity state changes.
+ -The tree changes in a way that would make the input element not a descendant
+ of a HTMLFieldSetElement.
+
+ The invalidation is simply done by walking up the ancestors and adding the current
+ element to a "validity dependency list" on each HTMLFieldSetElement.
+
+ Tests: fast/css/pseudo-invalid-fieldset-invalidation-optimization.html
+ fast/css/pseudo-invalid-fieldset-style-sharing.html
+ fast/css/pseudo-invalid-fieldset.html
+ fast/css/pseudo-valid-fieldset-invalidation-optimization.html
+ fast/css/pseudo-valid-fieldset-style-sharing.html
+ fast/css/pseudo-valid-fieldset.html
+ fast/selectors/invalid-fieldset-style-update-1.html
+ fast/selectors/invalid-fieldset-style-update-2.html
+ fast/selectors/invalid-fieldset-style-update-3.html
+ fast/selectors/invalid-fieldset-style-update-4.html
+ fast/selectors/invalid-fieldset-style-update-5.html
+ fast/selectors/valid-fieldset-style-update-1.html
+ fast/selectors/valid-fieldset-style-update-2.html
+ fast/selectors/valid-fieldset-style-update-3.html
+ fast/selectors/valid-fieldset-style-update-4.html
+ fast/selectors/valid-fieldset-style-update-5.html
+
+ * css/SelectorCheckerTestFunctions.h:
+ (WebCore::isInRange):
+ (WebCore::isOutOfRange):
+ (WebCore::isInvalid):
+ (WebCore::isValid):
+ The hack "ContainsValidityStyleRules" is in the way of correct styling
+ of FieldSet and Form.
+ It is not the right way to get stylesheet properties anyway.
+
+ * css/StyleResolver.cpp:
+ (WebCore::StyleResolver::canShareStyleWithControl):
+ Make sure style sharing does not incorrectly share style for fieldset elements.
+
+ * dom/Document.cpp:
+ (WebCore::Document::Document):
+ * dom/Document.h:
+ (WebCore::Document::containsValidityStyleRules): Deleted.
+ (WebCore::Document::setContainsValidityStyleRules): Deleted.
+ * dom/Element.h:
+ (WebCore::Element::matchesValidPseudoClass):
+ (WebCore::Element::matchesInvalidPseudoClass):
+ (WebCore::Element::willValidate): Deleted.
+ (WebCore::Element::isValidFormControlElement): Deleted.
+ * html/FormAssociatedElement.cpp:
+ (WebCore::FormAssociatedElement::customError):
+ * html/FormAssociatedElement.h:
+
+ * html/HTMLFieldSetElement.cpp:
+ (WebCore::HTMLFieldSetElement::matchesValidPseudoClass):
+ (WebCore::HTMLFieldSetElement::matchesInvalidPseudoClass):
+ (WebCore::HTMLFieldSetElement::addInvalidDescendant):
+ (WebCore::HTMLFieldSetElement::removeInvalidDescendant):
+ Each HTMLFormControlElement that has constraint validation adds or removes
+ itself from its HTMLFieldSetElement ancestors.
+
+ It should be possible to just keep track of a count instead of a HashSet.
+ I decided to got with the HashSet to make the code more robust and easier
+ to debug. A few assertions ensure that the HashSet is actually used as a counter.
+
+ * html/HTMLFieldSetElement.h:
+ * html/HTMLFormControlElement.cpp:
+ (WebCore::addInvalidElementToAncestorFromInsertionPoint):
+ (WebCore::removeInvalidElementToAncestorFromInsertionPoint):
+
+ (WebCore::HTMLFormControlElement::insertedInto):
+ (WebCore::HTMLFormControlElement::removedFrom):
+ One tricky part of those two functions is that we cannot use
+ matchesValidPseudoClass() or matchesInvalidPseudoClass().
+
+ The reason is that HTMLFieldSetElement is a subclass of HTMLFormControlElement
+ and it has its own definition of what Valid and Invalid mean when matching selectors.
+
+ In HTMLFormControlElement, we must use the internal state,
+ willValidate() and isValidFormControlElement() must be used directly.
+
+ (WebCore::HTMLFormControlElement::matchesValidPseudoClass):
+ (WebCore::HTMLFormControlElement::matchesInvalidPseudoClass):
+ (WebCore::HTMLFormControlElement::willValidate):
+ (WebCore::addInvalidElementToAncestors):
+ (WebCore::removeInvalidElementFromAncestors):
+ (WebCore::HTMLFormControlElement::setNeedsWillValidateCheck):
+ (WebCore::HTMLFormControlElement::setNeedsValidityCheck):
+ (WebCore::HTMLFormControlElement::isValidFormControlElement): Deleted.
+ * html/HTMLFormControlElement.h:
+ (WebCore::HTMLFormControlElement::isValidFormControlElement):
+ * html/HTMLKeygenElement.h:
+ * html/HTMLObjectElement.h:
+ * html/HTMLOutputElement.h:
+
</ins><span class="cx"> 2014-11-16 Zan Dobersek <zdobersek@igalia.com>
</span><span class="cx">
</span><span class="cx"> [TexMap] Add typecasting support for GraphicsLayerTextureMapper
</span></span></pre></div>
<a id="trunkSourceWebCorecssSelectorCheckerTestFunctionsh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/css/SelectorCheckerTestFunctions.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/css/SelectorCheckerTestFunctions.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/css/SelectorCheckerTestFunctions.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -86,20 +86,17 @@
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isInRange(Element* element)
</span><span class="cx"> {
</span><del>- element->document().setContainsValidityStyleRules();
</del><span class="cx"> return element->isInRange();
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isOutOfRange(Element* element)
</span><span class="cx"> {
</span><del>- element->document().setContainsValidityStyleRules();
</del><span class="cx"> return element->isOutOfRange();
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isInvalid(const Element* element)
</span><span class="cx"> {
</span><del>- element->document().setContainsValidityStyleRules();
- return element->willValidate() && !element->isValidFormControlElement();
</del><ins>+ return element->matchesInvalidPseudoClass();
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isOptionalFormControl(const Element* element)
</span><span class="lines">@@ -114,8 +111,7 @@
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isValid(const Element* element)
</span><span class="cx"> {
</span><del>- element->document().setContainsValidityStyleRules();
- return element->willValidate() && element->isValidFormControlElement();
</del><ins>+ return element->matchesValidPseudoClass();
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> ALWAYS_INLINE bool isWindowInactive(const Element* element)
</span></span></pre></div>
<a id="trunkSourceWebCorecssStyleResolvercpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/css/StyleResolver.cpp (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/css/StyleResolver.cpp 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/css/StyleResolver.cpp 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -525,22 +525,18 @@
</span><span class="cx"> if (element->isDefaultButtonForForm() != state.element()->isDefaultButtonForForm())
</span><span class="cx"> return false;
</span><span class="cx">
</span><del>- if (state.document().containsValidityStyleRules()) {
- bool willValidate = element->willValidate();
</del><ins>+ if (element->matchesValidPseudoClass() != state.element()->matchesValidPseudoClass())
+ return false;
</ins><span class="cx">
</span><del>- if (willValidate != state.element()->willValidate())
- return false;
</del><ins>+ if (element->matchesInvalidPseudoClass() != state.element()->matchesValidPseudoClass())
+ return false;
</ins><span class="cx">
</span><del>- if (willValidate && (element->isValidFormControlElement() != state.element()->isValidFormControlElement()))
- return false;
</del><ins>+ if (element->isInRange() != state.element()->isInRange())
+ return false;
</ins><span class="cx">
</span><del>- if (element->isInRange() != state.element()->isInRange())
- return false;
</del><ins>+ if (element->isOutOfRange() != state.element()->isOutOfRange())
+ return false;
</ins><span class="cx">
</span><del>- if (element->isOutOfRange() != state.element()->isOutOfRange())
- return false;
- }
-
</del><span class="cx"> return true;
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebCoredomDocumentcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/dom/Document.cpp (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/dom/Document.cpp 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/dom/Document.cpp 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -440,7 +440,6 @@
</span><span class="cx"> , m_closeAfterStyleRecalc(false)
</span><span class="cx"> , m_gotoAnchorNeededAfterStylesheetsLoad(false)
</span><span class="cx"> , m_frameElementsShouldIgnoreScrolling(false)
</span><del>- , m_containsValidityStyleRules(false)
</del><span class="cx"> , m_updateFocusAppearanceRestoresSelection(false)
</span><span class="cx"> , m_ignoreDestructiveWriteCount(0)
</span><span class="cx"> , m_titleSetExplicitly(false)
</span></span></pre></div>
<a id="trunkSourceWebCoredomDocumenth"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/dom/Document.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/dom/Document.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/dom/Document.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -1108,9 +1108,6 @@
</span><span class="cx"> virtual bool isContextThread() const override final;
</span><span class="cx"> virtual bool isJSExecutionForbidden() const override final { return false; }
</span><span class="cx">
</span><del>- bool containsValidityStyleRules() const { return m_containsValidityStyleRules; }
- void setContainsValidityStyleRules() { m_containsValidityStyleRules = true; }
-
</del><span class="cx"> void enqueueWindowEvent(PassRefPtr<Event>);
</span><span class="cx"> void enqueueDocumentEvent(PassRefPtr<Event>);
</span><span class="cx"> void enqueueOverflowEvent(PassRefPtr<Event>);
</span><span class="lines">@@ -1478,7 +1475,6 @@
</span><span class="cx"> bool m_isDNSPrefetchEnabled;
</span><span class="cx"> bool m_haveExplicitlyDisabledDNSPrefetch;
</span><span class="cx"> bool m_frameElementsShouldIgnoreScrolling;
</span><del>- bool m_containsValidityStyleRules;
</del><span class="cx"> bool m_updateFocusAppearanceRestoresSelection;
</span><span class="cx">
</span><span class="cx"> // http://www.whatwg.org/specs/web-apps/current-work/#ignore-destructive-writes-counter
</span></span></pre></div>
<a id="trunkSourceWebCoredomElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/dom/Element.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/dom/Element.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/dom/Element.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -453,14 +453,14 @@
</span><span class="cx"> virtual bool isMediaElement() const { return false; }
</span><span class="cx"> #endif
</span><span class="cx">
</span><ins>+ virtual bool matchesValidPseudoClass() const { return false; }
+ virtual bool matchesInvalidPseudoClass() const { return false; }
</ins><span class="cx"> virtual bool isFormControlElement() const { return false; }
</span><span class="cx"> virtual bool isSpinButtonElement() const { return false; }
</span><span class="cx"> virtual bool isTextFormControl() const { return false; }
</span><span class="cx"> virtual bool isOptionalFormControl() const { return false; }
</span><span class="cx"> virtual bool isRequiredFormControl() const { return false; }
</span><span class="cx"> virtual bool isDefaultButtonForForm() const { return false; }
</span><del>- virtual bool willValidate() const { return false; }
- virtual bool isValidFormControlElement() const { return false; }
</del><span class="cx"> virtual bool isInRange() const { return false; }
</span><span class="cx"> virtual bool isOutOfRange() const { return false; }
</span><span class="cx"> virtual bool isFrameElementBase() const { return false; }
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlFormAssociatedElementcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/FormAssociatedElement.cpp (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/FormAssociatedElement.cpp 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/FormAssociatedElement.cpp 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -175,7 +175,7 @@
</span><span class="cx">
</span><span class="cx"> bool FormAssociatedElement::customError() const
</span><span class="cx"> {
</span><del>- return asHTMLElement().willValidate() && !m_customValidationMessage.isEmpty();
</del><ins>+ return willValidate() && !m_customValidationMessage.isEmpty();
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> bool FormAssociatedElement::hasBadInput() const
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlFormAssociatedElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/FormAssociatedElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/FormAssociatedElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/FormAssociatedElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -106,6 +106,7 @@
</span><span class="cx"> String customValidationMessage() const;
</span><span class="cx">
</span><span class="cx"> private:
</span><ins>+ virtual bool willValidate() const = 0;
</ins><span class="cx"> virtual void refFormAssociatedElement() = 0;
</span><span class="cx"> virtual void derefFormAssociatedElement() = 0;
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLFieldSetElementcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLFieldSetElement.cpp (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLFieldSetElement.cpp 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLFieldSetElement.cpp 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -128,6 +128,16 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+bool HTMLFieldSetElement::matchesValidPseudoClass() const
+{
+ return m_invalidDescendants.isEmpty();
+}
+
+bool HTMLFieldSetElement::matchesInvalidPseudoClass() const
+{
+ return !m_invalidDescendants.isEmpty();
+}
+
</ins><span class="cx"> bool HTMLFieldSetElement::supportsFocus() const
</span><span class="cx"> {
</span><span class="cx"> return HTMLElement::supportsFocus();
</span><span class="lines">@@ -189,4 +199,25 @@
</span><span class="cx"> return length;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+void HTMLFieldSetElement::addInvalidDescendant(const HTMLFormControlElement& invalidFormControlElement)
+{
+ ASSERT_WITH_MESSAGE(!is<HTMLFieldSetElement>(invalidFormControlElement), "FieldSet are never candidates for constraint validation.");
+ ASSERT(static_cast<const Element&>(invalidFormControlElement).matchesInvalidPseudoClass());
+ ASSERT_WITH_MESSAGE(!m_invalidDescendants.contains(&invalidFormControlElement), "Updating the fieldset on validity change is not an efficient operation, it should only be done when necessary.");
+
+ if (m_invalidDescendants.isEmpty())
+ setNeedsStyleRecalc();
+ m_invalidDescendants.add(&invalidFormControlElement);
+}
+
+void HTMLFieldSetElement::removeInvalidDescendant(const HTMLFormControlElement& formControlElement)
+{
+ ASSERT_WITH_MESSAGE(!is<HTMLFieldSetElement>(formControlElement), "FieldSet are never candidates for constraint validation.");
+ ASSERT_WITH_MESSAGE(m_invalidDescendants.contains(&formControlElement), "Updating the fieldset on validity change is not an efficient operation, it should only be done when necessary.");
+
+ m_invalidDescendants.remove(&formControlElement);
+ if (m_invalidDescendants.isEmpty())
+ setNeedsStyleRecalc();
+}
+
</ins><span class="cx"> } // namespace
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLFieldSetElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLFieldSetElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLFieldSetElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLFieldSetElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -25,6 +25,7 @@
</span><span class="cx"> #define HTMLFieldSetElement_h
</span><span class="cx">
</span><span class="cx"> #include "HTMLFormControlElement.h"
</span><ins>+#include <wtf/HashSet.h>
</ins><span class="cx">
</span><span class="cx"> namespace WebCore {
</span><span class="cx">
</span><span class="lines">@@ -41,7 +42,8 @@
</span><span class="cx"> const Vector<FormAssociatedElement*>& associatedElements() const;
</span><span class="cx"> unsigned length() const;
</span><span class="cx">
</span><del>-protected:
</del><ins>+ void addInvalidDescendant(const HTMLFormControlElement&);
+ void removeInvalidDescendant(const HTMLFormControlElement&);
</ins><span class="cx">
</span><span class="cx"> private:
</span><span class="cx"> HTMLFieldSetElement(const QualifiedName&, Document&, HTMLFormElement*);
</span><span class="lines">@@ -57,11 +59,15 @@
</span><span class="cx"> virtual void childrenChanged(const ChildChange&) override;
</span><span class="cx"> virtual void didMoveToNewDocument(Document* oldDocument) override;
</span><span class="cx">
</span><ins>+ virtual bool matchesValidPseudoClass() const override;
+ virtual bool matchesInvalidPseudoClass() const override;
+
</ins><span class="cx"> void refreshElementsIfNeeded() const;
</span><span class="cx">
</span><span class="cx"> mutable Vector<FormAssociatedElement*> m_associatedElements;
</span><span class="cx"> // When dom tree is modified, we have to refresh the m_associatedElements array.
</span><span class="cx"> mutable uint64_t m_documentVersion;
</span><ins>+ HashSet<const HTMLFormControlElement*> m_invalidDescendants;
</ins><span class="cx"> };
</span><span class="cx">
</span><span class="cx"> } // namespace
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLFormControlElementcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLFormControlElement.cpp (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLFormControlElement.cpp 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLFormControlElement.cpp 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -27,6 +27,7 @@
</span><span class="cx">
</span><span class="cx"> #include "Attribute.h"
</span><span class="cx"> #include "ControlStates.h"
</span><ins>+#include "ElementAncestorIterator.h"
</ins><span class="cx"> #include "Event.h"
</span><span class="cx"> #include "EventHandler.h"
</span><span class="cx"> #include "EventNames.h"
</span><span class="lines">@@ -230,25 +231,52 @@
</span><span class="cx"> HTMLElement::didMoveToNewDocument(oldDocument);
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+static void addInvalidElementToAncestorFromInsertionPoint(const HTMLFormControlElement& element, ContainerNode* insertionPoint)
+{
+ if (!is<Element>(insertionPoint))
+ return;
+
+ for (auto& ancestor : lineageOfType<HTMLFieldSetElement>(downcast<Element>(*insertionPoint)))
+ ancestor.addInvalidDescendant(element);
+}
+
+static void removeInvalidElementToAncestorFromInsertionPoint(const HTMLFormControlElement& element, ContainerNode* insertionPoint)
+{
+ if (!is<Element>(insertionPoint))
+ return;
+
+ for (auto& ancestor : lineageOfType<HTMLFieldSetElement>(downcast<Element>(*insertionPoint)))
+ ancestor.removeInvalidDescendant(element);
+}
+
</ins><span class="cx"> Node::InsertionNotificationRequest HTMLFormControlElement::insertedInto(ContainerNode& insertionPoint)
</span><span class="cx"> {
</span><ins>+ if (willValidate() && !isValidFormControlElement())
+ addInvalidElementToAncestorFromInsertionPoint(*this, &insertionPoint);
+
</ins><span class="cx"> if (document().hasDisabledFieldsetElement())
</span><span class="cx"> setAncestorDisabled(computeIsDisabledByFieldsetAncestor());
</span><span class="cx"> m_dataListAncestorState = Unknown;
</span><span class="cx"> setNeedsWillValidateCheck();
</span><span class="cx"> HTMLElement::insertedInto(insertionPoint);
</span><span class="cx"> FormAssociatedElement::insertedInto(insertionPoint);
</span><ins>+
</ins><span class="cx"> return InsertionDone;
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> void HTMLFormControlElement::removedFrom(ContainerNode& insertionPoint)
</span><span class="cx"> {
</span><ins>+ bool wasMatchingInvalidPseudoClass = willValidate() && !isValidFormControlElement();
+
</ins><span class="cx"> m_validationMessage = nullptr;
</span><span class="cx"> if (m_disabledByAncestorFieldset)
</span><span class="cx"> setAncestorDisabled(computeIsDisabledByFieldsetAncestor());
</span><span class="cx"> m_dataListAncestorState = Unknown;
</span><span class="cx"> HTMLElement::removedFrom(insertionPoint);
</span><span class="cx"> FormAssociatedElement::removedFrom(insertionPoint);
</span><ins>+
+ if (wasMatchingInvalidPseudoClass)
+ removeInvalidElementToAncestorFromInsertionPoint(*this, &insertionPoint);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> void HTMLFormControlElement::setChangedSinceLastFormControlChangeEvent(bool changed)
</span><span class="lines">@@ -329,6 +357,16 @@
</span><span class="cx"> #endif
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+bool HTMLFormControlElement::matchesValidPseudoClass() const
+{
+ return willValidate() && isValidFormControlElement();
+}
+
+bool HTMLFormControlElement::matchesInvalidPseudoClass() const
+{
+ return willValidate() && !isValidFormControlElement();
+}
+
</ins><span class="cx"> short HTMLFormControlElement::tabIndex() const
</span><span class="cx"> {
</span><span class="cx"> // Skip the supportsFocus check in HTMLElement.
</span><span class="lines">@@ -355,10 +393,8 @@
</span><span class="cx"> if (!m_willValidateInitialized || m_dataListAncestorState == Unknown) {
</span><span class="cx"> m_willValidateInitialized = true;
</span><span class="cx"> bool newWillValidate = recalcWillValidate();
</span><del>- if (m_willValidate != newWillValidate) {
</del><ins>+ if (m_willValidate != newWillValidate)
</ins><span class="cx"> m_willValidate = newWillValidate;
</span><del>- const_cast<HTMLFormControlElement*>(this)->setNeedsValidityCheck();
- }
</del><span class="cx"> } else {
</span><span class="cx"> // If the following assertion fails, setNeedsWillValidateCheck() is not
</span><span class="cx"> // called correctly when something which changes recalcWillValidate() result
</span><span class="lines">@@ -374,10 +410,18 @@
</span><span class="cx"> bool newWillValidate = recalcWillValidate();
</span><span class="cx"> if (m_willValidateInitialized && m_willValidate == newWillValidate)
</span><span class="cx"> return;
</span><ins>+
+ bool wasValid = m_isValid;
+
</ins><span class="cx"> m_willValidateInitialized = true;
</span><span class="cx"> m_willValidate = newWillValidate;
</span><ins>+
</ins><span class="cx"> setNeedsValidityCheck();
</span><span class="cx"> setNeedsStyleRecalc();
</span><ins>+
+ if (!m_willValidate && !wasValid)
+ removeInvalidElementToAncestorFromInsertionPoint(*this, parentNode());
+
</ins><span class="cx"> if (!m_willValidate)
</span><span class="cx"> hideVisibleValidationMessage();
</span><span class="cx"> }
</span><span class="lines">@@ -414,7 +458,7 @@
</span><span class="cx"> return false;
</span><span class="cx"> }
</span><span class="cx">
</span><del>-bool HTMLFormControlElement::isValidFormControlElement() const
</del><ins>+inline bool HTMLFormControlElement::isValidFormControlElement() const
</ins><span class="cx"> {
</span><span class="cx"> // If the following assertion fails, setNeedsValidityCheck() is not called
</span><span class="cx"> // correctly when something which changes validity is updated.
</span><span class="lines">@@ -424,12 +468,20 @@
</span><span class="cx">
</span><span class="cx"> void HTMLFormControlElement::setNeedsValidityCheck()
</span><span class="cx"> {
</span><del>- bool newIsValid = valid();
- if (willValidate() && newIsValid != m_isValid) {
</del><ins>+ bool willValidate = this->willValidate();
+ bool wasValid = m_isValid;
+
+ m_isValid = valid();
+
+ if (willValidate && m_isValid != wasValid) {
</ins><span class="cx"> // Update style for pseudo classes such as :valid :invalid.
</span><span class="cx"> setNeedsStyleRecalc();
</span><ins>+
+ if (!m_isValid)
+ addInvalidElementToAncestorFromInsertionPoint(*this, parentNode());
+ else
+ removeInvalidElementToAncestorFromInsertionPoint(*this, parentNode());
</ins><span class="cx"> }
</span><del>- m_isValid = newIsValid;
</del><span class="cx">
</span><span class="cx"> // Updates only if this control already has a validtion message.
</span><span class="cx"> if (m_validationMessage && m_validationMessage->isVisible()) {
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLFormControlElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLFormControlElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLFormControlElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLFormControlElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -98,7 +98,7 @@
</span><span class="cx"> void setAutocapitalize(const AtomicString&);
</span><span class="cx"> #endif
</span><span class="cx">
</span><del>- virtual bool willValidate() const override;
</del><ins>+ virtual bool willValidate() const override final;
</ins><span class="cx"> void updateVisibleValidationMessage();
</span><span class="cx"> void hideVisibleValidationMessage();
</span><span class="cx"> bool checkValidity(Vector<RefPtr<FormAssociatedElement>>* unhandledInvalidControls = 0);
</span><span class="lines">@@ -150,6 +150,9 @@
</span><span class="cx"> virtual void refFormAssociatedElement() override { ref(); }
</span><span class="cx"> virtual void derefFormAssociatedElement() override { deref(); }
</span><span class="cx">
</span><ins>+ virtual bool matchesValidPseudoClass() const override;
+ virtual bool matchesInvalidPseudoClass() const override;
+
</ins><span class="cx"> virtual bool isFormControlElement() const override final { return true; }
</span><span class="cx"> virtual bool alwaysCreateUserAgentShadowRoot() const override { return true; }
</span><span class="cx">
</span><span class="lines">@@ -157,7 +160,7 @@
</span><span class="cx">
</span><span class="cx"> virtual HTMLFormElement* virtualForm() const override;
</span><span class="cx"> virtual bool isDefaultButtonForForm() const override;
</span><del>- virtual bool isValidFormControlElement() const override;
</del><ins>+ bool isValidFormControlElement() const;
</ins><span class="cx">
</span><span class="cx"> bool computeIsDisabledByFieldsetAncestor() const;
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLKeygenElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLKeygenElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLKeygenElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLKeygenElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -2,7 +2,7 @@
</span><span class="cx"> * Copyright (C) 1999 Lars Knoll (knoll@kde.org)
</span><span class="cx"> * (C) 1999 Antti Koivisto (koivisto@kde.org)
</span><span class="cx"> * (C) 2000 Dirk Mueller (mueller@kde.org)
</span><del>- * Copyright (C) 2004, 2005, 2006, 2010 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2004, 2005, 2006, 2010, 2014 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * This library is free software; you can redistribute it and/or
</span><span class="cx"> * modify it under the terms of the GNU Library General Public
</span><span class="lines">@@ -34,11 +34,10 @@
</span><span class="cx"> public:
</span><span class="cx"> static PassRefPtr<HTMLKeygenElement> create(const QualifiedName&, Document&, HTMLFormElement*);
</span><span class="cx">
</span><del>- virtual bool willValidate() const override { return false; }
-
</del><span class="cx"> private:
</span><span class="cx"> HTMLKeygenElement(const QualifiedName&, Document&, HTMLFormElement*);
</span><span class="cx">
</span><ins>+ virtual bool recalcWillValidate() const override { return false; }
</ins><span class="cx"> virtual bool canStartSelection() const override { return false; }
</span><span class="cx">
</span><span class="cx"> virtual void parseAttribute(const QualifiedName&, const AtomicString&) override;
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLObjectElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLObjectElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLObjectElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLObjectElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -42,6 +42,8 @@
</span><span class="cx"> virtual bool useFallbackContent() const override { return m_useFallbackContent; }
</span><span class="cx"> void renderFallbackContent();
</span><span class="cx">
</span><ins>+ virtual bool willValidate() const override { return false; }
+
</ins><span class="cx"> // Implementation of constraint validation API.
</span><span class="cx"> // Note that the object elements are always barred from constraint validation.
</span><span class="cx"> static bool checkValidity() { return true; }
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLOutputElementh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLOutputElement.h (176173 => 176174)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLOutputElement.h 2014-11-17 06:49:41 UTC (rev 176173)
+++ trunk/Source/WebCore/html/HTMLOutputElement.h 2014-11-17 07:01:21 UTC (rev 176174)
</span><span class="lines">@@ -40,8 +40,6 @@
</span><span class="cx"> public:
</span><span class="cx"> static PassRefPtr<HTMLOutputElement> create(const QualifiedName&, Document&, HTMLFormElement*);
</span><span class="cx">
</span><del>- virtual bool willValidate() const override { return false; }
-
</del><span class="cx"> String value() const;
</span><span class="cx"> void setValue(const String&);
</span><span class="cx"> String defaultValue() const;
</span><span class="lines">@@ -54,6 +52,7 @@
</span><span class="cx"> private:
</span><span class="cx"> HTMLOutputElement(const QualifiedName&, Document&, HTMLFormElement*);
</span><span class="cx">
</span><ins>+ virtual bool recalcWillValidate() const override { return false; }
</ins><span class="cx"> virtual void parseAttribute(const QualifiedName&, const AtomicString&) override;
</span><span class="cx"> virtual const AtomicString& formControlType() const override;
</span><span class="cx"> virtual bool isEnumeratable() const override { return true; }
</span></span></pre>
</div>
</div>
</body>
</html>