blog/posts/ladybird_attempt.md

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;
};

Or Userland/Libraries/LibWeb/DOMURL/DOMURL.idl that has an example of a constructor value.

#import <FileAPI/Blob.idl>
#import <DOMURL/URLSearchParams.idl>

// https://url.spec.whatwg.org/#url
[Exposed=*, LegacyWindowAlias=webkitURL, ImplementedAs=DOMURL]
interface URL {
    constructor(USVString url, optional USVString base);

    [ImplementedAs=parse_for_bindings] static DOMURL? parse(USVString url, optional USVString base);
    static boolean canParse(USVString url, optional USVString base);

    stringifier attribute USVString href;
    readonly attribute USVString origin;
    attribute USVString protocol;
    attribute USVString username;

...