System colors do not always respect inherited color-scheme values

https://bugs.webkit.org/show_bug.cgi?id=240925 rdar://94247591 Reviewed by Antti Koivisto. The MatchedDeclarationsCache speeds up style computation by reusing by copying non-inherited properties from an earlier style object built using the same exact style declarations. Since 'color-scheme' is an inherited property, it is possible for two elements to have the same 'background-color' declaration, with different color schemes. However, the computed value of a system color is dependent on the computed style's 'color-scheme' value. Consequently, the cache entry can only be used if the styles have equivalent color schemes. * LayoutTests/css-dark-mode/color-scheme-inherited-expected.html: Added. * LayoutTests/css-dark-mode/color-scheme-inherited.html: Added. * Source/WebCore/style/MatchedDeclarationsCache.cpp: (WebCore::Style::MatchedDeclarationsCache::Entry::isUsableAfterHighPriorityProperties const): Canonical link: https://commits.webkit.org/253041@main
WebKit · Aug 2, 2022 · ae8a390 · ae8a390
1 parent e9c47d5
commit ae8a390
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 0 deletions.
diff --git a/LayoutTests/css-dark-mode/color-scheme-inherited-expected.html b/LayoutTests/css-dark-mode/color-scheme-inherited-expected.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+
+.box {
+    color: CanvasText;
+    background-color: Canvas;
+}
+
+</style>
+</head>
+<body>
+
+<div class="box" style="color-scheme: dark">Dark</div>
+<div class="box" style="color-scheme: light">Light</div>
+
+</body>
+</html>
diff --git a/LayoutTests/css-dark-mode/color-scheme-inherited.html b/LayoutTests/css-dark-mode/color-scheme-inherited.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+
+.box {
+    color: CanvasText;
+    background-color: Canvas;
+}
+
+</style>
+</head>
+<body>
+
+<div style="color-scheme: dark">
+<div class="box">Dark</div>
+</div>
+
+<div style="color-scheme: light">
+<div class="box">Light</div>
+</div>
+
+</body>
+</html>
diff --git a/Source/WebCore/style/MatchedDeclarationsCache.cpp b/Source/WebCore/style/MatchedDeclarationsCache.cpp
@@ -80,6 +80,11 @@ bool MatchedDeclarationsCache::Entry::isUsableAfterHighPriorityProperties(const
     if (style.effectiveZoom() != renderStyle->effectiveZoom())
         return false;
 
+#if ENABLE(DARK_MODE_CSS)
+    if (style.colorScheme() != renderStyle->colorScheme())
+        return false;
+#endif
+
     return CSSPrimitiveValue::equalForLengthResolution(style, *renderStyle);
 }