mirror of
https://github.com/servo/servo.git
synced 2025-08-03 20:50:07 +01:00
Update web-platform-tests to revision e3698c7bb3c309df69134e9bc0a375f00535e226
This commit is contained in:
WPT Sync Bot
parent
1b38197812
commit
e447ba9856
102 changed files with 1364 additions and 221 deletions
|
|
@ -23,13 +23,16 @@
|
|||
}
|
||||
|
||||
.gridOnlyAutoRepeat { grid-template-columns: repeat(auto-fill, 30px [autobar]); }
|
||||
.gridMinMaxAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(13px, 30px)); }
|
||||
.gridMaxMinAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(30px, 13px)); }
|
||||
.gridMaxMinPercentAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(30px, 6.5%)); }
|
||||
.gridAutoRepeatAndFixedBefore { grid-template-columns: 10px [foo] 20% [bar] repeat(auto-fill, [autofoo] 35px); }
|
||||
.gridAutoRepeatAndFixedAfter { grid-template-columns: repeat(auto-fill, [first] 30px [last]) [foo] minmax(60px, 80px) [bar] minmax(45px, max-content); }
|
||||
.gridAutoRepeatAndFixed { grid-template-columns: [start] repeat(2, 50px [a]) [middle] repeat(auto-fill, [autofoo] 15px [autobar]) minmax(5%, 10%) [end]; }
|
||||
.gridMultipleNames { grid-template-columns: [start] 20px [foo] 50% repeat(auto-fill, [bar] 20px [start foo]) [foo] 10% [end bar]; }
|
||||
.gridMultipleTracks { grid-template-columns: [start] 20px repeat(auto-fill, [a] 2em [b c] 10% [d]) [e] minmax(75px, 1fr) [last]; }
|
||||
|
||||
.item { background-color: cyan; }
|
||||
.item { background: cyan; }
|
||||
|
||||
.gap { grid-column-gap: 20px; }
|
||||
|
||||
|
|
@ -45,7 +48,19 @@
|
|||
<p>This test checks that repeat(auto-fill, ) syntax works as expected.</p>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / span 6" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMinMaxAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinPercentAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
|
|
|
|||
|
|
@ -28,18 +28,20 @@
|
|||
}
|
||||
|
||||
.gridOnlyAutoRepeat { grid-template-rows: repeat(auto-fill, 30px [autobar]); }
|
||||
.gridMinMaxAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(13px, 30px)); }
|
||||
.gridMaxMinAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(30px, 13px)); }
|
||||
.gridMaxMinPercentAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(30px, 6.5%)); }
|
||||
.gridAutoRepeatAndFixedBefore { grid-template-rows: 10px [foo] 20% [bar] repeat(auto-fill, [autofoo] 35px); }
|
||||
.gridAutoRepeatAndFixedAfter { grid-template-rows: repeat(auto-fill, [first] 30px [last]) [foo] minmax(60px, 80px) [bar] minmax(45px, max-content); }
|
||||
.gridAutoRepeatAndFixed { grid-template-rows: [start] repeat(2, 50px [a]) [middle] repeat(auto-fill, [autofoo] 15px [autobar]) minmax(5%, 10%) [end]; }
|
||||
.gridMultipleNames { grid-template-rows: [start] 20px [foo] 50% repeat(auto-fill, [bar] 20px [start foo]) [foo] 10% [end bar]; }
|
||||
.gridMultipleTracks { grid-template-rows: [start] 20px repeat(auto-fill, [a] 2em [b c] 10% [d]) [e] minmax(75px, 1fr) [last]; }
|
||||
|
||||
.item { background-color: blue; }
|
||||
.item { background: blue; }
|
||||
.item:nth-child(2) { background: green; }
|
||||
.item:nth-child(3) { background: orange; }
|
||||
|
||||
.gap { grid-row-gap: 20px; }
|
||||
|
||||
</style>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
|
|
@ -52,7 +54,19 @@
|
|||
<p>This test checks that repeat(auto-fill, ) syntax works as expected.</p>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / span 6" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMinMaxAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinPercentAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Grid: auto-fit columns</title>
|
||||
<base href="https://wpt.live/css/css-grid/grid-definition/grid-auto-fill-rows-001.html">
|
||||
|
||||
<link rel="author" title="Sergio Villar" href="mailto: svillar@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#valdef-repeat-auto-fit">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#propdef-grid-auto-columns">
|
||||
|
|
@ -24,6 +26,9 @@
|
|||
}
|
||||
|
||||
.gridOnlyAutoRepeat { grid-template-columns: repeat(auto-fit, 30px [autobar]); }
|
||||
.gridMinMaxAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(13px, 30px)); }
|
||||
.gridMaxMinAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(30px, 13px)); }
|
||||
.gridMaxMinPercentAutoRepeat { grid-template-columns: repeat(auto-fill, minmax(30px, 6.5%)); }
|
||||
.gridAutoRepeatAndFixedBefore { grid-template-columns: 10px [foo] 20% [bar] repeat(auto-fit, [autofoo] 35px); }
|
||||
.gridAutoRepeatAndFixedAfter { grid-template-columns: repeat(auto-fit, [first] 30px [last]) [foo] minmax(60px, 80px) [bar] minmax(45px, max-content); }
|
||||
.gridAutoRepeatAndFixed { grid-template-columns: [start] repeat(2, 50px [a]) [middle] repeat(auto-fit, [autofoo] 15px [autobar]) minmax(5%, 10%) [end]; }
|
||||
|
|
@ -31,8 +36,8 @@
|
|||
.gridMultipleTracks { grid-template-columns: [start] 20px repeat(auto-fit, [a] 2em [b c] 10% [d]) [e] minmax(75px, 1fr) [last]; }
|
||||
.gridMinMaxFixedFlex { grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)); }
|
||||
|
||||
.item { background-color: cyan; }
|
||||
.item:nth-child(2n) { background-color: green; }
|
||||
.item { background: cyan; }
|
||||
.item:nth-child(2n) { background: green; }
|
||||
|
||||
.gap { grid-column-gap: 20px; }
|
||||
|
||||
|
|
@ -48,7 +53,19 @@
|
|||
<p>This test checks that repeat(auto-fit, ) syntax works as expected.</p>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / span 6" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMinMaxAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinPercentAutoRepeat">
|
||||
<div class="item" style="grid-column: 1 / -1" data-offset-x="0" data-offset-y="0" data-expected-width="180" data-expected-height="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Grid: auto-fit rows</title>
|
||||
<link rel="author" title="Sergio Villar" href="mailto: svillar@igalia.com">
|
||||
h<link rel="author" title="Sergio Villar" href="mailto: svillar@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#valdef-repeat-auto-fit">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#propdef-grid-auto-columns">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#propdef-grid-auto-rows">
|
||||
|
|
@ -27,14 +27,17 @@
|
|||
}
|
||||
|
||||
.gridOnlyAutoRepeat { grid-template-rows: repeat(auto-fit, 30px [autobar]); }
|
||||
.gridMinMaxAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(13px, 30px)); }
|
||||
.gridMaxMinAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(30px, 13px)); }
|
||||
.gridMaxMinPercentAutoRepeat { grid-template-rows: repeat(auto-fill, minmax(30px, 6.5%)); }
|
||||
.gridAutoRepeatAndFixedBefore { grid-template-rows: 10px [foo] 20% [bar] repeat(auto-fit, [autofoo] 35px); }
|
||||
.gridAutoRepeatAndFixedAfter { grid-template-rows: repeat(auto-fit, [first] 30px [last]) [foo] minmax(60px, 80px) [bar] minmax(45px, max-content); }
|
||||
.gridAutoRepeatAndFixed { grid-template-rows: [start] repeat(2, 50px [a]) [middle] repeat(auto-fit, [autofoo] 15px [autobar]) minmax(5%, 10%) [end]; }
|
||||
.gridMultipleNames { grid-template-rows: [start] 20px [foo] 50% repeat(auto-fit, [bar] 20px [start foo]) [foo] 10% [end bar]; }
|
||||
.gridMultipleTracks { grid-template-rows: [start] 20px repeat(auto-fit, [a] 2em [b c] 10% [d]) [e] minmax(75px, 1fr) [last]; }
|
||||
|
||||
.item { background-color: cyan; }
|
||||
.item:nth-child(2n) { background-color: green; }
|
||||
.item { background: cyan; }
|
||||
.item:nth-child(2n) { background: green; }
|
||||
|
||||
.gap { grid-row-gap: 20px; }
|
||||
|
||||
|
|
@ -53,6 +56,18 @@
|
|||
<div class="item" style="grid-row: 1 / span 6" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMinMaxAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridMaxMinPercentAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / -1" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid gridOnlyAutoRepeat">
|
||||
<div class="item" style="grid-row: 1 / span 6 autobar" data-offset-y="0" data-offset-x="0" data-expected-height="180" data-expected-width="25"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -25,29 +25,29 @@
|
|||
TestingUtils.testGridTemplateAreas('grid', '"lower UPPER 10 -minus _low 1-st ©copy_right line¶"', '"lower UPPER 10 -minus _low 1-st ©copy_right line¶"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b"', '"a b"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b" "c d"', '"a b" "c d"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b" "c d"', ['"a b" "c d"', '"a b" "c d"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b" "c d"', '"a b" "c d"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b""c d"', '"a b" "c d"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b"\t"c d"', '"a b" "c d"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b"\n"c d"', '"a b" "c d"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a b" "a b"', '"a b" "a b"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a a" "b b"', '"a a" "b b"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '". a ." "b a c"', '". a ." "b a c"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '".. a ..." "b a c"', ['". a ." "b a c"', '".. a ..." "b a c"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '".a..." "b a c"', ['". a ." "b a c"', '".a..." "b a c"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '".. a ..." "b a c"', '". a ." "b a c"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '".a..." "b a c"', '". a ." "b a c"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"head head" "nav main" "foot ."', '"head head" "nav main" "foot ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"head head" "nav main" "foot ...."', ['"head head" "nav main" "foot ."', '"head head" "nav main" "foot ...."']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"head head" "nav main" "foot."', ['"head head" "nav main" "foot ."', '"head head" "nav main" "foot."']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"head head" "nav main" "foot ...."', '"head head" "nav main" "foot ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"head head" "nav main" "foot."', '"head head" "nav main" "foot ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '". header header ." "nav main main main" "nav footer footer ."', '". header header ." "nav main main main" "nav footer footer ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"... header header ...." "nav main main main" "nav footer footer ...."', ['". header header ." "nav main main main" "nav footer footer ."', '"... header header ...." "nav main main main" "nav footer footer ...."']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"...header header...." "nav main main main" "nav footer footer...."', ['". header header ." "nav main main main" "nav footer footer ."', '"...header header...." "nav main main main" "nav footer footer...."']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"... header header ...." "nav main main main" "nav footer footer ...."', '". header header ." "nav main main main" "nav footer footer ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"...header header...." "nav main main main" "nav footer footer...."', '". header header ." "nav main main main" "nav footer footer ."');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"title stats" "score stats" "board board" "ctrls ctrls"', '"title stats" "score stats" "board board" "ctrls ctrls"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"title board" "stats board" "score ctrls"', '"title board" "stats board" "score ctrls"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '". a" "b a" ". a"', '". a" "b a" ". a"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '".. a" "b a" "... a"', ['". a" "b a" ". a"', '".. a" "b a" "... a"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"..a" "b a" ".a"', ['". a" "b a" ". a"', '"..a" "b a" ".a"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '".. a" "b a" "... a"', '". a" "b a" ". a"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"..a" "b a" ".a"', '". a" "b a" ". a"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"a a a" "b b b"', '"a a a" "b b b"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '". ." "a a"', '". ." "a a"');
|
||||
TestingUtils.testGridTemplateAreas('grid', '"... ...." "a a"', ['". ." "a a"', '"... ...." "a a"']);
|
||||
TestingUtils.testGridTemplateAreas('grid', '"... ...." "a a"', '". ." "a a"');
|
||||
|
||||
// Reset values.
|
||||
document.getElementById('grid').style.gridTemplateAreas = '';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue