forked from mirrors/gecko-dev
bf325dc1d8
Automatic update from web-platform-tests Update shadow dom property registration test to check that they should work (#44922) * update to check that shadow dom registrations DO work * update comment -- wpt-commits: 24cccdefab1cefd63f2b805cff7620f5ae5ec4db wpt-pr: 44922
46 lines
1.3 KiB
HTML
46 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<link rel="help" href="https://drafts.css-houdini.org/css-properties-values-api-1/#shadow-dom">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="./resources/utils.js"></script>
|
|
<style>
|
|
@property --x {
|
|
syntax: "<length>";
|
|
inherits: false;
|
|
initial-value: 0px;
|
|
}
|
|
#outside {
|
|
--x: calc(1px + 1px);
|
|
--y: calc(1px + 1px);
|
|
}
|
|
</style>
|
|
<template id=template>
|
|
<style>
|
|
/* This rule should be globally registered */
|
|
@property --y {
|
|
syntax: "<length>";
|
|
inherits: false;
|
|
initial-value: 0px;
|
|
}
|
|
#inside {
|
|
--x: calc(1px + 1px);
|
|
--y: calc(1px + 1px);
|
|
}
|
|
</style>
|
|
<div id=inside></div>
|
|
</template>
|
|
<div id=host></div>
|
|
<div id=outside></div>
|
|
<script>
|
|
|
|
test(() => {
|
|
let root = host.attachShadow({ mode: 'open' });
|
|
root.append(template.content.cloneNode(true));
|
|
let inside = root.querySelector('#inside');
|
|
assert_equals(getComputedStyle(outside).getPropertyValue('--x'), '2px');
|
|
assert_equals(getComputedStyle(outside).getPropertyValue('--y'), '2px');
|
|
assert_equals(getComputedStyle(inside).getPropertyValue('--x'), '2px');
|
|
assert_equals(getComputedStyle(inside).getPropertyValue('--y'), '2px');
|
|
}, '@property rules in shadow trees should be globally registered');
|
|
|
|
</script>
|