Auto merge of #8274 - bholley:state_restyle_hints, r=pcwalton

Implement state-based restyle hints



<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/8274)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2015-11-01 07:23:51 +05:30
commit 959ae86bd0
12 changed files with 441 additions and 31 deletions

View file

@ -2927,6 +2927,18 @@
"url": "/_mozilla/css/quotes_simple_a.html"
}
],
"css/restyle_hints_state.html": [
{
"path": "css/restyle_hints_state.html",
"references": [
[
"/_mozilla/css/restyle_hints_state_ref.html",
"=="
]
],
"url": "/_mozilla/css/restyle_hints_state.html"
}
],
"css/root_height_a.html": [
{
"path": "css/root_height_a.html",
@ -7560,6 +7572,18 @@
"url": "/_mozilla/css/quotes_simple_a.html"
}
],
"css/restyle_hints_state.html": [
{
"path": "css/restyle_hints_state.html",
"references": [
[
"/_mozilla/css/restyle_hints_state_ref.html",
"=="
]
],
"url": "/_mozilla/css/restyle_hints_state.html"
}
],
"css/root_height_a.html": [
{
"path": "css/root_height_a.html",

View file

@ -0,0 +1,36 @@
fieldset {
width: 200px;
}
div {
background-color: black;
padding: 10px;
width: 50px;
height: 50px;
}
fieldset div {
background-color: red;
}
fieldset:enabled div {
color: aqua;
background-color: green;
}
fieldset:enabled > div {
background-color: yellow;
}
fieldset:enabled ~ div {
color: pink;
background-color: purple;
}
fieldset:enabled + div {
color: brown;
background-color: orange;
}
input:checked:enabled + span {
color: khaki;
}
input:checked:disabled + span {
color: lawngreen;
}

View file

@ -0,0 +1,44 @@
<!doctype html>
<html>
<meta charset=utf-8>
<title></title>
<link rel=match href=/_mozilla/css/restyle_hints_state_ref.html>
<link rel="stylesheet" href="restyle_hints_state.css">
<body>
<fieldset id="fs1" disabled="1">
<div>
<div>sometext</div>
</div>
</fieldset>
<div>othertext</div>
<div></div>
<fieldset id="fs2">
<input id="cb" type="checkbox"></input>
<span>I should be lawngreen</span>
</fieldset>
<script>
/*
* Servo currently dirties the entire subtree whenever an attribute is
* changed, so we want to avoid changing attributes if we want to properly
* test restyle hints. This means that we can't use reftest-wait, since
* that will cause us to dirty the entire subtree of the <html> element just
* before we generate the rendering we want to check.
*
* Note that the 'disabled' and 'checked' setters forward to attributes, so
* we're not getting as much test coverage there as we'd like. When we
* implement attribute-based restyle hints, we can stop dirtying the subtree
* on attribute modifications, and these tests will start to be more useful.
*/
var $ = document.getElementById.bind(document);
function syncRestyle() { window.dummy != $("fs2").offsetTop; }
syncRestyle();
$('fs1').disabled = true;
syncRestyle();
$('fs1').disabled = false;
syncRestyle();
$('cb').checked = true;
syncRestyle();
$('fs2').disabled = true;
</script>
</body>

View file

@ -0,0 +1,19 @@
<!doctype html>
<meta charset=utf-8>
<title></title>
<link rel="stylesheet" href="restyle_hints_state.css">
</style>
<body>
<fieldset>
<div>
<div>sometext</div>
</div>
</fieldset>
<div>othertext</div>
<div></div>
<fieldset disabled>
<input id="cb" type="checkbox" checked></input>
<span>I should be lawngreen</span>
</fieldset>
</body>