apace_dom/node/

node.rs

use crate::Document;
use crate::layout::paint_tree::{HoistedPaintChild, StackingContext};
use apace_traits::events::{
    ApacePointerEvent, ApacePointerId, DomEventData, HitResult, PointerCoords,
};
use apace_traits::node_id::NodeId;
use apace_traits::shell::ShellProvider;
use bitflags::bitflags;
use euclid::{Point2D, Rect, Size2D};
use keyboard_types::Modifiers;
use kurbo::{Affine, Rect as KurboRect};
use markup5ever::{LocalName, local_name};
use parley::{BreakReason, Cluster, ClusterSide};
use selectors::matching::ElementSelectorFlags;
use std::cell::{Cell, RefCell};
use std::fmt::Write;
use std::ops::Deref;
use std::sync::Arc;
use std::sync::atomic::{AtomicBool, Ordering};
#[cfg(feature = "writing-mode")]
use style::computed_values::flex_direction::T as FlexDirection;
use style::computed_values::isolation::T as Isolation;
use style::computed_values::white_space_collapse::T as WhiteSpaceCollapse;
use style::invalidation::element::restyle_hints::RestyleHint;
use style::properties::ComputedValues;
use style::properties::generated::longhands::position::computed_value::T as Position;
use style::selector_parser::RestyleDamage;
use style::servo_arc::Arc as ServoArc;
use style::shared_lock::SharedRwLock;
use style::stylesheets::UrlExtraData;
use style::values::computed::CSSPixelLength;
use style::values::computed::Display as StyloDisplay;
use style::values::computed::Rotate;
use style::values::generics::transform::{Scale, Translate};
use style::values::specified::box_::{DisplayInside, DisplayOutside};
use style_dom::ElementState;
use style_traits::values::ToCss;
use takia::{Cache, prelude::Layout};
use thin_vec::ThinVec;

use super::stylo_data::{ComputedStyleRef, StyloData};
use super::{Attribute, DocumentData, ElementData, LayoutData};

#[derive(Clone, Copy, Debug, PartialEq, Eq)]
pub enum DisplayOuter {
    Block,
    Inline,
    None,
}

bitflags! {
    #[derive(Clone, Copy, PartialEq)]
    pub struct NodeFlags: u32 {
        /// Whether the node is the root node of an Inline Formatting Context
        const IS_INLINE_ROOT = 0b00000001;
        /// Whether the node is the root node of an Table formatting context
        const IS_TABLE_ROOT = 0b00000010;
        /// Whether the node is "in the document" (~= has a parent and isn't a template node)
        const IS_IN_DOCUMENT = 0b00000100;
        /// A document-owned viewport layout/paint root. DOM and style ancestry stay intact.
        const IS_TOP_LAYER = 0b00001000;
        const CONTAIN_TOP_LAYER_SCROLL = 0b00010000;
    }
}

impl NodeFlags {
    pub fn is_top_layer(&self) -> bool {
        self.contains(Self::IS_TOP_LAYER)
    }
    #[inline(always)]
    pub fn is_inline_root(&self) -> bool {
        self.contains(Self::IS_INLINE_ROOT)
    }

    #[inline(always)]
    pub fn is_table_root(&self) -> bool {
        self.contains(Self::IS_TABLE_ROOT)
    }

    #[inline(always)]
    pub fn is_in_document(&self) -> bool {
        self.contains(Self::IS_IN_DOCUMENT)
    }

    #[inline(always)]
    pub fn reset_construction_flags(&mut self) {
        self.remove(Self::IS_INLINE_ROOT);
        self.remove(Self::IS_TABLE_ROOT);
    }
}

pub struct Node {
    // The actual tree we belong to. This is unsafe!!
    tree: *mut crate::NodeTree,

    /// Our Id
    pub id: NodeId,
    /// Our parent's ID
    pub parent: Option<NodeId>,
    // What are our children?
    pub children: ThinVec<NodeId>,
    /// Our parent in the layout hierachy: a separate list that includes anonymous collections of inline elements
    pub layout_parent: Cell<Option<NodeId>>,
    /// A separate child list that includes anonymous collections of inline elements
    pub layout_children: RefCell<Option<ThinVec<NodeId>>>,
    /// Out-of-flow (absolutely/fixed positioned) boxes for which this node is the
    /// containing block. Recorded by Takia's out-of-flow positioning pass. The
    /// `Layout.location` of these boxes is relative to this node's border box.
    pub hoisted_children: RefCell<ThinVec<NodeId>>,
    /// For an out-of-flow box that was hoisted by Takia's out-of-flow positioning
    /// pass, the node whose `hoisted_children` list contains it (its containing
    /// block). The box's `Layout.location` is relative to this node rather than
    /// to its `layout_parent`. `None` for in-flow boxes.
    pub oof_containing_block: Cell<Option<NodeId>>,
    /// Anonymous block boxes created for this node during layout construction.
    ///
    /// Anonymous blocks live only in the slab (they are not part of the DOM
    /// `children` list), so we track the ones we own here to be able to
    /// deallocate them when this node is reconstructed.
    pub anonymous_blocks: ThinVec<NodeId>,
    /// The same as layout_children, but sorted by z-index
    pub paint_children: RefCell<Option<ThinVec<NodeId>>>,
    pub stacking_context: Option<Box<StackingContext>>,
    /// The hoisted entries this node's subtree pushed into the enclosing
    /// stacking context on its last (non-skipped) paint-tree build. Replayed
    /// when the subtree is skipped as clean. Empty for stacking-context roots.
    pub sc_contribution_cache: RefCell<ThinVec<HoistedPaintChild>>,

    // Flags
    pub flags: NodeFlags,

    /// Node type (Element, TextNode, etc) specific data.
    ///
    /// For element nodes this holds the [`ElementData`], which stores most of
    /// the per-node style/layout state. For the document node it holds the
    /// [`DocumentData`]. Access the moved fields through the forwarding methods
    /// on [`Node`] (e.g. [`Node::style`], [`Node::final_layout`]).
    pub data: NodeData,
}

unsafe impl Send for Node {}
unsafe impl Sync for Node {}

