Skip to content

inspect_element: smaller additions to consider #9

@HEnquist

Description

@HEnquist

A grab-bag of smaller, lower-priority inspect_element enhancements, grouped so they don't each need their own issue. Each is independent; pick off whatever's worth it. (See also the larger ones: #5 overflow, #6 occlusion, #7 effective visibility, #8 accessibility.)

  • Clipped-by-ancestor — distinct from inViewport: is the element cut off by an ancestor's overflow:hidden / scroll container, even though it's within the viewport? Report a flag (and optionally the clipping ancestor).
  • Pseudo-element contentgetComputedStyle(el, '::before' / '::after').content when set. Icons and generated text often live here and are otherwise invisible to the agent.
  • Short ancestor chain — a compact path like body > main > div#app > button.cta so the agent gets structural context without a full get_html.
  • Framework component name (experimental) — best-effort React component name via the fiber (and/or other frameworks). Leans into the "sees framework internals" angle, but it's fragile across versions, so treat as experimental/opt-in.

Implementation note

All of these live in inspectEl() in packages/core/src/commands.ts. Keep them curated/low-token and consistent with the existing payload. Update the doc-sync map in CLAUDE.md if the output shape changes.


Update (release/0.3, #10): the first three are implemented as clipped, pseudo, and path on the inspect_element payload. The framework component name is left for a separate experimental pass (fragile across versions, dev-mode/React-only).

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions