wpt/css/css-layout-api/style-map-multi.https.html at master · web-platform-tests/wpt · GitHub

Name: wpt/css/css-layout-api/style-map-multi.https.html at master · web-platform-tests/wpt · GitHub
Rating: 4.4 (4728 reviews)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
<htmlclass=reftest-wait>
<linkrel="help" href="https://drafts.css-houdini.org/css-layout-api/#layout-invalidation">
<linkrel="match" href="style-map-multi-ref.html">
<metaname="assert" content="This test checks that properties are correctly given to the layout function." />

<style>
.test {
background: red;
margin:10px;
width:100px;

/* Properties under test. */
--foo:bar;
margin-left:2px;
}

@supports (display:layout(test)) {
 .test {
background: green;
display:layout(test);
 }
}
</style>
<scriptsrc="/common/reftest-wait.js"></script>
<scriptsrc="/common/worklet-reftest.js"></script>

<divclass="test"></div>

<scriptid="code" type="text/worklet">
registerLayout('test',class{
staticgetinputProperties(){
return['--bar','--foo','empty-cells','margin-left'];
}

asyncintrinsicSizes(){}
asynclayout(children,edges,constraints,styleMap){
constexpected=[
{property: '--bar',value: '[CSSUnparsedValue=]'},
{property: '--foo',value: '[CSSUnparsedValue=bar]'},
{property: 'empty-cells',value: '[CSSKeywordValue=show]'},
{property: 'margin-left',value: '[CSSUnitValue=2px]'},
];

constactual=Array.from(styleMap.keys()).sort().map((property)=>{
constvalueObject=styleMap.get(property);
constvalue='['+valueObject.constructor.name+'='+valueObject.toString()+']';
return{property, value};
});

if(expected.length!=actual.length)
return{autoBlockSize: 0};

for(leti=0;i<expected.length;i++){
if(expected[i].property!=actual[i].property)
return{autoBlockSize: 0};

if(expected[i].value!=actual[i].value)
return{autoBlockSize: 0};
}

return{autoBlockSize: 100};
}
});
</script>

<script>
importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet,document.getElementById('code').textContent);
</script>
</html>