/// Generates forwarding accessors for fields that live on both [`ElementData`]
/// (element / anonymous block nodes) and [`DocumentData`] (the document node).
macro_rules! universal_accessors {
    ($($(#[$meta:meta])* $field:ident / $field_mut:ident : $ty:ty),* $(,)?) => {
        impl Node {
            $(
                $(#[$meta])*
                #[inline]
                pub fn $field(&self) -> &$ty {
                    match &self.data {
                        NodeData::Element(data) | NodeData::AnonymousBlock(data) => &data.$field,
                        NodeData::Document(data) => &data.$field,
                        _ => panic!(concat!("`", stringify!($field), "` is not available on this node kind")),
                    }
                }

                $(#[$meta])*
                #[inline]
                pub fn $field_mut(&mut self) -> &mut $ty {
                    match &mut self.data {
                        NodeData::Element(data) | NodeData::AnonymousBlock(data) => &mut data.$field,
                        NodeData::Document(data) => &mut data.$field,
                        _ => panic!(concat!("`", stringify!($field), "` is not available on this node kind")),
                    }
                }
            )*
        }
    };
}

universal_accessors! {
    stylo_element_data / stylo_element_data_mut: StyloData,
    transform / transform_mut: Option<Box<Affine>>,
    display_constructed_as / display_constructed_as_mut: StyloDisplay,
    // The document node is styled/snapshotted like an element, so it also
    // carries these:
    element_state / element_state_mut: ElementState,
    snapshot_handled / snapshot_handled_mut: AtomicBool,
    // `apply_selector_flags` deposits `for_parent()` flags on the parent node,
    // and the parent of the root <html> element is the document -- so the
    // document has to be able to hold selector flags too.
    selector_flags / selector_flags_mut: Cell<ElementSelectorFlags>,
}

impl Node {
    /// This node's layout output state, or a shared default if layout has
    /// never written to this node.
    ///
    /// Panics for node kinds which do not participate in layout (text and
    /// comment nodes).
    #[inline]
    pub fn layout_data(&self) -> &LayoutData {
        match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => data.layout_data(),
            NodeData::Document(data) => data.layout_data(),
            _ => panic!("`layout_data` is not available on this node kind"),
        }
    }

    /// Mutable access to this node's layout output state, allocating it if it
    /// does not yet exist.
    ///
    /// Panics for node kinds which do not participate in layout (text and
    /// comment nodes).
    #[inline]
    pub fn layout_data_mut(&mut self) -> &mut LayoutData {
        match &mut self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => data.layout_data_mut(),
            NodeData::Document(data) => data.layout_data_mut(),
            _ => panic!("`layout_data` is not available on this node kind"),
        }
    }

    /// Mutable access to this node's layout output state, if it has been
    /// allocated. Never allocates. Returns `None` for node kinds which do not
    /// participate in layout.
    #[inline]
    pub fn try_layout_data_mut(&mut self) -> Option<&mut LayoutData> {
        match &mut self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                data.layout_data.as_deref_mut()
            }
            NodeData::Document(data) => data.layout_data.as_deref_mut(),
            _ => None,
        }
    }

    /// Clear this node's takia layout cache without allocating `LayoutData`
    /// for nodes that have never been laid out.
    #[inline]
    pub fn clear_layout_cache(&mut self) {
        if let Some(layout_data) = self.try_layout_data_mut() {
            layout_data.cache.clear();
        }
    }

    /// Clear this node's takia layout cache and any cached inline
    /// `content_widths`, forcing a full relayout of it on the next pass.
    pub fn invalidate_layout_cache(&mut self) {
        self.clear_layout_cache();
        if let Some(inline_layout) = self
            .data
            .downcast_element_mut()
            .and_then(|el| el.inline_layout_data.as_mut())
        {
            inline_layout.content_widths = None;
        }
    }

    #[inline]
    pub fn cache(&self) -> &Cache {
        &self.layout_data().cache
    }

    #[inline]
    pub fn cache_mut(&mut self) -> &mut Cache {
        &mut self.layout_data_mut().cache
    }

    #[inline]
    pub fn unrounded_layout(&self) -> &Layout {
        &self.layout_data().unrounded_layout
    }

    #[inline]
    pub fn unrounded_layout_mut(&mut self) -> &mut Layout {
        &mut self.layout_data_mut().unrounded_layout
    }

    #[inline]
    pub fn final_layout(&self) -> &Layout {
        &self.layout_data().final_layout
    }

    #[inline]
    pub fn final_layout_mut(&mut self) -> &mut Layout {
        &mut self.layout_data_mut().final_layout
    }

    #[inline]
    pub fn scroll_offset(&self) -> &crate::Point<f64> {
        &self.layout_data().scroll_offset
    }

    #[inline]
    pub fn scroll_offset_mut(&mut self) -> &mut crate::Point<f64> {
        &mut self.layout_data_mut().scroll_offset
    }

    #[inline]
    pub fn scrollable_overflow(&self) -> &KurboRect {
        &self.layout_data().scrollable_overflow
    }

    #[inline]
    pub fn scrollable_overflow_mut(&mut self) -> &mut KurboRect {
        &mut self.layout_data_mut().scrollable_overflow
    }

    /// Style data from stylo, if this node kind carries it (element or document
    /// nodes). Returns `None` for text/comment nodes.
    #[inline]
    pub fn try_stylo_element_data(&self) -> Option<&StyloData> {
        match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                Some(&data.stylo_element_data)
            }
            NodeData::Document(data) => Some(&data.stylo_element_data),
            _ => None,
        }
    }

    #[inline]
    pub fn try_stylo_element_data_mut(&mut self) -> Option<&mut StyloData> {
        match &mut self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                Some(&mut data.stylo_element_data)
            }
            NodeData::Document(data) => Some(&mut data.stylo_element_data),
            _ => None,
        }
    }

    /// The `dirty_descendants` flag, if this node kind carries it (element or
    /// document nodes). Returns `None` for text/comment nodes.
    #[inline]
    fn dirty_descendants_flag(&self) -> Option<&AtomicBool> {
        match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                Some(&data.dirty_descendants)
            }
            NodeData::Document(data) => Some(&data.dirty_descendants),
            _ => None,
        }
    }

    /// The `damaged_descendants` flag, if this node kind carries it (element or
    /// document nodes). Returns `None` for text/comment nodes.
    #[inline]
    fn damaged_descendants_flag(&self) -> Option<&AtomicBool> {
        match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                Some(&data.damaged_descendants)
            }
            NodeData::Document(data) => Some(&data.damaged_descendants),
            _ => None,
        }
    }

    /// The document's shared style lock. Only available on element and
    /// document nodes.
    #[inline]
    pub fn guard(&self) -> &SharedRwLock {
        let guard = match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => data.guard.as_ref(),
            NodeData::Document(data) => data.guard.as_ref(),
            _ => None,
        };
        guard.expect("`guard` is not available on this node kind")
    }

    #[inline]
    pub fn has_snapshot(&self) -> bool {
        match &self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => data.has_snapshot,
            NodeData::Document(data) => data.has_snapshot,
            _ => false,
        }
    }

    #[inline]
    pub fn set_has_snapshot(&mut self, value: bool) {
        match &mut self.data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => data.has_snapshot = value,
            NodeData::Document(data) => data.has_snapshot = value,
            _ => {}
        }
    }

    #[inline]
    pub fn before(&self) -> Option<NodeId> {
        self.element_data().and_then(|data| data.before)
    }

    #[inline]
    pub fn after(&self) -> Option<NodeId> {
        self.element_data().and_then(|data| data.after)
    }
}

impl Node {
    pub(crate) fn new(
        tree: *mut crate::NodeTree,
        id: NodeId,
        guard: SharedRwLock,
        mut data: NodeData,
    ) -> Self {
        // Store a handle to the document's shared style lock on the node data.
        // Both element and document nodes are styled by stylo and so need it.
        match &mut data {
            NodeData::Element(data) | NodeData::AnonymousBlock(data) => {
                data.guard = Some(guard);
            }
            NodeData::Document(data) => data.guard = Some(guard),
            _ => {}
        }

        Self {
            tree,

            id,
            parent: None,
            children: ThinVec::new(),
            layout_parent: Cell::new(None),
            oof_containing_block: Cell::new(None),
            layout_children: RefCell::new(None),
            hoisted_children: RefCell::new(ThinVec::new()),
            anonymous_blocks: ThinVec::new(),
            paint_children: RefCell::new(None),
            stacking_context: None,
            sc_contribution_cache: RefCell::new(ThinVec::new()),

            flags: NodeFlags::empty(),
            data,
        }
    }

    pub fn set_transform(&mut self, scale: f32) -> Option<Affine> {
        let transform = self.primary_styles().and_then(|s| {
            let size = self.final_layout().size;
            let reference_box = Rect::new(
                Point2D::new(CSSPixelLength::new(0.0), CSSPixelLength::new(0.0)),
                Size2D::new(
                    CSSPixelLength::new(size.width),
                    CSSPixelLength::new(size.height),
                ),
            );
            // Resolve the transform in CSS pixels, then convert it to device-pixel space
            // (S * T * S^-1): translation components are scaled, linear components are not.
            crate::resolve_2d_transform(s.get_box(), reference_box).map(|t| {
                let scale = scale as f64;
                let [m11, m12, m21, m22, m41, m42] = t.as_coeffs();
                Affine::new([m11, m12, m21, m22, m41 * scale, m42 * scale])
            })
        });

        let slot = self.transform_mut();
        match (slot.as_deref_mut(), transform) {
            (Some(existing), Some(new)) => *existing = new,
            (None, Some(new)) => *slot = Some(Box::new(new)),
            (_, None) => *slot = None,
        }
        transform
    }

    pub fn pe_by_index(&self, index: usize) -> Option<NodeId> {
        match index {
            0 => self.after(),
            1 => self.before(),
            _ => panic!("Invalid pseudo element index"),
        }
    }

    pub fn set_pe_by_index(&mut self, index: usize, value: Option<NodeId>) {
        let Some(data) = self.element_data_mut() else {
            return;
        };
        match index {
            0 => data.after = value,
            1 => data.before = value,
            _ => panic!("Invalid pseudo element index"),
        }
    }

    pub(crate) fn display_style(&self) -> Option<StyloDisplay> {
        let display = self.primary_styles().as_ref()?.clone_display();
        Some(
            if self.element_data().is_some_and(|el| el.is_button_input()) {
                stylo_takia::convert::button_input_display(display)
            } else {
                display
            },
        )
    }

    pub fn is_or_contains_block(&self) -> bool {
        let style = self.primary_styles();
        let style = style.as_ref();

        // Ignore out-of-flow items
        let position = style
            .map(|s| s.clone_position())
            .unwrap_or(Position::Relative);
        let is_in_flow = matches!(
            position,
            Position::Static | Position::Relative | Position::Sticky
        );
        if !is_in_flow {
            return false;
        }
        // Floated boxes do not break up the inline flow: they participate in the
        // inline formatting context as out-of-flow inline boxes
        let is_floating = style
            .map(|s| s.clone_float().is_floating())
            .unwrap_or(false);
        if is_floating {
            return false;
        }
        let display = self.display_style().unwrap_or(StyloDisplay::inline());
        match display.outside() {
            DisplayOutside::None => false,
            DisplayOutside::Block => true,
            _ => {
                if display.inside() == DisplayInside::Flow {
                    self.children
                        .iter()
                        .copied()
                        .any(|child_id| self.tree()[child_id].is_or_contains_block())
                } else {
                    false
                }
            }
        }
    }

