Avoid conflicts between custom properties in CreateKeyframeEffectModel
We process keyframes in reverse order, and skip any already-seen
properties. The problem is that we use a set of CSSProperty pointers
to determine if a property is already seen, which (thanks to the
static Variable instance, crbug.com/980160) collapses all custom
properties into a single item.
Use a HashSet of CSSPropertyNames instead.
Fixed: 1236043
Bug: 980160
Change-Id: Ie6f13c4e4276e91e9d4332c17182363cedcdcde6
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3065534
Reviewed-by: Kevin Ellis <kevers@chromium.org>
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/master@{#908031}
diff --git a/css/css-animations/keyframes-unrelated-custom-property.html b/css/css-animations/keyframes-unrelated-custom-property.html
new file mode 100644
index 0000000..c9ba768
--- /dev/null
+++ b/css/css-animations/keyframes-unrelated-custom-property.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<title>Unrelated custom properties do not conflict with each other</title>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<link rel="help" href="https://crbug.com/1236043">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+ @keyframes test {
+ 0% { --x: green; }
+ 100% { --x: green; }
+
+ /* This should not affect the background-color of #div: */
+ 0% { --unused: yellow; }
+ }
+ #div {
+ animation: test 10s linear paused;
+ background-color: var(--x, red);
+ width: 100px;
+ height: 100px;
+ }
+</style>
+<div id=div></div>
+<script>
+
+test(() => {
+ assert_equals(getComputedStyle(div).backgroundColor, 'rgb(0, 128, 0)');
+}, 'Unrelated custom properties do not conflict with each other');
+
+</script>
