forked from mirrors/gecko-dev
0ee3f1a484
Automatic update from web-platform-tests
[css-layout-api] IntrinsicSizes Implementation
This change adds support for the CSS Layout API intrinsicSizes()
callback function. The implementation closely matches that of the
layout() callback function.
- Spec:
https://drafts.css-houdini.org/css-layout-api/#intrinsicsizes
- Algorithm:
https://drafts.css-houdini.org/css-layout-api/#invoke-an-intrinsic-sizes-callback
The implementation also involved exposure of the
IntrinsicSizesResultOptions type.
- Spec:
https://drafts.css-houdini.org/css-layout-api/#dictdef-intrinsicsizesresultoptions
Support was also added for the Child intrinsicSizes() function.
- Spec:
https://drafts.css-houdini.org/css-layout-api/#dom-layoutchild-intrinsicsizes
- Algorithm:
https://drafts.css-houdini.org/css-layout-api/#dom-layoutchild-intrinsicsizes
Bug: 726125
Change-Id: Ifc6064e069b4c9c5218c9d783b7d9de6a480e7ee
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1949536
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/master@{#725834}
--
Rename some colliding references
--
wpt-commits: f160db31bb6fdf94c6c914a779a1b47b9e0e4e30, 5f8d15ebdcf0495c271c81776971061be1366445
wpt-pr: 20682
--HG--
rename : testing/web-platform/tests/css/css-layout-api/auto-block-size/absolute-ref.html => testing/web-platform/tests/css/css-layout-api/auto-block-size/auto-block-size-absolute-ref.html
rename : testing/web-platform/tests/css/css-layout-api/auto-block-size/floats-ref.html => testing/web-platform/tests/css/css-layout-api/auto-block-size/auto-block-size-floats-ref.html
rename : testing/web-platform/tests/css/css-layout-api/auto-block-size/negative-ref.html => testing/web-platform/tests/css/css-layout-api/auto-block-size/auto-block-size-negative-ref.html
rename : testing/web-platform/tests/css/css-layout-api/fallback-layout/fallback-ref.html => testing/web-platform/tests/css/css-layout-api/fallback-layout/fallback-layout-fallback-ref.html
82 lines
2 KiB
HTML
82 lines
2 KiB
HTML
<!DOCTYPE html>
|
|
<html class=reftest-wait>
|
|
<link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#invoke-a-layout-callback">
|
|
<link rel="match" href="fallback-layout-fallback-ref.html">
|
|
<meta name="assert" content="This test checks that a layout() class returning an invalid fragment will fallback to block layout." />
|
|
<style>
|
|
.test {
|
|
background: red;
|
|
border: solid 2px;
|
|
width: 100px;
|
|
}
|
|
|
|
.test > div {
|
|
height: 100px;
|
|
}
|
|
|
|
@supports (display: layout(bad-request)) {
|
|
.test {
|
|
display: layout(bad-request);
|
|
background: green;
|
|
}
|
|
}
|
|
</style>
|
|
<script src="/common/reftest-wait.js"></script>
|
|
<script src="/common/worklet-reftest.js"></script>
|
|
|
|
<div class="test">
|
|
<div></div>
|
|
</div>
|
|
|
|
<script id="code" type="text/worklet">
|
|
registerLayout('bad-request', class {
|
|
static get inputProperties() { return ['--fail']; }
|
|
|
|
async intrinsicSizes() {}
|
|
async layout(children, _, __, styleMap) {
|
|
if (styleMap.get('--fail').toString() !== 'true') {
|
|
this.fragment = await children[0].layoutNextFragment({});
|
|
}
|
|
|
|
// Return, if the fragment is invalid (we skipped the if statement above)
|
|
// we should fallback to block layout.
|
|
return {autoBlockSize: 0, childFragments: [this.fragment]};
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<script>
|
|
function raf() {
|
|
return new Promise((resolve) => {
|
|
requestAnimationFrame(() => {
|
|
resolve();
|
|
});
|
|
});
|
|
}
|
|
|
|
(async function() {
|
|
if (typeof CSS.layoutWorklet === 'undefined') {
|
|
takeScreenshot();
|
|
return;
|
|
}
|
|
|
|
await importWorklet(CSS.layoutWorklet, document.getElementById('code').textContent);
|
|
|
|
// Ensure that all instances have a child to perform an invalid layout upon.
|
|
const test = document.getElementsByClassName('test')[0];
|
|
for (let i = 0; i < 100; i++) {
|
|
test.innerHTML = '<div><div>';
|
|
await raf();
|
|
}
|
|
|
|
// The next layout should mean that we will fallback to block.
|
|
test.innerHTML = '<div></div>';
|
|
test.style.setProperty('--fail', 'true');
|
|
|
|
// Finish up the test.
|
|
await raf();
|
|
await raf();
|
|
takeScreenshot();
|
|
})();
|
|
</script>
|
|
</html>
|