    pub fn is_whitespace_node(&self) -> bool {
        match &self.data {
            NodeData::Text(data) => data.content.chars().all(|c| c.is_ascii_whitespace()),
            _ => false,
        }
    }

    /// Whether this is an empty or whitespace-only text node whose whitespace may be collapsed
    /// away under the `white-space-collapse` it inherits from its parent.
    pub fn is_collapsible_whitespace_node(&self) -> bool {
        let NodeData::Text(data) = &self.data else {
            return false;
        };
        if data.content.is_empty() {
            return true;
        }
        if !data.content.chars().all(|c| c.is_ascii_whitespace()) {
            return false;
        }
        let white_space_collapse = self
            .parent
            .and_then(|parent_id| self.with(parent_id).primary_styles())
            .map(|style| style.clone_white_space_collapse());
        match white_space_collapse {
            Some(WhiteSpaceCollapse::Preserve | WhiteSpaceCollapse::BreakSpaces) => false,
            Some(WhiteSpaceCollapse::PreserveBreaks) => !data.content.contains('\n'),
            Some(WhiteSpaceCollapse::Collapse) | None => true,
        }
    }

    pub fn is_focussable(&self) -> bool {
        self.data
            .downcast_element()
            .map(|el| el.is_focussable)
            .unwrap_or(false)
    }

    pub fn set_restyle_hint(&mut self, hint: RestyleHint) {
        if let Some(stylo_element_data) = self.try_stylo_element_data_mut() {
            if let Some(mut element_data) = stylo_element_data.get_mut() {
                element_data.hint.insert(hint);
            }
        }
        // Mark all ancestors as having dirty descendants so the style traversal
        // will visit this node's subtree
        self.mark_ancestors_dirty();
    }

    /// Returns whether this node has any descendants that need restyling.
    pub fn has_dirty_descendants(&self) -> bool {
        self.dirty_descendants_flag()
            .is_some_and(|flag| flag.load(Ordering::Relaxed))
    }

    /// Sets the dirty_descendants flag on this node.
    pub fn set_dirty_descendants(&self) {
        if let Some(flag) = self.dirty_descendants_flag() {
            flag.store(true, Ordering::Relaxed);
        }
    }

    /// Clears the dirty_descendants flag on this node.
    pub fn unset_dirty_descendants(&self) {
        if let Some(flag) = self.dirty_descendants_flag() {
            flag.store(false, Ordering::Relaxed);
        }
    }

    /// Marks all ancestors of this node as having dirty descendants.
    /// This propagates the dirty flag up the tree so that the style traversal
    /// knows to visit the subtree containing this node.
    pub fn mark_ancestors_dirty(&self) {
        let mut current_id = self.parent;
        while let Some(parent_id) = current_id {
            let parent = &self.tree()[parent_id];
            // If this ancestor already has dirty_descendants set, we can stop
            // because all further ancestors must also have it set
            if let Some(flag) = parent.dirty_descendants_flag() {
                if flag.swap(true, Ordering::Relaxed) {
                    break;
                }
            }
            current_id = parent.parent;
        }
    }

    /// Returns whether this node or any of its descendants may carry damage.
    pub fn has_damaged_descendants(&self) -> bool {
        self.damaged_descendants_flag()
            .is_some_and(|flag| flag.load(Ordering::Relaxed))
    }

    /// Clears the damaged_descendants flag on this node.
    pub fn unset_damaged_descendants(&self) {
        if let Some(flag) = self.damaged_descendants_flag() {
            flag.store(false, Ordering::Relaxed);
        }
    }

    /// Marks this node and all of its ancestors as (potentially) carrying
    /// damage, so that the damage propagation pass visits this node's subtree.
    ///
    /// The invariant is: if a node carries damage (or needs damage-phase
    /// processing such as pseudo-element style syncing), then it and all of
    /// its ancestors have `damaged_descendants` set.
    pub fn mark_damaged(&self) {
        if let Some(flag) = self.damaged_descendants_flag() {
            if flag.swap(true, Ordering::Relaxed) {
                return;
            }
        }
        let mut current_id = self.parent;
        while let Some(parent_id) = current_id {
            let parent = &self.tree()[parent_id];
            // If this ancestor already has damaged_descendants set, we can stop
            // because all further ancestors must also have it set
            if let Some(flag) = parent.damaged_descendants_flag() {
                if flag.swap(true, Ordering::Relaxed) {
                    break;
                }
            }
            current_id = parent.parent;
        }
    }

    // pub fn damage_mut(&mut self) -> Option<&mut RestyleDamage> {
    //     self.stylo_element_data
    //         .get_mut()
    //         .map(|mut data: ElementDataMut<'a>| &'a mut data.damage)
    // }

    pub fn damage(&self) -> Option<RestyleDamage> {
        self.try_stylo_element_data()
            .and_then(|stylo| stylo.get().map(|data| data.damage))
    }

    pub fn set_damage(&mut self, damage: RestyleDamage) {
        if let Some(stylo) = self.try_stylo_element_data_mut() {
            if let Some(mut data) = stylo.get_mut() {
                data.damage = damage;
            }
        }
    }

    pub fn insert_damage(&mut self, damage: RestyleDamage) {
        if let Some(stylo) = self.try_stylo_element_data_mut() {
            if let Some(mut data) = stylo.get_mut() {
                data.damage |= damage;
            }
        }
        if !damage.is_empty() {
            self.mark_damaged();
        }
    }

    pub fn remove_damage(&mut self, damage: RestyleDamage) {
        if let Some(stylo) = self.try_stylo_element_data_mut() {
            if let Some(mut data) = stylo.get_mut() {
                data.damage.remove(damage);
            }
        }
    }

    pub fn clear_damage_mut(&mut self) {
        if let Some(stylo) = self.try_stylo_element_data_mut() {
            if let Some(mut data) = stylo.get_mut() {
                data.damage = RestyleDamage::empty();
            }
        }
    }

    // State changes (hover/focus/active/disabled) do not set a restyle hint.
    // Invalidation is driven by element snapshots: the style traversal diffs the
    // snapshotted (pre-change) state against the current state and invalidates
    // only the elements matched by selectors that depend on the changed state
    // bits. Ancestors are marked dirty so the traversal reaches this node.
    pub fn hover(&mut self) {
        if let Some(data) = self.element_data_mut() {
            data.element_state.insert(ElementState::HOVER);
        }
        self.mark_ancestors_dirty();
    }

    pub fn unhover(&mut self) {
        if let Some(data) = self.element_data_mut() {
            data.element_state.remove(ElementState::HOVER);
        }
        self.mark_ancestors_dirty();
    }

    pub fn is_hovered(&self) -> bool {
        self.element_data()
            .is_some_and(|data| data.element_state.contains(ElementState::HOVER))
    }

    pub fn focus(&mut self, shell_provider: Arc<dyn ShellProvider>) {
        if let Some(data) = self.element_data_mut() {
            data.element_state
                .insert(ElementState::FOCUS | ElementState::FOCUSRING);
        }
        self.mark_ancestors_dirty();

        // If focussing a text input, enable IME and set IME area
        if self
            .element_data()
            .and_then(|elem| elem.text_input_data())
            .is_some()
        {
            let password = self
                .element_data()
                .and_then(|element| element.text_input_data())
                .is_some_and(|input| input.is_password());
            shell_provider.set_ime_purpose(if password {
                apace_traits::shell::ImePurpose::Password
            } else {
                apace_traits::shell::ImePurpose::Normal
            });
            shell_provider.set_ime_enabled(true);
            if let Some(input) = self.element_data().and_then(|e| e.text_input_data()) {
                input.sync_ime_context(shell_provider.as_ref());
            }
            if let Some((x, y, width, height)) = self.text_input_ime_cursor_area() {
                shell_provider.set_ime_cursor_area(x, y, width, height);
            }
        }
    }

    pub fn blur(&mut self, shell_provider: Arc<dyn ShellProvider>) {
        if let Some(data) = self.element_data_mut() {
            data.element_state
                .remove(ElementState::FOCUS | ElementState::FOCUSRING);
        }
        self.mark_ancestors_dirty();

        // If blurring a text input, disable IME
        if self
            .element_data()
            .and_then(|elem| elem.text_input_data())
            .is_some()
        {
            shell_provider.set_ime_enabled(false);
        }
    }

