LibWeb: Add presentational hints to the canvas element

There is only one, width/height -> aspect-ratio. This brings us
very slightly closer to spec and triggers a re-layout after
updating these values from JavaScript, which wasn't the case
before.
This commit is contained in:
circl 2023-08-31 19:22:17 +02:00 committed by Sam Atkins
parent 22220cf116
commit 3056ff6b11
Notes: sideshowbarker 2024-07-17 18:08:55 +09:00
2 changed files with 27 additions and 0 deletions

View file

@ -12,6 +12,9 @@
#include <LibGfx/ImageFormats/PNGWriter.h>
#include <LibWeb/Bindings/ExceptionOrUtils.h>
#include <LibWeb/CSS/StyleComputer.h>
#include <LibWeb/CSS/StyleValues/IdentifierStyleValue.h>
#include <LibWeb/CSS/StyleValues/RatioStyleValue.h>
#include <LibWeb/CSS/StyleValues/StyleValueList.h>
#include <LibWeb/DOM/Document.h>
#include <LibWeb/HTML/CanvasRenderingContext2D.h>
#include <LibWeb/HTML/HTMLCanvasElement.h>
@ -52,6 +55,28 @@ void HTMLCanvasElement::visit_edges(Cell::Visitor& visitor)
});
}
void HTMLCanvasElement::apply_presentational_hints(CSS::StyleProperties& style) const
{
// https://html.spec.whatwg.org/multipage/rendering.html#attributes-for-embedded-content-and-images
// The width and height attributes map to the aspect-ratio property on canvas elements.
// FIXME: Multiple elements have aspect-ratio presentational hints, make this into a helper function
// https://html.spec.whatwg.org/multipage/rendering.html#map-to-the-aspect-ratio-property
// if element has both attributes w and h, and parsing those attributes' values using the rules for parsing non-negative integers doesn't generate an error for either
auto w = parse_non_negative_integer(attribute(HTML::AttributeNames::width));
auto h = parse_non_negative_integer(attribute(HTML::AttributeNames::height));
if (w.has_value() && h.has_value())
// then the user agent is expected to use the parsed integers as a presentational hint for the 'aspect-ratio' property of the form auto w / h.
style.set_property(CSS::PropertyID::AspectRatio,
CSS::StyleValueList::create(CSS::StyleValueVector {
CSS::IdentifierStyleValue::create(CSS::ValueID::Auto),
CSS::RatioStyleValue::create(CSS::Ratio { static_cast<double>(w.value()), static_cast<double>(h.value()) }) },
CSS::StyleValueList::Separator::Space));
}
unsigned HTMLCanvasElement::width() const
{
// https://html.spec.whatwg.org/multipage/canvas.html#obtain-numeric-values

View file

@ -44,6 +44,8 @@ private:
virtual void initialize(JS::Realm&) override;
virtual void visit_edges(Cell::Visitor&) override;
virtual void apply_presentational_hints(CSS::StyleProperties&) const override;
virtual JS::GCPtr<Layout::Node> create_layout_node(NonnullRefPtr<CSS::StyleProperties>) override;
enum class HasOrCreatedContext {