From de2b9eebe6012e321c85cdae0ca14b4be40de624 Mon Sep 17 00:00:00 2001
From: Andreas Kling <andreas@ladybird.org>
Date: Thu, 25 Jul 2024 21:04:39 +0200
Subject: [PATCH] LibWeb: Inherit CSS variables across shadow boundaries

This fixes a bunch of issues on https://wpt.fyi/
---
 ...ble-inheritance-across-shadow-boundary.txt |  1 +
 ...le-inheritance-across-shadow-boundary.html | 20 +++++++++++++++++++
 .../Libraries/LibWeb/CSS/Parser/Parser.cpp    |  2 +-
 3 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 Tests/LibWeb/Text/expected/ShadowDOM/css-variable-inheritance-across-shadow-boundary.txt
 create mode 100644 Tests/LibWeb/Text/input/ShadowDOM/css-variable-inheritance-across-shadow-boundary.html

diff --git a/Tests/LibWeb/Text/expected/ShadowDOM/css-variable-inheritance-across-shadow-boundary.txt b/Tests/LibWeb/Text/expected/ShadowDOM/css-variable-inheritance-across-shadow-boundary.txt
new file mode 100644
index 0000000000..36a76231ff
--- /dev/null
+++ b/Tests/LibWeb/Text/expected/ShadowDOM/css-variable-inheritance-across-shadow-boundary.txt
@@ -0,0 +1 @@
+  green    rgb(0, 128, 0)
diff --git a/Tests/LibWeb/Text/input/ShadowDOM/css-variable-inheritance-across-shadow-boundary.html b/Tests/LibWeb/Text/input/ShadowDOM/css-variable-inheritance-across-shadow-boundary.html
new file mode 100644
index 0000000000..236dbb4f6d
--- /dev/null
+++ b/Tests/LibWeb/Text/input/ShadowDOM/css-variable-inheritance-across-shadow-boundary.html
@@ -0,0 +1,20 @@
+<style>
+:root {
+    --foo: green;
+}
+</style>
+<div id="myShadowHost">
+<template shadowrootmode="open">
+<style>
+span { color: var(--foo, red); }
+</style>
+<span>green</span>
+</template>
+</div>
+<script src="../include.js"></script>
+<script>
+    test(() => {
+        let span = myShadowHost.shadowRoot.firstElementChild.nextElementSibling;
+        println(getComputedStyle(span).color);
+    });
+</script>
diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
index 4215e47405..f5cd9af60f 100644
--- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
+++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp
@@ -7651,7 +7651,7 @@ static RefPtr<StyleValue const> get_custom_property(DOM::Element const& element,
             return it->value.value;
     }
 
-    for (auto const* current_element = &element; current_element; current_element = current_element->parent_element()) {
+    for (auto const* current_element = &element; current_element; current_element = current_element->parent_or_shadow_host_element()) {
         if (auto it = current_element->custom_properties({}).find(custom_property_name); it != current_element->custom_properties({}).end())
             return it->value.value;
     }