LibWeb: Invalidate element style after setting Element.style.foo

This makes us recompute style for the element so the change actually
takes effect. :^)

5 files changed, 40 insertions, 5 deletions

diff --git a/Userland/Libraries/LibWeb/Bindings/CSSStyleDeclarationWrapperCustom.cpp b/Userland/Libraries/LibWeb/Bindings/CSSStyleDeclarationWrapperCustom.cpp
index f240181086..46fd905787 100644
--- a/Userland/Libraries/LibWeb/Bindings/CSSStyleDeclarationWrapperCustom.cpp
+++ b/Userland/Libraries/LibWeb/Bindings/CSSStyleDeclarationWrapperCustom.cpp
@@ -24,8 +24,10 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
+#include <AK/ScopeGuard.h>
 #include <LibWeb/Bindings/CSSStyleDeclarationWrapper.h>
 #include <LibWeb/CSS/Parser/DeprecatedCSSParser.h>
+#include <LibWeb/DOM/Element.h>
 
 namespace Web::Bindings {
 
@@ -58,6 +60,12 @@ bool CSSStyleDeclarationWrapper::put(const JS::PropertyName& name, JS::Value val
     if (!new_value)
         return false;
 
+    ScopeGuard style_invalidation_guard = [&] {
+        auto& declaration = downcast<CSS::ElementInlineCSSStyleDeclaration>(impl());
+        if (auto* element = declaration.element())
+            element->invalidate_style();
+    };
+
     // FIXME: I don't think '!important' is being handled correctly here..
 
     for (auto& property : impl().m_properties) {
diff --git a/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.cpp b/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.cpp
index 621e500c22..56a3d8e072 100644
--- a/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.cpp
+++ b/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.cpp
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2018-2021, Andreas Kling <kling@serenityos.org>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
@@ -25,6 +25,7 @@
  */
 
 #include <LibWeb/CSS/CSSStyleDeclaration.h>
+#include <LibWeb/DOM/Element.h>
 
 namespace Web::CSS {
 
@@ -44,4 +45,14 @@ String CSSStyleDeclaration::item(size_t index) const
     return CSS::string_from_property_id(m_properties[index].property_id);
 }
 
+ElementInlineCSSStyleDeclaration::ElementInlineCSSStyleDeclaration(DOM::Element& element)
+    : CSSStyleDeclaration({})
+    , m_element(element.make_weak_ptr<DOM::Element>())
+{
+}
+
+ElementInlineCSSStyleDeclaration::~ElementInlineCSSStyleDeclaration()
+{
+}
+
 }
diff --git a/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.h b/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.h
index d96b94a687..70f226e968 100644
--- a/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.h
+++ b/Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.h
@@ -50,21 +50,36 @@ public:
         return adopt(*new CSSStyleDeclaration(move(properties)));
     }
 
-    ~CSSStyleDeclaration();
+    virtual ~CSSStyleDeclaration();
 
     const Vector<StyleProperty>& properties() const { return m_properties; }
 
     size_t length() const { return m_properties.size(); }
     String item(size_t index) const;
 
+protected:
+    explicit CSSStyleDeclaration(Vector<StyleProperty>&&);
+
 private:
     friend class Bindings::CSSStyleDeclarationWrapper;
 
-    explicit CSSStyleDeclaration(Vector<StyleProperty>&&);
-
     Vector<StyleProperty> m_properties;
 };
 
+class ElementInlineCSSStyleDeclaration final : public CSSStyleDeclaration {
+public:
+    static NonnullRefPtr<ElementInlineCSSStyleDeclaration> create(DOM::Element& element) { return adopt(*new ElementInlineCSSStyleDeclaration(element)); }
+    virtual ~ElementInlineCSSStyleDeclaration() override;
+
+    DOM::Element* element() { return m_element.ptr(); }
+    const DOM::Element* element() const { return m_element.ptr(); }
+
+private:
+    explicit ElementInlineCSSStyleDeclaration(DOM::Element&);
+
+    WeakPtr<DOM::Element> m_element;
+};
+
 }
 
 namespace Web::Bindings {
diff --git a/Userland/Libraries/LibWeb/DOM/Element.cpp b/Userland/Libraries/LibWeb/DOM/Element.cpp
index 04aece7450..0f2304a085 100644
--- a/Userland/Libraries/LibWeb/DOM/Element.cpp
+++ b/Userland/Libraries/LibWeb/DOM/Element.cpp
@@ -383,7 +383,7 @@ void Element::set_shadow_root(RefPtr<ShadowRoot> shadow_root)
 NonnullRefPtr<CSS::CSSStyleDeclaration> Element::style_for_bindings()
 {
     if (!m_inline_style)
-        m_inline_style = CSS::CSSStyleDeclaration::create({});
+        m_inline_style = CSS::ElementInlineCSSStyleDeclaration::create(*this);
     return *m_inline_style;
 }
 
diff --git a/Userland/Libraries/LibWeb/Forward.h b/Userland/Libraries/LibWeb/Forward.h
index 624f4b2209..c4f2c5512a 100644
--- a/Userland/Libraries/LibWeb/Forward.h
+++ b/Userland/Libraries/LibWeb/Forward.h
@@ -33,6 +33,7 @@ class CSSImportRule;
 class CSSStyleDeclaration;
 class CSSStyleRule;
 class CSSStyleSheet;
+class ElementInlineCSSStyleDeclaration;
 class Length;
 class Selector;
 class StyleProperties;