fune/testing/web-platform/tests/css/css-position/backdrop-inherit-computed.html
moz-wptsync-bot e37f04af17 Bug 1855655 [wpt PR 42198] - Make ::backdrop inherit from originating element, a=testonly
Automatic update from web-platform-tests
Make ::backdrop inherit from originating element

When ::backdrop was moved from the fullscreen spec to css-position-4, it
was made tree-abiding, inheriting from its originating element.

A few of the tests needed modification as they expected things like
visibility and pointer-events not inherit from the originating
element into the ::backdrop.

Bug: 827397
Change-Id: Ie4298d7e4b8531a2aaaaeadbe3fc4d08dd8eb712
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4886808
Reviewed-by: Anders Hartvoll Ruud <andruud@chromium.org>
Commit-Queue: Rune Lillesveen <futhark@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1202396}

--

wpt-commits: b3b3a6f70d791da672007e772a5fff3dfdc57e62
wpt-pr: 42198
2023-10-04 11:41:08 +00:00

42 lines
1.2 KiB
HTML

<!DOCTYPE html>
<title>CSS Position Test: ::backdrop inherits from originating element - computed values</title>
<link rel="help" href="https://drafts.csswg.org/css-position-4/#backdrop">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
dialog {
--foo: bar;
--bg: green;
left: 100px;
color-scheme: dark;
}
dialog::backdrop {
background-color: var(--bg);
left: inherit;
}
</style>
<dialog></dialog>
<script>
let dialog = document.querySelector("dialog");
setup(() => {
dialog.showModal();
});
test(() => {
let style = getComputedStyle(dialog, "::backdrop");
assert_equals(style.getPropertyValue("--foo"), "bar");
assert_equals(style.getPropertyValue("--bg"), "green");
}, "Inherit custom property");
test(() => {
assert_equals(getComputedStyle(dialog, "::backdrop").backgroundColor, "rgb(0, 128, 0)");
}, "Apply inherited custom property to background-color");
test(() => {
assert_equals(getComputedStyle(dialog, "::backdrop").colorScheme, "dark");
}, "Implicitly inherited color-scheme");
test(() => {
assert_equals(getComputedStyle(dialog, "::backdrop").left, "100px");
}, "Explicitly inherited left");
</script>