    pub fn is_focussed(&self) -> bool {
        self.element_data()
            .is_some_and(|data| data.element_state.contains(ElementState::FOCUS))
    }

    pub fn active(&mut self) {
        if let Some(data) = self.element_data_mut() {
            data.element_state.insert(ElementState::ACTIVE);
        }
        self.mark_ancestors_dirty();
    }

    pub fn unactive(&mut self) {
        if let Some(data) = self.element_data_mut() {
            data.element_state.remove(ElementState::ACTIVE);
        }
        self.mark_ancestors_dirty();
    }

    pub fn is_active(&self) -> bool {
        self.element_data()
            .is_some_and(|data| data.element_state.contains(ElementState::ACTIVE))
    }

    // Marks the node as disabled if it can be.
    // It does not disable any children which should be disabled as well (relevant for the `select` element).
    pub fn disable(&mut self) {
        if let Some(data) = self.element_data_mut() {
            if data.can_be_disabled() {
                data.element_state.insert(ElementState::DISABLED);
                data.element_state.remove(ElementState::ENABLED);
            }
        }
        self.mark_ancestors_dirty();
    }

    // Marks the node as enabled if it can be.
    // It does not enable any children which should be enabled as well (relevant for the `select` element).
    pub fn enable(&mut self) {
        if let Some(data) = self.element_data_mut() {
            if data.can_be_disabled() {
                data.element_state.insert(ElementState::ENABLED);
                data.element_state.remove(ElementState::DISABLED);
            }
        }
        self.mark_ancestors_dirty();
    }

    pub fn subdoc(&self) -> Option<&dyn Document> {
        self.element_data().and_then(|el| el.sub_doc_data())
    }

    pub fn subdoc_mut(&mut self) -> Option<&mut dyn Document> {
        self.element_data_mut().and_then(|el| el.sub_doc_data_mut())
    }

    pub(crate) fn text_input_ime_cursor_area(&self) -> Option<(f32, f32, f32, f32)> {
        let input = self.element_data()?.text_input_data()?;
        let scale = f64::from(input.display_editor().try_layout()?.scale());
        let rect = input.ime_cursor_area();
        let pos = self.absolute_position(0.0, 0.0);
        let x = pos.x + self.final_layout().content_box_x() + (rect.x0 / scale) as f32
            - if input.is_multiline {
                0.0
            } else {
                input.scroll_offset
            };
        let y = pos.y
            + self.final_layout().content_box_y()
            + self.text_input_v_centering_offset(scale) as f32
            + (rect.y0 / scale) as f32
            - if input.is_multiline {
                input.scroll_offset
            } else {
                0.0
            };
        Some((
            x,
            y,
            ((rect.x1 - rect.x0) / scale) as f32,
            ((rect.y1 - rect.y0) / scale) as f32,
        ))
    }

    pub fn text_input_v_centering_offset(&self, scale: f64) -> f64 {
        // For single-line inputs, add an offset to vertically center the text input layout
        // within the content box of it's node.
        if let Some(input_data) = self
            .data
            .downcast_element()
            .and_then(|el| el.text_input_data())
        {
            if !input_data.is_multiline {
                let content_box_height = self.final_layout().content_box_height();
                let input_height =
                    input_data.display_editor().try_layout().unwrap().height() / scale as f32;
                let y_offset = ((content_box_height - input_height) / 2.0).max(0.0);

                return y_offset as f64;
            }
        }

        0.0
    }
}

#[derive(Debug, Clone, Copy, PartialEq)]
pub enum NodeKind {
    Document,
    Element,
    AnonymousBlock,
    Text,
    Comment,
}

/// The different kinds of nodes in the DOM.
#[derive(Debug, Clone)]
pub enum NodeData {
    /// The `Document` itself - the root node of a HTML document.
    Document(Box<DocumentData>),

    /// An element with attributes.
    Element(Box<ElementData>),

    /// An anonymous block box
    AnonymousBlock(Box<ElementData>),

    /// A text node.
    Text(TextNodeData),

    /// A comment.
    Comment {
        /// The textual content of the comment
        contents: String,
    },
    // /// A `DOCTYPE` with name, public id, and system id. See
    // /// [document type declaration on wikipedia][https://en.wikipedia.org/wiki/Document_type_declaration]
    // Doctype { name: String, public_id: String, system_id: String },

    // /// A Processing instruction.
    // ProcessingInstruction { target: String, contents: String },
}

impl NodeData {
    pub fn downcast_element(&self) -> Option<&ElementData> {
        match self {
            Self::Element(data) => Some(data),
            Self::AnonymousBlock(data) => Some(data),
            _ => None,
        }
    }

    pub fn downcast_element_mut(&mut self) -> Option<&mut ElementData> {
        match self {
            Self::Element(data) => Some(data),
            Self::AnonymousBlock(data) => Some(data),
            _ => None,
        }
    }

    pub fn is_element_with_tag_name(&self, name: &impl PartialEq<LocalName>) -> bool {
        let Some(elem) = self.downcast_element() else {
            return false;
        };
        *name == elem.name.local
    }

    pub fn attrs(&self) -> Option<&[Attribute]> {
        Some(&self.downcast_element()?.attrs)
    }

    pub fn attr(&self, name: impl PartialEq<LocalName>) -> Option<&str> {
        self.downcast_element()?.attr(name)
    }

    pub fn has_attr(&self, name: impl PartialEq<LocalName>) -> bool {
        self.downcast_element()
            .is_some_and(|elem| elem.has_attr(name))
    }

    pub fn kind(&self) -> NodeKind {
        match self {
            NodeData::Document(_) => NodeKind::Document,
            NodeData::Element(_) => NodeKind::Element,
            NodeData::AnonymousBlock(_) => NodeKind::AnonymousBlock,
            NodeData::Text(_) => NodeKind::Text,
            NodeData::Comment { .. } => NodeKind::Comment,
        }
    }
}

#[derive(Debug, Clone)]
pub struct TextNodeData {
    /// The textual content of the text node
    pub content: String,
}

impl TextNodeData {
    pub fn new(content: String) -> Self {
        Self { content }
    }
}

/*
-> Computed styles
-> Layout
-----> Needs to happen only when styles are computed
*/

// type DomRefCell<T> = RefCell<T>;

// pub struct DomData {
//     // ... we can probs just get away with using the html5ever types directly. basically just using the servo dom, but without the bindings
//     local_name: html5ever::LocalName,
//     tag_name: html5ever::QualName,
//     namespace: html5ever::Namespace,
//     prefix: DomRefCell<Option<html5ever::Prefix>>,
//     attrs: DomRefCell<Vec<Attr>>,
//     // attrs: DomRefCell<Vec<Dom<Attr>>>,
//     id_attribute: DomRefCell<Option<Atom>>,
//     is: DomRefCell<Option<LocalName>>,
//     // style_attribute: DomRefCell<Option<Arc<Locked<PropertyDeclarationBlock>>>>,
//     // attr_list: MutNullableDom<NamedNodeMap>,
//     // class_list: MutNullableDom<DOMTokenList>,
//     state: Cell<ElementState>,
// }

impl Node {
    pub fn tree(&self) -> &crate::NodeTree {
        unsafe { &*self.tree }
    }

    #[track_caller]
    pub fn with(&self, id: NodeId) -> &Node {
        self.tree().get(id).unwrap()
    }

    pub fn print_tree(&self, level: usize) {
        println!(
            "{} {} {:?} {} {:?}",
            "  ".repeat(level),
            self.id,
            self.parent,
            self.node_debug_str().replace('\n', ""),
            self.children
        );
        // println!("{} {:?}", "  ".repeat(level), self.children);
        for child_id in self.children.iter() {
            let child = self.with(*child_id);
            child.print_tree(level + 1)
        }
    }

    // Get the index of the current node in the parents child list
    pub fn index_of_child(&self, child_id: NodeId) -> Option<usize> {
        self.children.iter().position(|id| *id == child_id)
    }

    // Get the index of the current node in the parents child list
    pub fn child_index(&self) -> Option<usize> {
        self.tree()[self.parent?]
            .children
            .iter()
            .position(|id| *id == self.id)
    }

    // Get the nth node in the parents child list
    pub fn forward(&self, n: usize) -> Option<&Node> {
        let child_idx = self.child_index().unwrap_or(0);
        self.tree()[self.parent?]
            .children
            .get(child_idx + n)
            .map(|id| self.with(*id))
    }

