mirror of
https://github.com/HeyPuter/firefox.git
synced 2026-11-13 20:14:57 -10:00
Rune Lillesveen
793eeb3e43
Automatic update from web-platform-tests
FindKeyframesRules should use originating element.
It's only using the TreeScope to find @keyframes in which case using the
originating element for pseudo elements should work. Even better when
the originating element is a shadow host, so that we look up :host rules
from the shadow tree for :host::before { animation-name: anim }.
Bug: 961941
Change-Id: I38edec156eaaa7cfb3680762b135323deae00a68
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2162988
Reviewed-by: Anders Hartvoll Ruud <[email protected]>
Commit-Queue: Rune Lillesveen <[email protected]>
Cr-Commit-Position: refs/heads/master@{#762791}
--
wpt-commits: 245ed57a5e400fff2dc4adbf8e452d64397399cd
wpt-pr: 23222
30 lines
1.0 KiB
HTML
30 lines
1.0 KiB
HTML
<!doctype html>
|
|
<title>CSS Test: @keyframes applies to :host::before/::after.</title>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names">
|
|
<div id="host"></div>
|
|
<script>
|
|
test(function() {
|
|
host.attachShadow({ mode: "open" }).innerHTML = `
|
|
<style>
|
|
@keyframes myanim {
|
|
from { background: red; }
|
|
to { background: green; }
|
|
}
|
|
:host::before, :host::after {
|
|
content: "";
|
|
display: block;
|
|
width: 100px;
|
|
height: 100px;
|
|
background: blue;
|
|
animation: myanim 10s infinite step-end;
|
|
}
|
|
</style>
|
|
`;
|
|
|
|
assert_equals(getComputedStyle(document.getElementById('host'), "::before").backgroundColor, "rgb(255, 0, 0)");
|
|
assert_equals(getComputedStyle(document.getElementById('host'), "::after").backgroundColor, "rgb(255, 0, 0)");
|
|
}, "@keyframes applies to the shadow host");
|
|
</script>
|