RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 15:47:44 +00:00
Code Issues Activity Actions

LibWeb: Add initial implementation of IntersectionObserver

Browse source 
The main missing features are rootMargin, proper nested browsing
context support and content clip/clip-path support.

This makes images appear on some sites, such as YouTube and
howstuffworks.com.
This commit is contained in:
Luke Wilde 2023-07-06 23:44:07 +01:00 • committed by Andreas Kling
parent 6f8afd8cd9
commit 165abafb80
16 changed files with 664 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

82
Userland/Libraries/LibWeb/IntersectionObserver/IntersectionObserverEntry.h Normal file
View file

@ -0,0 +1,82 @@
/*
* Copyright (c) 2023, Luke Wilde <lukew@serenityos.org>
*
* SPDX-License-Identifier: BSD-2-Clause
*/
#pragma once
#include <LibWeb/Bindings/PlatformObject.h>
#include <LibWeb/Geometry/DOMRect.h>
#include <LibWeb/HighResolutionTime/DOMHighResTimeStamp.h>
namespace Web::IntersectionObserver {
struct IntersectionObserverEntryInit {
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-time
HighResolutionTime::DOMHighResTimeStamp time { 0.0 };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-rootbounds
Optional<Geometry::DOMRectInit> root_bounds;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-boundingclientrect
Geometry::DOMRectInit bounding_client_rect;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-intersectionrect
Geometry::DOMRectInit intersection_rect;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-isintersecting
bool is_intersecting { false };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-intersectionratio
double intersection_ratio { 0.0 };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-target
JS::Handle<DOM::Element> target;
};
class IntersectionObserverEntry final : public Bindings::PlatformObject {
WEB_PLATFORM_OBJECT(IntersectionObserverEntry, Bindings::PlatformObject);
public:
static WebIDL::ExceptionOr<JS::NonnullGCPtr<IntersectionObserverEntry>> construct_impl(JS::Realm&, IntersectionObserverEntryInit const& options);
virtual ~IntersectionObserverEntry() override;
HighResolutionTime::DOMHighResTimeStamp time() const { return m_time; }
JS::GCPtr<Geometry::DOMRectReadOnly> root_bounds() const { return m_root_bounds; }
JS::NonnullGCPtr<Geometry::DOMRectReadOnly> bounding_client_rect() const { return m_bounding_client_rect; }
JS::NonnullGCPtr<Geometry::DOMRectReadOnly> intersection_rect() const { return m_intersection_rect; }
bool is_intersecting() const { return m_is_intersecting; }
double intersection_ratio() const { return m_intersection_ratio; }
JS::NonnullGCPtr<DOM::Element> target() const { return m_target; }
private:
IntersectionObserverEntry(JS::Realm&, HighResolutionTime::DOMHighResTimeStamp time, JS::GCPtr<Geometry::DOMRectReadOnly> root_bounds, JS::NonnullGCPtr<Geometry::DOMRectReadOnly> bounding_client_rect, JS::NonnullGCPtr<Geometry::DOMRectReadOnly> intersection_rect, bool is_intersecting, double intersection_ratio, JS::NonnullGCPtr<DOM::Element> target);
virtual JS::ThrowCompletionOr<void> initialize(JS::Realm&) override;
virtual void visit_edges(JS::Cell::Visitor&) override;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-time
HighResolutionTime::DOMHighResTimeStamp m_time { 0.0 };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-rootbounds
JS::GCPtr<Geometry::DOMRectReadOnly> m_root_bounds;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-boundingclientrect
JS::NonnullGCPtr<Geometry::DOMRectReadOnly> m_bounding_client_rect;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-intersectionrect
JS::NonnullGCPtr<Geometry::DOMRectReadOnly> m_intersection_rect;
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-isintersecting
bool m_is_intersecting { false };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-intersectionratio
double m_intersection_ratio { 0.0 };
// https://www.w3.org/TR/intersection-observer/#dom-intersectionobserverentry-target
JS::NonnullGCPtr<DOM::Element> m_target;
};
}