›_ Claude Code Issues
Claude Code Issues / #61161

launch-selected-element: include the page URL (and ideally route + query) for context

Resolved 💬 1 comment Opened May 21, 2026 by cloverink Closed Jun 20, 2026

Problem

When I pick an element from the browser via the Launch with Claude flow, the agent receives a rich payload — tag, classes, React component name, HTML, siblings, screenshot — but no URL of the page the element came from.

For any non-trivial debugging that touches data flow (an empty state, an API error, a wrong response shape), the URL is the single most useful piece of context, and right now I have to type or paste it back manually every single time.

Example of what arrives today (trimmed):

<launch-selected-element>
<element tag="div" has-screenshot="true" class="flex flex-col items-center ...">
  <text>"Something went wrong\n\nFailed to load data..."</text>
  <path>div.mx-auto > div > div.px-7 > div.max-w-[1280px]</path>
  <react component="QueryErrorState (in RewardInsights > DetailChrome > ...)" props={...} />
  <html>...</html>
  <siblings>...</siblings>
</element>
</launch-selected-element>

There is <path> (DOM ancestor selectors) and React component breadcrumbs, but no window.location.href.

Why this is painful

  1. Route-driven bugs are blind. If the bug is "the Insights tab on /workspaces/:wsId/rewards/:publicId?tab=insights shows an error", I need both :wsId and :publicId to query the DB, hit the API, or repro locally. The element payload tells me the component but not which workspace/reward.
  2. Multi-app monorepos lose context. With www / panel / admin on different ports (4000 / 4001 / 4002), even knowing which app the bug is in is information I currently have to ask for.
  3. Query params drive UI state. ?tab=insights, ?view=…, ?q=… etc. determine what is rendered. The element snapshot is meaningless without them.
  4. Auth context. A protected route vs a public route changes the debug path entirely — the URL tells me that at a glance.

What would solve it

Add a <url> (or <location>) child to the <launch-selected-element> payload:

<launch-selected-element>
  <url
    href="http://localhost:4000/workspaces/wsp_abc/rewards/rwd_xyz?tab=insights"
    origin="http://localhost:4000"
    pathname="/workspaces/wsp_abc/rewards/rwd_xyz"
    search="?tab=insights"
  />
  <element ...>...</element>
</launch-selected-element>

Minimum viable: just href. Nicer: split fields so the agent doesn't have to parse.

Bonus (lower priority)

For SPAs, the matched route pattern would be 🔥:

<url ... routePattern="/workspaces/:workspaceId/rewards/:publicId" />

This is harder (needs router introspection — React Router useMatches(), TanStack Router, etc.), so just href first is fine.

Privacy note

The URL is already visible to the user in their address bar at the moment they invoke the action, so sharing it with the agent they explicitly invoked should not be a privacy regression. If anything, tokens or sensitive query params could be redacted before sending (e.g. ?access_token=… → ?access_token=[REDACTED]) — happy to file a follow-up if that's preferred.

Repro

Any page. Pick any element with the Launch with Claude action. Observe that the payload does not contain window.location.href.

Environment

  • Claude Code with browser extension (Launch with Claude / select-element flow)
  • Tested on Vite + React 19 SPA, but issue is framework-agnostic — it's about the payload shape

Thank you 🙏 — this would make in-app debugging dramatically faster.

View original on GitHub ↗

This issue has 1 comment on GitHub. Read the full discussion on GitHub ↗