程序员阿江(Relakkes) 19116cb4d9 feat(desktop): add element metadata builder
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-31 17:40:45 +08:00

26 lines
1.2 KiB
TypeScript

import { buildSelector, buildNthPath } from './selector'
export type ElementMetadata = {
selector: string; nthPath: string; tag: string; id?: string; classes: string[]
text?: string; boundingBox: { x: number; y: number; w: number; h: number }
computedStyles: Record<string, string>; outerHtmlSnippet?: string
}
const STYLE_KEYS = ['color', 'backgroundColor', 'opacity', 'fontFamily', 'fontSize', 'fontWeight', 'textAlign', 'padding', 'margin'] as const
export function buildElementMetadata(el: Element): ElementMetadata {
const cs = window.getComputedStyle(el)
const styles: Record<string, string> = {}
for (const k of STYLE_KEYS) styles[k] = (cs as unknown as Record<string, string>)[k] ?? ''
const r = el.getBoundingClientRect()
const sel = buildSelector(el)
return {
selector: sel, nthPath: buildNthPath(el), tag: el.tagName.toLowerCase(),
id: el.id || undefined, classes: Array.from(el.classList),
text: (el.textContent ?? '').trim().slice(0, 200) || undefined,
boundingBox: { x: r.x, y: r.y, w: r.width, h: r.height },
computedStyles: styles,
outerHtmlSnippet: sel.includes(':nth') ? el.outerHTML.slice(0, 300) : undefined,
}
}