Skip to main content

inspect-elements

Map a visible 5chan DOM node to its React source when file or component attribution is needed.

소스 정보

저장소
bitsocialnet/5chan
최근 소스 활동
2026년 9월 14일 14:50
감지된 SKILL.md 언어
영어
스타
133
포크
15

설치 방법

기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.

소스 파일 검토

설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.

파일 탐색기
2 개 파일

SKILL.md 표시 중

SKILL.md
소스 지침 · 읽기 전용 미리보기
name
inspect-elements
description
Map a visible 5chan DOM node to its React source when file or component attribution is needed.
# Inspect Elements For human visual feedback, the development build includes [Agentation](https://github.com/benjitaylor/agentation). Activate its toolbar, select elements, add notes, and copy the resulting selectors and context into the task. Inspect the referenced code before changing it. The toolbar is suppressed when `window.__PROFILING__` is set before navigation and is absent from production builds. Map the requested live DOM node to source using the dev-only `window.__ELEMENT_SOURCE__` helper. Use an existing compatible dev server in this worktree or record ownership of one started for the task; production does not expose the helper. Reuse a compatible session supplied by the calling task when it already owns the browser slot; use its exact name and leave its lifecycle with that caller. Otherwise open an owned session through `./scripts/pw-session.sh`. Use `-s=<session>` on every command. The examples use `inspect`; substitute the actual name and URL, and skip `open` when reusing a session: ```bash ./scripts/pw-session.sh open inspect https://5chan.localhost/#/all playwright-cli -s=inspect eval "window.__ELEMENT_SOURCE__?.ready ?? false" playwright-cli -s=inspect snapshot playwright-cli -s=inspect eval "async el => JSON.stringify(await window.__ELEMENT_SOURCE__.resolve(el))" e7 ``` Choose `e7` from the current snapshot; do not reuse a stale ref. If the helper is not ready, check `window.__ELEMENT_SOURCE__?.error` and allow its dev import to complete. Report persistent errors or missing helpers instead of guessing an attribution. The result's `source`, `componentName`, and `stack` identify the node's file/line and React ownership. Inspect the source before editing; an attributed file is a starting point, not proof that it causes the reported behavior. For a compact trace, use `window.__ELEMENT_SOURCE__.formatStack(info.stack, 5)` on a resolved result. When a snapshot ref is impractical, use `resolveBySelector(selector)` for a precise selector or `resolveAtPoint(x, y)` for viewport coordinates. If `source` is null, inspect useful stack frames or a nearby parent. Report an unresolved node when both are empty. Close the exact session in cleanup only when this inspection opened it, including on resolution failure. Leave a caller-owned session open for the caller to continue and close: ```bash ./scripts/pw-session.sh close inspect ``` For a new session, a slot owned by another task is a reason to wait or use the wrapper's bounded wait, never to bypass the lock. Do not wait on the calling task's own session; reuse it as described above. Stop only a server this task started. Use the `playwright-cli` skill for session operations and `profile-browsing` only when performance measurement is part of the request.
GitHub에서 보기