    pub fn backward(&self, n: usize) -> Option<&Node> {
        let child_idx = self.child_index().unwrap_or(0);
        if child_idx < n {
            return None;
        }

        self.tree()[self.parent?]
            .children
            .get(child_idx - n)
            .map(|id| self.with(*id))
    }

    pub fn is_element(&self) -> bool {
        matches!(self.data, NodeData::Element { .. })
    }

    pub fn is_anonymous(&self) -> bool {
        matches!(self.data, NodeData::AnonymousBlock { .. })
    }

    pub fn is_text_node(&self) -> bool {
        matches!(self.data, NodeData::Text { .. })
    }

    pub fn element_data(&self) -> Option<&ElementData> {
        match self.data {
            NodeData::Element(ref data) => Some(data),
            NodeData::AnonymousBlock(ref data) => Some(data),
            _ => None,
        }
    }

    pub fn element_data_mut(&mut self) -> Option<&mut ElementData> {
        match self.data {
            NodeData::Element(ref mut data) => Some(data),
            NodeData::AnonymousBlock(ref mut data) => Some(data),
            _ => None,
        }
    }

    pub fn text_data(&self) -> Option<&TextNodeData> {
        match self.data {
            NodeData::Text(ref data) => Some(data),
            _ => None,
        }
    }

    pub fn text_data_mut(&mut self) -> Option<&mut TextNodeData> {
        match self.data {
            NodeData::Text(ref mut data) => Some(data),
            _ => None,
        }
    }

    pub fn node_debug_str(&self) -> String {
        let mut s = String::new();

        match &self.data {
            NodeData::Document(_) => write!(s, "DOCUMENT"),
            // NodeData::Doctype { name, .. } => write!(s, "DOCTYPE {name}"),
            NodeData::Text(data) => {
                let bytes = data.content.as_bytes();
                write!(
                    s,
                    "TEXT {}",
                    std::str::from_utf8(bytes.split_at(10.min(bytes.len())).0)
                        .unwrap_or("INVALID UTF8")
                )
            }
            NodeData::Comment { .. } => write!(s, "COMMENT"),
            NodeData::AnonymousBlock(_) => write!(s, "AnonymousBlock"),
            NodeData::Element(data) => {
                let name = &data.name;
                let class = self.attr(local_name!("class")).unwrap_or("");
                let id = self.attr(local_name!("id")).unwrap_or("");
                let display = self.display_constructed_as().to_css_string();
                write!(s, "<{}", name.local).unwrap();
                if !id.is_empty() {
                    write!(s, " #{id}").unwrap();
                }
                if !class.is_empty() {
                    if class.contains(' ') {
                        write!(s, " class=\"{class}\"").unwrap()
                    } else {
                        write!(s, " .{class}").unwrap()
                    }
                }
                write!(s, "> ({display})")
            } // NodeData::ProcessingInstruction { .. } => write!(s, "ProcessingInstruction"),
        }
        .unwrap();
        s
    }

    pub fn attrs(&self) -> Option<&[Attribute]> {
        Some(&self.element_data()?.attrs)
    }

    pub fn attr(&self, name: LocalName) -> Option<&str> {
        let attr = self.attrs()?.iter().find(|id| id.name.local == name)?;
        Some(&attr.value)
    }

    pub fn primary_styles(&self) -> Option<impl Deref<Target = ServoArc<ComputedValues>>> {
        self.try_stylo_element_data()
            .and_then(|stylo| stylo.primary_styles())
    }

    /// A lazy Takia style backed by this node's primary stylo style.
    ///
    /// Panics if the node has no computed styles: layout always runs after
    /// styling, and the only unstyled nodes (text, comments, descendants of
    /// `display: none`) are never queried by Takia.
    pub fn layout_style(&self) -> stylo_takia::TakiaStyloStyle<ComputedStyleRef<'_>> {
        let styles = self
            .try_stylo_element_data()
            .and_then(|stylo| stylo.computed_styles())
            .expect("layout_style() called on a node without computed styles");

        let mut flags = stylo_takia::StyleFlags::empty();
        if let Some(el) = self.data.downcast_element() {
            if crate::layout::replaced::is_replaced_element(&el.name.local) {
                flags |= stylo_takia::StyleFlags::IS_REPLACED;
            }
            if el.name.local == local_name!("button") {
                flags |= stylo_takia::StyleFlags::IS_BUTTON;
            }
            if el.is_button_input() {
                flags |= stylo_takia::StyleFlags::IS_BUTTON_INPUT;
            }
            if let Some(inline_layout) = el.inline_layout_data.as_deref() {
                flags |= inline_layout.span_cb_flags;
            }
        }

