1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 23:27:35 +00:00

LibWeb: Expose barebones CSSStyleDeclaration to JavaScript

You can now access an element's inline style via Element.style.
The interface is not very capable yet though. :^)
This commit is contained in:
Andreas Kling 2021-03-13 22:39:55 +01:00
parent 0759f54bd3
commit 33e3f0c71f
9 changed files with 43 additions and 2 deletions

View file

@ -37,4 +37,11 @@ CSSStyleDeclaration::~CSSStyleDeclaration()
{
}
String CSSStyleDeclaration::item(size_t index) const
{
if (index >= m_properties.size())
return {};
return CSS::string_from_property_id(m_properties[index].property_id);
}
}

View file

@ -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
@ -28,6 +28,7 @@
#include <AK/String.h>
#include <AK/Vector.h>
#include <LibWeb/Bindings/Wrappable.h>
#include <LibWeb/CSS/StyleValue.h>
namespace Web::CSS {
@ -38,8 +39,12 @@ struct StyleProperty {
bool important { false };
};
class CSSStyleDeclaration : public RefCounted<CSSStyleDeclaration> {
class CSSStyleDeclaration
: public RefCounted<CSSStyleDeclaration>
, public Bindings::Wrappable {
public:
using WrapperType = Bindings::CSSStyleDeclarationWrapper;
static NonnullRefPtr<CSSStyleDeclaration> create(Vector<StyleProperty>&& properties)
{
return adopt(*new CSSStyleDeclaration(move(properties)));
@ -49,6 +54,9 @@ public:
const Vector<StyleProperty>& properties() const { return m_properties; }
size_t length() const { return m_properties.size(); }
String item(size_t index) const;
private:
explicit CSSStyleDeclaration(Vector<StyleProperty>&&);
@ -56,3 +64,9 @@ private:
};
}
namespace Web::Bindings {
CSSStyleDeclarationWrapper* wrap(JS::GlobalObject&, CSS::CSSStyleDeclaration&);
}

View file

@ -0,0 +1,6 @@
interface CSSStyleDeclaration {
readonly attribute unsigned long length;
CSSOMString item(unsigned long index);
};