@forge-kit/plugin-source-map-prase 0.0.2 → 0.0.4

package/src/components/trace-chain/index.less

@@ -1,130 +1,129 @@
 .trace-panel-card {
-  flex: 1;
-
-  .trace-chain-root {
+  .trace-panel-content {
     flex: 1;
-    min-height: 0;
-    height: 100%;
     overflow: auto;
-    padding: 4px;
-
-    .trace-chain-item {
-      margin-bottom: 10px;
 
-      &[data-dragging="true"] {
-        opacity: 0.85;
+    .trace-chain-root {
+      flex: 1;
+      min-height: 0;
+      height: 100%;
+      overflow: auto;
+      padding: 4px;
+
+      .trace-chain-empty {
+        min-height: 180px;
+        border: 1px dashed var(--gray-6);
+        border-radius: var(--radius-3);
+        color: var(--gray-11);
+        font-size: 13px;
       }
-    }
-
-    .trace-chain-empty {
-      min-height: 180px;
-      border: 1px dashed var(--gray-6);
-      border-radius: var(--radius-3);
-      color: var(--gray-11);
-      font-size: 13px;
-    }
-
-    .trace-chain-node {
-      padding: 10px;
-      border-radius: var(--radius-3);
-      border: 1px solid var(--gray-6);
-      background: linear-gradient(160deg, color-mix(in srgb, var(--gray-3) 90%, transparent), color-mix(in srgb, var(--gray-2) 90%, transparent));
-    }
 
-    .trace-chain-drag-handle {
-      min-width: 46px;
-      height: 24px;
-      border-radius: 999px;
-      border: 1px solid var(--gray-7);
-      background: var(--gray-4);
-      color: var(--gray-12);
-      font-size: 12px;
-      font-weight: 600;
-      user-select: none;
-      cursor: grab;
-
-      &:active {
-        cursor: grabbing;
+      .trace-chain-item {
+        margin-bottom: 10px;
+
+        &[data-dragging="true"] {
+          opacity: 0.85;
+        }
+
+        .trace-chain-node {
+          padding: 10px;
+          border-radius: var(--radius-3);
+          border: 1px solid var(--gray-6);
+          background: linear-gradient(160deg, color-mix(in srgb, var(--gray-3) 90%, transparent), color-mix(in srgb, var(--gray-2) 90%, transparent));
+
+          .trace-chain-drag-handle {
+            min-width: 46px;
+            height: 24px;
+            border-radius: 999px;
+            border: 1px solid var(--gray-7);
+            background: var(--gray-4);
+            color: var(--gray-12);
+            font-size: 12px;
+            font-weight: 600;
+            user-select: none;
+            cursor: grab;
+
+            &:active {
+              cursor: grabbing;
+            }
+          }
+
+          .trace-chain-content {
+            overflow: hidden;
+            width: 100%;
+
+            .trace-chain-header {
+              width: 100%;
+
+              .trace-chain-main-title {
+                display: block;
+                font-size: 13px;
+                font-weight: 700;
+                color: var(--gray-12);
+                line-height: 1.35;
+                word-break: break-all;
+                user-select: text;
+                cursor: text;
+              }
+            }
+
+            .trace-chain-row {
+              display: grid;
+              grid-template-columns: 34px minmax(0, 1fr);
+              gap: 6px;
+              padding: 2px 0;
+
+              &[data-row-type="output"] {
+                margin-top: 2px;
+                padding-top: 8px;
+                border-top: 1px dashed color-mix(in srgb, var(--gray-6) 78%, transparent);
+              }
+
+              .trace-chain-label {
+                min-width: 30px;
+                font-size: 12px;
+                color: var(--gray-10);
+                user-select: none;
+                margin-top: 1px;
+              }
+
+              .trace-chain-detail {
+                min-width: 0;
+
+                .trace-chain-file {
+                  font-size: 13px;
+                  font-weight: 600;
+                  color: var(--gray-12);
+                  white-space: normal;
+                  overflow-wrap: anywhere;
+                  word-break: break-all;
+                  user-select: text;
+                  cursor: text;
+                }
+
+                .trace-chain-position {
+                  font-size: 12px;
+                  color: var(--gray-11);
+                  white-space: normal;
+                  overflow-wrap: anywhere;
+                  user-select: text;
+                  cursor: text;
+                }
+              }
+            }
+
+            .trace-chain-error {
+              font-size: 12px;
+              color: #ff7b7b;
+            }
+
+            .trace-chain-pending {
+              font-size: 12px;
+              color: var(--gray-10);
+            }
+          }
+        }
       }
     }
-
-    .trace-chain-content {
-      overflow: hidden;
-      width: 100%;
-    }
-
-    .trace-chain-main-title {
-      display: block;
-      font-size: 13px;
-      font-weight: 700;
-      color: var(--gray-12);
-      line-height: 1.35;
-      word-break: break-all;
-      user-select: text;
-      cursor: text;
-    }
-
-    .trace-chain-header {
-      width: 100%;
-    }
-
-    .trace-chain-row {
-      display: grid;
-      grid-template-columns: 34px minmax(0, 1fr);
-      gap: 6px;
-      padding: 2px 0;
-    }
-
-    .trace-chain-row[data-row-type="output"] {
-      margin-top: 2px;
-      padding-top: 8px;
-      border-top: 1px dashed color-mix(in srgb, var(--gray-6) 78%, transparent);
-    }
-
-    .trace-chain-label {
-      min-width: 30px;
-      font-size: 12px;
-      color: var(--gray-10);
-      user-select: none;
-      margin-top: 1px;
-    }
-
-    .trace-chain-detail {
-      min-width: 0;
-    }
-
-    .trace-chain-output-head {
-    }
-
-    .trace-chain-file {
-      font-size: 13px;
-      font-weight: 600;
-      color: var(--gray-12);
-      white-space: normal;
-      overflow-wrap: anywhere;
-      word-break: break-all;
-      user-select: text;
-      cursor: text;
-    }
-
-    .trace-chain-position {
-      font-size: 12px;
-      color: var(--gray-11);
-      white-space: normal;
-      overflow-wrap: anywhere;
-      user-select: text;
-      cursor: text;
-    }
-
-    .trace-chain-error {
-      font-size: 12px;
-      color: #ff7b7b;
-    }
-
-    .trace-chain-pending {
-      font-size: 12px;
-      color: var(--gray-10);
-    }
-
   }
 }

package/src/components/trace-chain/index.tsx

@@ -5,6 +5,7 @@ import {SortableContext, arrayMove, useSortable, verticalListSortingStrategy} fr
 import {CSS} from "@dnd-kit/utilities";
 import {PanelCard} from "@/components/panel-card";
 import "./index.less";
+import classNames from "classnames";
 
 interface TraceChainNode {
     fileName: string
@@ -74,7 +75,8 @@ const SortableTraceChainItem: React.FC<SortableTraceChainItemProps> = (props) =>
     return (
         <Box ref={setNodeRef} style={style} className="trace-chain-item" data-dragging={isDragging ? "true" : "false"}>
             <Flex className="trace-chain-node" gap="2">
-                <Flex className="trace-chain-drag-handle" align="center" justify="center" {...attributes} {...listeners}>#{index + 1}</Flex>
+                <Flex className="trace-chain-drag-handle" align="center"
+                      justify="center" {...attributes} {...listeners}>#{index + 1}</Flex>
                 <Flex className="trace-chain-content" direction="column" gap="2">
                     <Flex className="trace-chain-header" justify="between" align="start" gap="2">
                         <Text className="trace-chain-main-title">{slot.mapFileName || "(未命名 map 文件)"}</Text>
@@ -125,20 +127,20 @@ export const TraceChain: React.FC<TraceChainProps> = (props) => {
     }
 
     return (
-        <PanelCard title="TRACE CHAIN" className="trace-panel-card">
+        <PanelCard title="TRACE CHAIN" className={classNames('trace-panel-card', className)}>
             <Flex className="trace-panel-content">
                 {Boolean(!slots.length) && (
-                    <Box className={className || "trace-chain-root"}>
-                        <Flex className="trace-chain-empty" align="center" justify="center">暂无解析链路，上传 map
-                            并点击“解析链路”。</Flex>
+                    <Box className="trace-chain-root">
+                        <Flex className="trace-chain-empty" align="center" justify="center">暂无解析链路，上传 map 并点击“解析链路”。</Flex>
                     </Box>
                 )}
                 {Boolean(slots.length) && (
                     <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={handleDragEnd}>
                         <SortableContext items={slots.map((item) => item.id)} strategy={verticalListSortingStrategy}>
-                            <Box className={className || "trace-chain-root"}>
+                            <Box className="trace-chain-root">
                                 {slots.map((slot, index) => {
-                                    return <SortableTraceChainItem key={slot.id} slot={slot} hop={data[index]} index={index} onDelete={onDelete}/>
+                                    return <SortableTraceChainItem key={slot.id} slot={slot} hop={data[index]}
+                                                                   index={index} onDelete={onDelete}/>
                                 })}
                             </Box>
                         </SortableContext>

package/src/main.tsx

@@ -1,6 +1,6 @@
 import {StrictMode} from 'react'
 import ReactDOM from "react-dom/client";
-import {definePlugin} from '@forge-kit/types'
+import {definePlugin} from '@forge-kit/helper'
 import {App} from '@/App.tsx'
 
 let rootInstance: ReturnType<typeof ReactDOM.createRoot> | null = null;

package/src/node/index.ts

@@ -0,0 +1,6 @@
+import {defineInvokeMethod, registerInvokeMethod} from "@forge-kit/helper";
+import {getSourceSnippet, profileResolveTracePhases, resolveTrace} from "./trace/resolve";
+
+const invokeMethod = defineInvokeMethod({resolveTrace, getSourceSnippet, profileResolveTracePhases})
+
+registerInvokeMethod(invokeMethod)

package/src/{utils/source-map → node/trace/core}/base/registry.ts

@@ -1,19 +1,23 @@
 import type {SourceMapRecord, SourceMapRegistry} from "./types";
 import {getBaseName, normalizePath} from "./path";
 
-export const registerSourceMap = (registry: SourceMapRegistry, key: string, sourceMapRecord: SourceMapRecord) => {
+interface RegisterSourceMapInput {
+    registry: SourceMapRegistry
+    key: string
+    sourceMapRecord: SourceMapRecord
+}
+
+export const registerSourceMap = (input: RegisterSourceMapInput) => {
+    const {registry, key, sourceMapRecord} = input
     const normalized = normalizePath(key)
+
     if (!normalized) return registry
 
-    const nextRegistry: SourceMapRegistry = {
-        ...registry,
-        [normalized]: sourceMapRecord,
-    }
+    const nextRegistry: SourceMapRegistry = {...registry, [normalized]: sourceMapRecord}
 
     const baseName = getBaseName(normalized)
-    if (!nextRegistry[baseName]) {
-        nextRegistry[baseName] = sourceMapRecord
-    }
+
+    if (!nextRegistry[baseName]) nextRegistry[baseName] = sourceMapRecord
 
     return nextRegistry
 }
@@ -21,9 +25,8 @@ export const registerSourceMap = (registry: SourceMapRegistry, key: string, sour
 export const listSourceMapRecords = (sourceMaps: SourceMapRegistry): SourceMapRecord[] => {
     const map = new Map<string, SourceMapRecord>()
     Object.values(sourceMaps).forEach((record) => {
-        if (!map.has(record.mapFileName)) {
-            map.set(record.mapFileName, record)
-        }
+        if (map.has(record.mapFileName)) return
+        map.set(record.mapFileName, record)
     })
     return Array.from(map.values())
 }

package/src/{utils/source-map → node/trace/core}/base/types.ts

@@ -30,6 +30,7 @@ export interface ResolvedSourceMeta {
 export interface ChainMapSlot {
     id: string
     mapFileName: string
+    mapFilePath?: string
     sourceMapRecord?: SourceMapRecord
     error?: string
 }

package/src/node/trace/core/domain/chain-slots.ts

@@ -0,0 +1,33 @@
+import {normalizePath, stripMapExt} from "../base/path";
+import {registerSourceMap} from "../base/registry";
+import type {ChainMapSlot, SourceMapRegistry} from "../base/types";
+
+export const buildRegistryFromChainSlots = (slots: ChainMapSlot[]) => {
+    let registry: SourceMapRegistry = {}
+    const orderedMapFileNames: string[] = []
+
+    slots.forEach((slot) => {
+        const {sourceMapRecord: record} = slot
+        if (!record) return
+
+        orderedMapFileNames.push(record.mapFileName)
+        registry = registerSourceMap({registry, key: record.mapFileName, sourceMapRecord: record})
+        registry = registerSourceMap({registry, key: stripMapExt(record.mapFileName), sourceMapRecord: record})
+
+        if (record.rawSourceMap.file) {
+            registry = registerSourceMap({registry, key: record.rawSourceMap.file, sourceMapRecord: record})
+        }
+    })
+
+    return {registry, orderedMapFileNames}
+}
+
+export const getAutoEntryFileNameFromSlots = (slots: ChainMapSlot[]) => {
+    const firstValidSlot = slots.find((slot) => slot.sourceMapRecord)
+    if (!firstValidSlot?.sourceMapRecord) return ""
+
+    const mappedFile = firstValidSlot.sourceMapRecord.rawSourceMap.file
+    if (mappedFile) return normalizePath(mappedFile)
+
+    return stripMapExt(firstValidSlot.sourceMapRecord.mapFileName)
+}

package/src/{utils/source-map → node/trace/core}/domain/source-content.ts

@@ -9,6 +9,11 @@ interface SourceCodeMatch {
     location: TraceLocation
 }
 
+interface ResolveSourceCodeOptions {
+    onlyLastMap?: boolean
+    lastMapFileName?: string
+}
+
 const findSourceCodeMatch = (hop: TraceHop, sourceMapRecord: SourceMapRecord): SourceCodeMatch | null => {
     if (!hop.output) return null
 
@@ -42,14 +47,22 @@ const findSourceCodeMatch = (hop: TraceHop, sourceMapRecord: SourceMapRecord): S
     }
 }
 
-export const resolveSourceCodeFromTrace = (traceHops: TraceHop[], sourceMaps: SourceMapRegistry) => {
+export const resolveSourceCodeFromTrace = (
+    traceHops: TraceHop[],
+    sourceMaps: SourceMapRegistry,
+    options: ResolveSourceCodeOptions = {},
+) => {
     const sourceMapRecords = listSourceMapRecords(sourceMaps)
+    const sourceMapRecordByName = new Map(sourceMapRecords.map((record) => [record.mapFileName, record] as const))
+    const {onlyLastMap = false, lastMapFileName} = options
 
     for (let index = traceHops.length - 1; index >= 0; index--) {
         const hop = traceHops[index]
         if (!hop.output || !hop.mapFileName) continue
+        // 仅允许链路最后一个 map 返回 sourcesContent，控制传输体积和性能开销。
+        if (onlyLastMap && lastMapFileName && hop.mapFileName !== lastMapFileName) continue
 
-        const sourceMapRecord = sourceMapRecords.find((item) => item.mapFileName === hop.mapFileName)
+        const sourceMapRecord = sourceMapRecordByName.get(hop.mapFileName)
         if (!sourceMapRecord) continue
 
         const match = findSourceCodeMatch(hop, sourceMapRecord)

package/src/node/trace/core/domain/trace-resolver.ts

@@ -0,0 +1,179 @@
+import {SourceMapConsumer, type RawSourceMap} from "source-map-js";
+import {MAX_TRACE_DEPTH} from "../base/constants";
+import {getSourceMapByFileName, getSourceMapByMapFileName} from "../base/registry";
+import type {ResolveTraceOptions, SourceMapRecord, SourceMapRegistry, TraceHop, TraceLocation} from "../base/types";
+
+interface ResolvedTraceHop extends TraceHop {
+    output: TraceLocation
+}
+
+const toLocationCursor = (location: TraceLocation) => {
+    return `${location.fileName}:${location.lineNumber}:${location.columnNumber}`
+}
+
+const isSameLocation = (left: TraceLocation, right: TraceLocation) => {
+    return (
+        left.fileName === right.fileName
+        && left.lineNumber === right.lineNumber
+        && left.columnNumber === right.columnNumber
+    )
+}
+
+const resolveOriginalLocation = (
+    rawSourceMap: RawSourceMap,
+    position: { line: number; column: number },
+): TraceLocation | null => {
+    const consumer = new SourceMapConsumer(rawSourceMap)
+
+    try {
+        // 回退策略：
+        // 1) 优先按目标列号查询；
+        // 2) 再回退到列号 0 的行级查询；
+        // 同时组合 GLB/LUB 两种 bias，提高稀疏映射和压缩代码场景下的命中率。
+        const attempts = [
+            {line: position.line, column: position.column, bias: SourceMapConsumer.GREATEST_LOWER_BOUND},
+            {line: position.line, column: 0, bias: SourceMapConsumer.GREATEST_LOWER_BOUND},
+            {line: position.line, column: position.column, bias: SourceMapConsumer.LEAST_UPPER_BOUND},
+            {line: position.line, column: 0, bias: SourceMapConsumer.LEAST_UPPER_BOUND},
+        ]
+
+        for (const attempt of attempts) {
+            const found = consumer.originalPositionFor(attempt)
+            if (found.source && found.line != null && found.column != null) {
+                return {
+                    fileName: found.source,
+                    lineNumber: found.line,
+                    columnNumber: found.column,
+                }
+            }
+        }
+    } finally {
+        const maybeDestroy = (consumer as { destroy?: () => void }).destroy
+        maybeDestroy?.()
+    }
+
+    return null
+}
+
+const resolveHopFromRecord = (sourceMapRecord: SourceMapRecord, input: TraceLocation): ResolvedTraceHop | null => {
+    try {
+        const {lineNumber: line, columnNumber: column} = input
+        const output = resolveOriginalLocation(sourceMapRecord.rawSourceMap, {line, column})
+        if (!output) return null
+        return {input, output, mapFileName: sourceMapRecord.mapFileName}
+    } catch {
+        return null
+    }
+}
+
+interface AppendUnresolvedHopInput {
+    traceHops: TraceHop[]
+    input: TraceLocation
+    mapFileName?: string
+}
+
+const appendUnresolvedHop = (input: AppendUnresolvedHopInput) => {
+    const {traceHops, input: location, mapFileName} = input
+    traceHops.push({input: location, mapFileName})
+}
+
+interface ResolveTraceWithOrderedMapsInput {
+    entry: TraceLocation
+    sourceMaps: SourceMapRegistry
+    orderedMapFileNames: string[]
+    maxDepth: number
+}
+
+const resolveTraceWithOrderedMaps = (input: ResolveTraceWithOrderedMapsInput) => {
+    const {entry, sourceMaps, orderedMapFileNames, maxDepth} = input
+    const traceHops: TraceHop[] = []
+    const visited = new Set<string>()
+    let current = entry
+
+    for (let depth = 0; depth < orderedMapFileNames.length && depth < maxDepth; depth++) {
+        const mapFileName = orderedMapFileNames[depth]
+        const cursor = toLocationCursor(current)
+
+        if (visited.has(cursor)) {
+            appendUnresolvedHop({traceHops, input: current, mapFileName})
+            continue
+        }
+        visited.add(cursor)
+
+        const sourceMapRecord = getSourceMapByMapFileName(sourceMaps, mapFileName)
+        if (!sourceMapRecord) {
+            appendUnresolvedHop({traceHops, input: current, mapFileName})
+            continue
+        }
+
+        const hop = resolveHopFromRecord(sourceMapRecord, current)
+        if (!hop) {
+            appendUnresolvedHop({traceHops, input: current, mapFileName: sourceMapRecord.mapFileName})
+            continue
+        }
+
+        traceHops.push(hop)
+        current = hop.output
+    }
+
+    return traceHops
+}
+
+interface ResolveTraceByFileLookupInput {
+    entry: TraceLocation
+    sourceMaps: SourceMapRegistry
+    maxDepth: number
+}
+
+const resolveTraceByFileLookup = (input: ResolveTraceByFileLookupInput) => {
+    const {entry, sourceMaps, maxDepth} = input
+    const traceHops: TraceHop[] = []
+    const visited = new Set<string>()
+    let current = entry
+
+    for (let depth = 0; depth < maxDepth; depth++) {
+        const cursor = toLocationCursor(current)
+
+        if (visited.has(cursor)) {
+            appendUnresolvedHop({traceHops, input: current})
+            break
+        }
+        visited.add(cursor)
+
+        const sourceMapRecord = getSourceMapByFileName(sourceMaps, current.fileName)
+        if (!sourceMapRecord) {
+            if (traceHops.length === 0) appendUnresolvedHop({traceHops, input: current})
+            break
+        }
+
+        const hop = resolveHopFromRecord(sourceMapRecord, current)
+        if (!hop) {
+            appendUnresolvedHop({traceHops, input: current, mapFileName: sourceMapRecord.mapFileName})
+            break
+        }
+
+        traceHops.push(hop)
+
+        if (isSameLocation(hop.output, current)) break
+
+        current = hop.output
+    }
+
+    return traceHops
+}
+
+interface ResolveTraceBySourceMapsInput {
+    entry: TraceLocation
+    sourceMaps: SourceMapRegistry
+    orderedMapFileNames?: string[]
+    options?: ResolveTraceOptions
+}
+
+export const resolveTraceBySourceMaps = async (input: ResolveTraceBySourceMapsInput): Promise<TraceHop[]> => {
+    const {entry, sourceMaps, orderedMapFileNames = [], options = {}} = input
+    const maxDepth = options.maxDepth ?? MAX_TRACE_DEPTH
+
+    if (orderedMapFileNames.length > 0) return resolveTraceWithOrderedMaps({entry, sourceMaps, orderedMapFileNames, maxDepth})
+
+    return resolveTraceByFileLookup({entry, sourceMaps, maxDepth})
+}

package/src/node/trace/core/domain/view-model.ts

@@ -0,0 +1,57 @@
+import {DEFAULT_CONTEXT_LINE_RADIUS} from "../base/constants";
+import type {TraceLocation} from "../base/types";
+
+export const toDisplayLocation = (location: TraceLocation): TraceLocation => ({...location})
+
+const MAX_EXCERPT_CHARS = 12000
+const COLUMN_WINDOW_CHARS = 4000
+
+const truncateLineByColumn = (line: string, targetColumn = 0) => {
+    if (line.length <= MAX_EXCERPT_CHARS) return line
+    const halfWindow = Math.floor(COLUMN_WINDOW_CHARS / 2)
+    const start = Math.max(0, targetColumn - halfWindow)
+    const end = Math.min(line.length, start + COLUMN_WINDOW_CHARS)
+    const head = start > 0 ? "…[truncated]…" : ""
+    const tail = end < line.length ? "…[truncated]…" : ""
+    return `${head}${line.slice(start, end)}${tail}`
+}
+
+const truncateExcerpt = (code: string) => {
+    if (code.length <= MAX_EXCERPT_CHARS) return code
+    return `${code.slice(0, MAX_EXCERPT_CHARS)}\n...[truncated ${code.length - MAX_EXCERPT_CHARS} chars]...`
+}
+
+interface CreateCodeExcerptInput {
+    fullCode: string
+    targetLine: number
+    radius?: number
+    targetColumn?: number
+}
+
+export const createCodeExcerpt = (input: CreateCodeExcerptInput) => {
+    const {
+        fullCode,
+        targetLine,
+        radius = DEFAULT_CONTEXT_LINE_RADIUS,
+        targetColumn = 0,
+    } = input
+    const lines = fullCode.split(/\r?\n/)
+    if (lines.length === 0) {
+        return {code: truncateExcerpt(fullCode), highlightLine: targetLine}
+    }
+
+    const safeTarget = Math.min(Math.max(targetLine, 1), lines.length)
+
+    // 压缩后的单行源码可能非常大，仅截取目标列附近窗口。
+    if (lines.length === 1) {
+        return {code: truncateLineByColumn(lines[0], targetColumn), highlightLine: 1}
+    }
+
+    const start = Math.max(1, safeTarget - radius)
+    const end = Math.min(lines.length, safeTarget + radius)
+
+    return {
+        code: truncateExcerpt(lines.slice(start - 1, end).join("\n")),
+        highlightLine: safeTarget - start + 1,
+    }
+}