        #[cfg(feature = "writing-mode")]
        {
            // Own-layout_wm by default: the node's own algorithm reads its style in its own axes
            let layout_wm = styles.writing_mode;
            stylo_takia::TakiaStyloStyle::new_in(styles, flags, layout_wm)
        }
        #[cfg(not(feature = "writing-mode"))]
        {
            stylo_takia::TakiaStyloStyle::new(styles, flags)
        }
    }

    /// The node's style for Takia, expressed in the axes of the writing mode `layout_wm` (the writing
    /// mode of the box laying this node out). Used for the child-style getters.
    #[cfg(feature = "writing-mode")]
    pub fn layout_style_in(
        &self,
        layout_wm: stylo_takia::WritingMode,
    ) -> stylo_takia::TakiaStyloStyle<ComputedStyleRef<'_>> {
        let mut style = self.layout_style();
        style.layout_wm = layout_wm;
        style
    }

    /// Whether the node has any `contain` value, which blocks `writing-mode` propagation from
    /// `<body>` to the root (css-writing-modes-3 §8).
    #[cfg(feature = "writing-mode")]
    pub(crate) fn has_containment(&self) -> bool {
        self.primary_styles()
            .is_some_and(|style| !style.clone_contain().is_empty())
    }

    /// Whether the node is a flex container with a column `flex-direction`, i.e. aligns its
    /// children's `align-self` in its inline axis.
    #[cfg(feature = "writing-mode")]
    pub(crate) fn is_column_flex_container(&self) -> bool {
        self.primary_styles().is_some_and(|s| {
            s.clone_display().inside() == DisplayInside::Flex
                && !self.element_data().is_some_and(|el| el.is_button_input())
                && matches!(
                    s.get_position().flex_direction,
                    FlexDirection::Column | FlexDirection::ColumnReverse
                )
        })
    }

    /// The node's computed `writing-mode` (horizontal-tb for nodes without styles)
    #[cfg(feature = "writing-mode")]
    pub fn writing_mode(&self) -> stylo_takia::WritingMode {
        self.primary_styles()
            .map(|s| s.writing_mode)
            .unwrap_or(stylo_takia::WritingMode::empty())
    }

    /// The node's `display` as a [`takia::Display`]. Returns [`takia::Display::Block`]
    /// for nodes without computed styles (e.g. text nodes).
    pub fn takia_display(&self) -> takia::Display {
        self.primary_styles()
            .map(|style| {
                let display = style.clone_display();
                if self.element_data().is_some_and(|el| el.is_button_input())
                    && !matches!(
                        display.inside(),
                        DisplayInside::None | DisplayInside::Contents
                    )
                {
                    takia::Display::FlowRoot
                } else {
                    stylo_takia::convert::display(display)
                }
            })
            .unwrap_or(takia::Display::Block)
    }

    /// The node's `position` as a [`takia::Position`]. Returns [`takia::Position::Static`]
    /// for nodes without computed styles (e.g. text nodes).
    pub fn takia_position(&self) -> takia::Position {
        self.primary_styles()
            .map(|s| stylo_takia::convert::position(s.get_box().position))
            .unwrap_or(takia::Position::Static)
    }

    /// Whether the node is an out-of-flow box that Takia positions from its containing
    /// block's hoisted child list rather than from its parent (`display: none` boxes
    /// generate no box and are never hoisted).
    pub fn is_out_of_flow(&self) -> bool {
        self.primary_styles().is_some_and(|s| {
            let box_style = s.get_box();
            stylo_takia::convert::position(box_style.position).is_out_of_flow()
                && stylo_takia::convert::display(box_style.display) != takia::Display::None
        })
    }

    pub fn text_content(&self) -> String {
        let mut out = String::new();
        self.write_text_content(&mut out);
        out
    }

    fn write_text_content(&self, out: &mut String) {
        match &self.data {
            NodeData::Text(data) => {
                out.push_str(&data.content);
            }
            NodeData::Element(..) | NodeData::AnonymousBlock(..) => {
                for child_id in self.children.iter() {
                    self.with(*child_id).write_text_content(out);
                }
            }
            _ => {}
        }
    }

    pub fn flush_style_attribute(&mut self, url_extra_data: &UrlExtraData) {
        if let NodeData::Element(ref mut elem_data) = self.data {
            if let Some(guard) = elem_data.guard.clone() {
                elem_data.flush_style_attribute(&guard, url_extra_data);
            }
        }
    }

    /// The `order` sort key of this node within a flex/grid container's
    /// `layout_children`. The list is stable-sorted by this key when the
    /// container's children are constructed (`collect_layout_children`) and
    /// re-collected when a child's `order` changes (`REORDER_CHILDREN` damage).
    ///
    /// ::before/::after pseudos are flex/grid items and honor `order`. They
    /// sit first/last in the constructed list, and the sort is stable, so
    /// ties keep ::before first and ::after last. Out-of-flow children are
    /// not flex/grid items, so they key as 0 and keep source order.
    pub fn order(&self) -> i32 {
        self.primary_styles()
            .filter(|s| !matches!(s.get_box().position, Position::Absolute | Position::Fixed))
            .map(|s| s.clone_order())
            .unwrap_or(0)
    }

    pub fn z_index(&self) -> i32 {
        self.primary_styles()
            .map(|s| s.clone_z_index().integer_or(0))
            .unwrap_or(0)
    }

    // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Stacking_context#features_creating_stacking_contexts
    pub fn is_stacking_context_root(&self, is_flex_or_grid_item: bool) -> bool {
        let Some(style) = self.primary_styles() else {
            return false;
        };

        let position = style.clone_position();
        let has_z_index = !style.clone_z_index().is_auto();

        if style.clone_opacity() != 1.0 {
            return true;
        }

        let position_based = match position {
            Position::Fixed | Position::Sticky => true,
            Position::Relative | Position::Absolute => has_z_index,
            Position::Static => has_z_index && is_flex_or_grid_item,
        };
        if position_based {
            return true;
        }

        let box_style = style.get_box();
        if !box_style.transform.0.is_empty()
            || !matches!(box_style.rotate, Rotate::None)
            || !matches!(box_style.scale, Scale::None)
            || !matches!(box_style.translate, Translate::None)
        {
            return true;
        }

        if self.applies_atomic_paint_effect() {
            return true;
        }

        if style.get_box().isolation == Isolation::Isolate {
            return true;
        }

        // TODO: mix-blend-mode
        // TODO: contain

        false
    }

    /// Whether this node's styles apply an atomic paint effect (opacity, filter,
    /// clip-path, mask) to its subtree.
    pub(crate) fn applies_atomic_paint_effect(&self) -> bool {
        use style::values::computed::basic_shape::ClipPath;
        use style::values::generics::image::GenericImage;

        let Some(style) = self.primary_styles() else {
            return false;
        };

        if style.clone_opacity() != 1.0 {
            return true;
        }

        let effects = style.get_effects();
        if !effects.filter.0.is_empty() {
            return true;
        }

        if !matches!(style.clone_clip_path(), ClipPath::None) {
            return true;
        }

        style
            .get_svg()
            .mask_image
            .0
            .iter()
            .any(|image| !matches!(image, GenericImage::None))
    }

    /// Takes an (x, y) position (relative to the *parent's* top-left corner) and returns:
    ///    - None if the position is outside of this node's bounds
    ///    - Some(HitResult) if the position is within the node but doesn't match any children
    ///    - The result of recursively calling child.hit() on the the child element that is
    ///      positioned at that position if there is one.
    ///
    /// TODO: z-index
    /// (If multiple children are positioned at the position then a random one will be recursed into)
    pub fn hit(&self, x: f32, y: f32, scale: f64) -> Option<HitResult> {
        self.hit_inner(x, y, scale, &mut None)
    }

    /// [`hit`](Self::hit), also resolving the innermost overlay scrollbar
    /// thumb under the point into `scrollbar` during the same descent (so
    /// thumb hit-testing shares the exact coordinate handling — transforms
    /// included — of every other hit test).
    pub(crate) fn hit_inner(
        &self,
        x: f32,
        y: f32,
        scale: f64,
        scrollbar: &mut Option<crate::node::ScrollbarRef>,
    ) -> Option<HitResult> {
        use style::computed_values::pointer_events::T as PointerEvents;
        use style::computed_values::visibility::T as Visibility;

        // Don't hit on visbility:hidden elements
        if let Some(style) = self.primary_styles() {
            if matches!(
                style.clone_visibility(),
                Visibility::Hidden | Visibility::Collapse
            ) {
                return None;
            }
        }

        // pointer-events:none makes this element transparent to hits, but its
        // descendants are still tested (one may restore pointer-events:auto).
        let pointer_events_none = self
            .primary_styles()
            .is_some_and(|style| style.clone_pointer_events() == PointerEvents::None);

        let mut x = x - self.final_layout().location.x + self.scroll_offset().x as f32;
        let mut y = y - self.final_layout().location.y + self.scroll_offset().y as f32;

        if let Some(t) = self.transform().as_deref() {
            let p = t.inverse() * kurbo::Point::new(x as f64 * scale, y as f64 * scale);
            x = (p.x / scale) as f32;
            y = (p.y / scale) as f32;
        }

        let size = self.final_layout().size;
        let matches_self = !(x < 0.0
            || x > size.width + self.scroll_offset().x as f32
            || y < 0.0
            || y > size.height + self.scroll_offset().y as f32);

        let overflow_rect = self.final_layout().scrollable_overflow_rect;
        let matches_content = !(x < 0.0
            || x > overflow_rect.right + self.scroll_offset().x as f32
            || y < 0.0
            || y > overflow_rect.bottom + self.scroll_offset().y as f32);

        let matches_hoisted_content = match &self.stacking_context {
            Some(sc) => {
                // Both the point (after the scroll adjustment above) and the
                // bbox are in this node's unscrolled content coordinates.
                let bbox = sc.hoisted_content_bbox(self.tree(), self.id, scale);
                x >= bbox.left && x <= bbox.right && y >= bbox.top && y <= bbox.bottom
            }
            None => false,
        };

        // `scrollable_overflow` is stored in device (scaled) pixels, whereas the
        // coordinates here are in CSS pixels, so unscale it before comparing.
        let overflow = *self.scrollable_overflow();

        let matches_overflow = x >= (overflow.x0 / scale) as f32
            && x <= (overflow.x1 / scale) as f32
            && y >= (overflow.y0 / scale) as f32
            && y <= (overflow.y1 / scale) as f32;

        if !matches_self && !matches_content && !matches_hoisted_content && !matches_overflow {
            return None;
        }

        // Descendants overwrite, so the innermost scroll container's thumb
        // wins. Thumb coords are border-box relative (unscrolled).
        if matches_self
            && let Some(sb) = self.scrollbar_at_local(
                (x - self.scroll_offset().x as f32) as f64,
                (y - self.scroll_offset().y as f32) as f64,
            )
        {
            *scrollbar = Some(sb);
        }

        let content_box_offset = takia::Point {
            x: self.final_layout().padding.left + self.final_layout().border.left,
            y: self.final_layout().padding.top + self.final_layout().border.top,
        };
        if self.flags.is_inline_root() {
            x -= content_box_offset.x;
            y -= content_box_offset.y;
        }

        // Positive z_index hoisted children
        if matches_hoisted_content {
            if let Some(hoisted) = &self.stacking_context {
                for hoisted_child in hoisted.pos_z_hoisted_children().rev() {
                    let pos = hoisted_child.position(self.tree(), self.id);
                    let x = x - pos.x;
                    let y = y - pos.y;
                    if let Some(hit) = self
                        .with(hoisted_child.node_id)
                        .hit_inner(x, y, scale, scrollbar)
                    {
                        return Some(hit);
                    }
                }
            }
        }

        // Call `.hit()` on each child in turn. If any return `Some` then return that value. Else return `Some(self.id).
        for child_id in self.paint_children.borrow().iter().flatten().rev() {
            let child = self.with(*child_id);
            let child_position = child.takia_position();
            let mut child_x = x;
            let mut child_y = y;
            if child_position.is_out_of_flow() {
                // Out-of-flow children's layout location is relative to this node's
                // border box, so undo the inline-root content-box offset applied above
                if self.flags.is_inline_root() {
                    child_x += content_box_offset.x;
                    child_y += content_box_offset.y;
                }
                // Fixed-position children of the root element are positioned
                // against the viewport and do not scroll with it. (A fixed box
                // whose containing block is a transformed ancestor scrolls with
                // that ancestor like any other out-of-flow box.)
                if child_position == takia::Position::Fixed
                    && self.containing_block().is_none()
                    && !self.flags.is_top_layer()
                {
                    child_x -= self.scroll_offset().x as f32;
                    child_y -= self.scroll_offset().y as f32;
                    let viewport_scroll = self.tree().viewport_scroll();
                    child_x -= viewport_scroll.x as f32;
                    child_y -= viewport_scroll.y as f32;
                }
            }
            if let Some(hit) = child.hit_inner(child_x, child_y, scale, scrollbar) {
                return Some(hit);
            }
        }

        // Negative z_index hoisted children
        if matches_hoisted_content {
            if let Some(hoisted) = &self.stacking_context {
                for hoisted_child in hoisted.neg_z_hoisted_children().rev() {
                    let pos = hoisted_child.position(self.tree(), self.id);
                    let x = x - pos.x;
                    let y = y - pos.y;
                    if let Some(hit) = self
                        .with(hoisted_child.node_id)
                        .hit_inner(x, y, scale, scrollbar)
                    {
                        return Some(hit);
                    }
                }
            }
        }

        // Inline children
        if self.flags.is_inline_root() {
            let element_data = &self.element_data().unwrap();
            if let Some(ild) = element_data.inline_layout_data.as_ref() {
                let layout = &ild.layout;
                let scale = layout.scale();
                let y = y - ild.block_offset;

                if let Some((cluster, _side)) =
                    Cluster::from_point_exact(layout, x * scale, y * scale)
                {
                    let node_id = cluster.style().brush.id;
                    let text_pointer_events_none = self
                        .with(node_id)
                        .primary_styles()
                        .is_some_and(|style| style.clone_pointer_events() == PointerEvents::None);
                    if !text_pointer_events_none {
                        return Some(HitResult {
                            node_id,
                            x,
                            y,
                            is_text: true,
                        });
                    }
                }
            }
        }

        // Self (this node)
        if matches_self && !pointer_events_none {
            return Some(HitResult {
                node_id: self.id,
                x,
                y,
                is_text: false,
            });
        }

        None
    }

    /// Find the inline root ancestor of this node (or self if this is an inline root).
    /// Returns None if no inline root ancestor exists.
    pub fn inline_root_ancestor(&self) -> Option<&Node> {
        let mut node = self;
        loop {
            if node.flags.is_inline_root() {
                return Some(node);
            }
            let id = node.layout_parent.get()?;
            node = self.with(id);
        }
    }

    /// Get the text byte offset at a given point, using coordinates already transformed
    /// to be relative to this inline root's content box.
    /// Returns Some(byte_offset) if the point hits text, None otherwise.
    pub fn text_offset_at_point(&self, x: f32, y: f32) -> Option<usize> {
        if !self.flags.is_inline_root() {
            return None;
        }

        let element_data = self.element_data()?;
        let inline_layout = element_data.inline_layout_data.as_ref()?;
        let layout = &inline_layout.layout;
        let scale = layout.scale();
        let y = y - inline_layout.block_offset;

        // Use Parley's cluster hit testing (from_point is more forgiving than from_point_exact)
        let (cluster, side) = Cluster::from_point(layout, x * scale, y * scale)?;

        // Determine byte offset based on which side of the cluster was clicked
        // For LTR text: left side = start of cluster, right side = end of cluster
        // For RTL text: left side = end of cluster, right side = start of cluster
        // Also, explicit line breaks should always use start to avoid cursor appearing on next line
        let is_leading = side == ClusterSide::Left;
        let offset = if cluster.is_rtl() {
            if is_leading {
                cluster.text_range().end
            } else {
                cluster.text_range().start
            }
        } else {
            // LTR text
            if is_leading || cluster.is_line_break() == Some(BreakReason::Explicit) {
                cluster.text_range().start
            } else {
                cluster.text_range().end
            }
        };

        Some(offset)
    }

    /// Whether this node is a non-atomic inline element: one that has no layout box of its
    /// own because it is flattened into the containing inline root's text layout as a style
    /// span.
    pub fn is_non_atomic_inline(&self) -> bool {
        let Some(element) = self.element_data() else {
            return false;
        };
        if self.flags.is_inline_root()
            || crate::layout::replaced::is_inline_box_element(&element.name.local)
        {
            return false;
        }
        self.primary_styles().is_some_and(|styles| {
            let display = styles.clone_display();
            display.outside() == DisplayOutside::Inline && display.inside() == DisplayInside::Flow
        })
    }

    /// The node whose box this node's `Layout.location` is relative to: the
    /// `oof_containing_block` for a hoisted out-of-flow box, otherwise the
    /// `layout_parent`.
    pub fn containing_block(&self) -> Option<NodeId> {
        if self.flags.is_top_layer() {
            return None;
        }
        self.oof_containing_block
            .get()
            .or_else(|| self.layout_parent.get())
    }

    /// Computes the Document-relative coordinates of the `Node`
    pub fn absolute_position(&self, x: f32, y: f32) -> crate::util::Point<f32> {
        let x = x + self.final_layout().location.x - self.scroll_offset().x as f32;
        let y = y + self.final_layout().location.y - self.scroll_offset().y as f32;
        if self.flags.is_top_layer() {
            let scroll = self.tree().viewport_scroll();
            return crate::util::Point {
                x: x + scroll.x as f32,
                y: y + scroll.y as f32,
            };
        }

        // Recurse up the positioning hierarchy
        self.containing_block()
            .map(|i| self.with(i).absolute_position(x, y))
            .unwrap_or(crate::util::Point { x, y })
    }

    /// Whether this node can act as an [`offset_parent`](Self::offset_parent): a positioned
    /// element, or one of the elements that always qualify (`body`, `td`, `th`).
    pub(crate) fn is_offset_parent(&self) -> bool {
        let Some(styles) = self.primary_styles() else {
            return false;
        };
        if styles.get_box().position != Position::Static {
            return true;
        }
        self.data.is_element_with_tag_name(&local_name!("body"))
            || self.data.is_element_with_tag_name(&local_name!("td"))
            || self.data.is_element_with_tag_name(&local_name!("th"))
    }

    /// Whether this node is a non-positioned `body` element. When such an element is the
    /// `offsetParent`, `offsetLeft`/`offsetTop` are measured from the initial containing
    /// block origin rather than from the `body`'s padding edge.
    pub(crate) fn is_static_body(&self) -> bool {
        self.data.is_element_with_tag_name(&local_name!("body"))
            && self
                .primary_styles()
                .is_some_and(|styles| styles.get_box().position == Position::Static)
    }

    /// The nearest layout ancestor that [is an offset parent](Self::is_offset_parent), as in
    /// CSSOM View's `offsetParent`.
    pub fn offset_parent(&self) -> Option<&Node> {
        let mut node = self;
        loop {
            node = self.with(node.containing_block()?);
            if node.is_offset_parent() {
                return Some(node);
            }
        }
    }

    /// The per-line-box fragment boxes of a non-atomic inline element, in CSS pixels relative
    /// to the border box of its inline root.
    ///
    /// Returns `None` for nodes that have their own layout box.
    pub fn inline_fragment_boxes(&self) -> Option<impl Iterator<Item = takia::Rect<f32>> + '_> {
        use parley::PositionedLayoutItem;

        if !self.is_non_atomic_inline() {
            return None;
        }

        let inline_root = self.inline_root_ancestor()?;
        let inline_layout = inline_root.element_data()?.inline_layout_data.as_ref()?;
        let layout = &inline_layout.layout;
        let scale = layout.scale();

        // Walk up the DOM parent chain from `id` to check whether it is (or is
        // inside) the target node, stopping at the inline root.
        let inline_root_id = inline_root.id;
        let is_in_target = move |mut id: NodeId| -> bool {
            loop {
                if id == self.id {
                    return true;
                }
                if id == inline_root_id {
                    return false;
                }
                match self.with(id).parent {
                    Some(parent) => id = parent,
                    None => return false,
                }
            }
        };

        let root_layout = inline_root.unrounded_layout();
        let content_box_inset = root_layout.padding + root_layout.border;
        let origin_x = content_box_inset.left;
        let origin_y = content_box_inset.top + inline_layout.block_offset;

        fn union(acc: &mut Option<takia::Rect<f32>>, left: f32, top: f32, right: f32, bottom: f32) {
            *acc = Some(match *acc {
                Some(rect) => takia::Rect {
                    left: rect.left.min(left),
                    top: rect.top.min(top),
                    right: rect.right.max(right),
                    bottom: rect.bottom.max(bottom),
                },
                None => takia::Rect {
                    left,
                    top,
                    right,
                    bottom,
                },
            });
        }

        // One rect per line box: the union of all of the target's fragments on that line
        Some(layout.lines().filter_map(move |line| {
            let line_metrics = line.metrics();
            let mut line_rect: Option<takia::Rect<f32>> = None;

            for item in line.items() {
                match item {
                    PositionedLayoutItem::GlyphRun(glyph_run) => {
                        if !is_in_target(glyph_run.style().brush.id) {
                            continue;
                        }
                        let x0 = glyph_run.offset();
                        let x1 = x0 + glyph_run.advance();
                        // Use the line box's block extent rather than the
                        // run's font ascent/descent: fonts with small
                        // typographic metrics would otherwise produce rects
                        // that clip the rendered glyphs. This matches the
                        // geometry used for text selection highlights.
                        let y0 = line_metrics.block_min_coord;
                        let y1 = line_metrics.block_max_coord;
                        union(&mut line_rect, x0, y0, x1, y1);
                    }
                    PositionedLayoutItem::InlineBox(inline_box) => {
                        if !is_in_target(NodeId::from_u64(inline_box.id)) {
                            continue;
                        }
                        let x0 = inline_box.x;
                        let y0 = inline_box.y;
                        union(
                            &mut line_rect,
                            x0,
                            y0,
                            x0 + inline_box.width,
                            y0 + inline_box.height,
                        );
                    }
                }
            }

            line_rect.map(|rect| takia::Rect {
                left: origin_x + rect.left / scale,
                top: origin_y + rect.top / scale,
                right: origin_x + rect.right / scale,
                bottom: origin_y + rect.bottom / scale,
            })
        }))
    }

    /// CSSOM View's `offsetLeft`/`offsetTop`: the offset of this node's border box from the
    /// padding edge of its [`offset_parent`](Self::offset_parent).
    pub fn offset_top_left(&self) -> crate::util::Point<f32> {
        let mut x = 0.0;
        let mut y = 0.0;
        let mut current = self;

        // Non-atomic inlines have no layout box of their own: start from the first
        // fragment box (relative to the inline root's border box) and continue the
        // walk from the inline root.
        if let Some(mut fragments) = self.inline_fragment_boxes() {
            if let Some(first) = fragments.next() {
                x += first.left;
                y += first.top;
            }
            let Some(inline_root) = self.inline_root_ancestor() else {
                return crate::util::Point { x, y };
            };
            if inline_root.is_offset_parent() && !inline_root.is_static_body() {
                let border = inline_root.final_layout().border;
                return crate::util::Point {
                    x: x - border.left,
                    y: y - border.top,
                };
            }
            current = inline_root;
        }

        loop {
            let layout = current.final_layout();
            x += layout.location.x;
            y += layout.location.y;

            let Some(parent_id) = current.containing_block() else {
                break;
            };
            let parent = self.with(parent_id);
            if parent.is_offset_parent() && !parent.is_static_body() {
                let border = parent.final_layout().border;
                x -= border.left;
                y -= border.top;
                break;
            }
            current = parent;
        }
        crate::util::Point { x, y }
    }

    /// CSSOM View's `clientWidth`: the width of the padding box (border box minus
    /// borders and scrollbar)
    pub fn client_width(&self) -> f32 {
        let layout = self.final_layout();
        layout.size.width - layout.border.left - layout.border.right - layout.scrollbar_size.width
    }

    /// CSSOM View's `clientHeight`: the height of the padding box (border box minus
    /// borders and scrollbar)
    pub fn client_height(&self) -> f32 {
        let layout = self.final_layout();
        layout.size.height - layout.border.top - layout.border.bottom - layout.scrollbar_size.height
    }

    /// CSSOM View's `scrollWidth`: the width of the node's content, including
    /// content not visible due to overflow
    pub fn scroll_width(&self) -> f32 {
        self.client_width()
            .max(self.final_layout().scrollable_overflow_rect.right)
    }

    /// CSSOM View's `scrollHeight`: the height of the node's content, including
    /// content not visible due to overflow
    pub fn scroll_height(&self) -> f32 {
        self.client_height()
            .max(self.final_layout().scrollable_overflow_rect.bottom)
    }

    /// Does the node generate any boxes? (e.g. `getClientRects()` returns an empty
    /// list for boxless nodes, such as `display: none`, `display: contents`, or
    /// detached elements)
    pub fn has_boxes(&self) -> bool {
        self.flags.is_in_document()
            && !self.display_style().is_some_and(|display| {
                matches!(
                    display.inside(),
                    style::values::specified::box_::DisplayInside::None
                        | style::values::specified::box_::DisplayInside::Contents
                )
            })
    }

    /// Creates a synthetic click event
    pub fn synthetic_click_event(&self, mods: Modifiers) -> DomEventData {
        DomEventData::Click(self.synthetic_click_event_data(mods))
    }

    pub fn synthetic_click_event_data(&self, mods: Modifiers) -> ApacePointerEvent {
        let absolute_position = self.absolute_position(0.0, 0.0);
        let x = absolute_position.x + (self.final_layout().size.width / 2.0);
        let y = absolute_position.y + (self.final_layout().size.height / 2.0);

        ApacePointerEvent {
            id: ApacePointerId::Mouse,
            is_primary: true,
            coords: PointerCoords {
                page_x: x,
                page_y: y,

                // TODO: should these be different?
                screen_x: x,
                screen_y: y,
                client_x: x,
                client_y: y,
            },
            mods,
            button: Default::default(),
            buttons: Default::default(),
            details: Default::default(),
            element: Default::default(),
            active_pointers: Default::default(),
        }
    }
}

