From 0af630f524f21092d0ea3c93e496c548963c244c Mon Sep 17 00:00:00 2001
From: Collin Lefeber <hello@cfebs.com>
Date: Sat, 9 Nov 2024 16:49:42 -0500
Subject: [PATCH] posts/ladybird_attempt

---
 posts/ladybird_attempt.md | 85 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 posts/ladybird_attempt.md

diff --git a/posts/ladybird_attempt.md b/posts/ladybird_attempt.md
new file mode 100644
index 0000000..8fff245
--- /dev/null
+++ b/posts/ladybird_attempt.md
@@ -0,0 +1,85 @@
+Title:  Trying out a Ladybird Browser contribution
+Date:   2024-11-09T14:46:36-04:00
+Draft:  1
+---
+## CSSKeywordValue
+
+WPT tests
+
+    https://wpt.fyi/results/css/css-typed-om/the-stylepropertymap/properties/all.html?product=ladybird&product=chromium&product=firefox%5Bstable%5D
+
+Error:
+
+    ERROR message: Binding gCssWideKeywordsExamples is not initialized
+
+Then open the test in ladybird:
+
+    http://wpt.live/css/css-typed-om/the-stylepropertymap/properties/all.html
+
+Error in logs:
+
+    [408/411] Linking CXX executable bin/Ladybird
+    148800.761 WebContent(457739): Unhandled JavaScript exception: [ReferenceError] 'CSSKeywordValue' is not defined
+    148800.761 WebContent(457739):     at <unknown>
+
+    148800.761 WebContent(457739): Unhandled JavaScript exception: [ReferenceError] Binding gCssWideKeywordsExamples is not initialized
+    148800.761 WebContent(457739):     at runPropertyTests (http://wpt.live/css/css-typed-om/the-stylepropertymap/properties/resources/testsuite.js:420:22)
+        at http://wpt.live/css/css-typed-om/the-stylepropertymap/properties/all.html:4:17
+
+### Fixing it
+
+CSSKeywordValue needs to be avail from window/global context as a native function.
+
+Adding a new IDL file: https://github.com/LadybirdBrowser/ladybird/blob/master/Documentation/AddNewIDLFile.md
+
+Which then looks like it generates things like:
+
+    ./Build/release/Lagom/Userland/Libraries/LibWeb/Bindings/CSSKeywordValuePrototype.h
+    ./Build/release/Lagom/Userland/Libraries/LibWeb/Bindings/CSSKeywordValueConstructor.h
+    ./Build/release/Lagom/Userland/Libraries/LibWeb/Bindings/CSSKeywordValueConstructor.cpp
+
+Next is making it actually work in the JS engine
+
+Pattern matching candidates:
+
+    ❯ rg -l JS_DEFINE_ALLOCATOR | grep -i css | xargs wc -l | sort -n
+    35 Userland/Libraries/LibWeb/CSS/MediaQueryListEvent.cpp
+    39 Userland/Libraries/LibWeb/CSS/AnimationEvent.cpp
+    48 Userland/Libraries/LibWeb/CSS/CSSKeyframeRule.cpp
+    57 Userland/Libraries/LibWeb/CSS/CSSLayerStatementRule.cpp
+    60 Userland/Libraries/LibWeb/CSS/CSSNamespaceRule.cpp
+    61 Userland/Libraries/LibWeb/CSS/CSSKeyframesRule.cpp
+    61 Userland/Libraries/LibWeb/CSS/CSSSupportsRule.cpp
+    70 Userland/Libraries/LibWeb/CSS/ScreenOrientation.cpp
+    76 Userland/Libraries/LibWeb/CSS/CSSPropertyRule.cpp
+    77 Userland/Libraries/LibWeb/CSS/CSSNestedDeclarations.cpp
+    78 Userland/Libraries/LibWeb/CSS/CSSMediaRule.cpp
+    80 Userland/Libraries/LibWeb/CSS/CSSLayerBlockRule.cpp
+    80 Userland/Libraries/LibWeb/CSS/Screen.cpp
+    82 Userland/Libraries/LibWeb/CSS/CSSAnimation.cpp
+   115 Userland/Libraries/LibWeb/CSS/MediaQueryList.cpp
+   120 Userland/Libraries/LibWeb/CSS/MediaList.cpp
+   131 Userland/Libraries/LibWeb/CSS/CSSImportRule.cpp
+   154 Userland/Libraries/LibWeb/CSS/VisualViewport.cpp
+   158 Userland/Libraries/LibWeb/CSS/CSSTransition.cpp
+   175 Userland/Libraries/LibWeb/CSS/StyleSheetList.cpp
+   205 Userland/Libraries/LibWeb/CSS/CSSFontFaceRule.cpp
+   217 Userland/Libraries/LibWeb/CSS/CSSStyleRule.cpp
+   219 Userland/Libraries/LibWeb/CSS/CSSRuleList.cpp
+   295 Userland/Libraries/LibWeb/CSS/FontFaceSet.cpp
+   417 Userland/Libraries/LibWeb/CSS/FontFace.cpp
+   419 Userland/Libraries/LibWeb/CSS/CSSStyleSheet.cpp
+   541 Userland/Libraries/LibWeb/CSS/CSSStyleDeclaration.cpp
+   659 Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp
+  4729 total
+
+Userland/Libraries/LibWeb/CSS/CSSAnimation.idl looks very good
+
+    #import <Animations/Animation.idl>
+
+    // https://www.w3.org/TR/css-animations-2/#cssanimation
+    [Exposed=Window]
+    interface CSSAnimation : Animation {
+        readonly attribute CSSOMString animationName;
+    };
+