/// It might be wrong to expose this since what does *equality* mean outside the dom?
impl PartialEq for Node {
    fn eq(&self, other: &Self) -> bool {
        self.id == other.id
    }
}

impl Eq for Node {}

impl std::fmt::Debug for Node {
    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
        // FIXME: update to reflect changes to fields
        f.debug_struct("NodeData")
            .field("parent", &self.parent)
            .field("id", &self.id)
            .field("is_inline_root", &self.flags.is_inline_root())
            .field("children", &self.children)
            .field("layout_children", &self.layout_children.borrow())
            // .field("style", &self.style)
            .field("node", &self.data)
            .field("stylo_element_data", &self.try_stylo_element_data())
            // .field("unrounded_layout", &self.unrounded_layout)
            // .field("final_layout", &self.final_layout)
            .finish()
    }
}

#[cfg(test)]
mod test {
    use style_dom::ElementState;

    use crate::{Attribute, BaseDocument, DocumentConfig, ElementData, NodeData, qual_name};

    #[test]
    fn create_node_with_disabled_attr() {
        let mut document = BaseDocument::new(DocumentConfig::default());
        let node = document.create_node(NodeData::Element(Box::new(ElementData::new(
            qual_name!("button"),
            vec![Attribute {
                name: qual_name!("disabled"),
                value: "".into(),
            }],
        ))));
        let node = document.get_node(node).unwrap();

        assert!(
            node.element_state().contains(ElementState::DISABLED),
            "form node is disabled"
        );
        assert!(
            !node.element_state().contains(ElementState::ENABLED),
            "form node is not enabled"
        );
    }

    #[test]
    fn ignore_disabled_attr_content() {
        let mut document = BaseDocument::new(DocumentConfig::default());
        let node = document.create_node(NodeData::Element(Box::new(ElementData::new(
            qual_name!("button"),
            vec![Attribute {
                name: qual_name!("disabled"),
                value: "false".into(),
            }],
        ))));
        let node = document.get_node(node).unwrap();

        assert!(
            node.element_state().contains(ElementState::DISABLED),
            "form node is disabled"
        );
        assert!(
            !node.element_state().contains(ElementState::ENABLED),
            "form node is not enabled"
        );
    }

    #[test]
    fn create_node_with_ignored_disable() {
        let mut document = BaseDocument::new(DocumentConfig::default());
        let node = document.create_node(NodeData::Element(Box::new(ElementData::new(
            qual_name!("a"),
            vec![Attribute {
                name: qual_name!("disabled"),
                value: "".into(),
            }],
        ))));
        let node = document.get_node(node).unwrap();

        assert!(
            !node.element_state().contains(ElementState::DISABLED),
            "Non form node cannot be disabled"
        );
        assert!(
            !node.element_state().contains(ElementState::ENABLED),
            "Non form node cannot be enabled"
        );
    }

    #[test]
    fn create_empty_enabled_node() {
        let mut document = BaseDocument::new(DocumentConfig::default());
        let node = document.create_node(NodeData::Element(Box::new(ElementData::new(
            qual_name!("button"),
            vec![],
        ))));
        let node = document.get_node(node).unwrap();

        assert!(
            node.element_state().contains(ElementState::ENABLED),
            "Button should be enabled by default"
        );
    }
}