@jsenv/sourcemap 1.4.3 → 1.4.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/sourcemap",
-  "version": "1.4.3",
+  "version": "1.4.5",
   "type": "module",
   "repository": {
     "type": "git",
@@ -14,9 +14,10 @@
   },
   "dependencies": {
     "@jridgewell/gen-mapping": "0.3.13",
+    "@jridgewell/sourcemap-codec": "1.6.0",
     "@jridgewell/trace-mapping": "0.3.31",
     "@jsenv/urls": "2.9.10",
-    "magic-string": "1.0.0",
+    "magic-string": "1.2.3",
     "source-map-js": "1.2.1"
   },
   "publishConfig": {

package/src/magic_source.js

@@ -6,22 +6,31 @@ export const createMagicSource = (content) => {
   }
   const magicString = new MagicString(content);
   let touched = false;
+  // the edit list mirrors what magicString receives, in the coordinate
+  // space of the initial content: it lets a consumer holding a sourcemap
+  // for that initial content apply the edits as position shifts instead of
+  // composing with a generated map (see sourcemap_edits.js)
+  const edits = [];
 
   return {
     prepend: (string) => {
       touched = true;
+      edits.push({ type: "prepend", text: string });
       magicString.prepend(string);
     },
     append: (string) => {
       touched = true;
+      edits.push({ type: "append" });
       magicString.append(string);
     },
     replace: ({ start, end, replacement }) => {
       touched = true;
+      edits.push({ type: "replace", start, end, replacement });
       magicString.overwrite(start, end, replacement);
     },
     remove: ({ start, end }) => {
       touched = true;
+      edits.push({ type: "remove", start, end });
       magicString.remove(start, end);
     },
     toContentAndSourcemap: ({ source } = {}) => {
@@ -38,10 +47,17 @@ export const createMagicSource = (content) => {
       let map;
       return {
         content: code,
+        sourcemapEdits: { content, edits },
         get sourcemap() {
           if (map === undefined) {
+            // "boundary" = a mapping per word boundary. Per-character maps
+            // (hires: true) only add sub-word precision and cost ~25% of a
+            // package build in generation + composition + GC; line-level maps
+            // (hires: false) are cheaper still but collapse heavily rewritten
+            // lines (JSX) to their edit points. Word precision is what
+            // breakpoints, stack traces and devtools hovers actually consume.
             map = magicString.generateMap({
-              hires: true,
+              hires: "boundary",
               includeContent: true,
               source,
             });

package/src/main.js

@@ -1,7 +1,11 @@
 // tslint:disable:ordered-imports
 
 export { createMagicSource } from "./magic_source.js";
-export { composeTwoSourcemaps } from "./sourcemap_composition_v3.js";
+export {
+  composeSourcemaps,
+  composeTwoSourcemaps,
+} from "./sourcemap_composition_v3.js";
+export { applyContentEditsOnSourcemap } from "./sourcemap_edits.js";
 
 export { getOriginalPosition } from "./original_position.js";
 export { sourcemapConverter } from "./sourcemap_converter.js";

package/src/sourcemap_composition_v3.js

@@ -13,6 +13,7 @@
 import {
   addMapping,
   GenMapping,
+  toDecodedMap,
   toEncodedMap,
 } from "@jridgewell/gen-mapping";
 import {
@@ -21,6 +22,66 @@ import {
   TraceMap,
 } from "@jridgewell/trace-mapping";
 
+export const composeTwoSourcemaps = (firstSourcemap, secondSourcemap) => {
+  return composeSourcemaps([firstSourcemap, secondSourcemap]);
+};
+
+// A chain [A, B, C] where each map describes the content the next one was
+// generated from: A maps the oldest content back to the true source(s),
+// C maps the final content back to B's output. Composing pairwise left to
+// right is the correct semantic, but a standalone pairwise composition
+// encodes its result to VLQ mappings only for the next pair to decode them
+// again; here intermediate results stay decoded and encoding happens once,
+// on the last pair. Falsy entries are skipped (a step that produced no map).
+export const composeSourcemaps = (sourcemaps) => {
+  const maps = [];
+  for (const sourcemap of sourcemaps) {
+    if (sourcemap) {
+      maps.push(sourcemap);
+    }
+  }
+  if (maps.length === 0) {
+    return null;
+  }
+  if (maps.length === 1) {
+    return maps[0];
+  }
+  const headSourcemap = maps[0];
+  let traceMap = new TraceMap(headSourcemap);
+  let genMapping;
+  for (let i = 1; i < maps.length; i++) {
+    if (genMapping) {
+      // TraceMap accepts decoded mappings: no VLQ roundtrip between pairs
+      traceMap = new TraceMap(toDecodedMap(genMapping));
+    }
+    genMapping = composePairIntoGenMapping(traceMap, new TraceMap(maps[i]));
+  }
+  const encodedMap = toEncodedMap(genMapping);
+  const sourcemap = {
+    version: 3,
+    sources: [...encodedMap.sources],
+    names: [...encodedMap.names],
+    mappings: encodedMap.mappings,
+  };
+  // sourcesContent is taken from the head map: every source surviving the
+  // composition originates from it (a later map's "sources" describe
+  // intermediate contents, not true sources).
+  const sourcesContent = [];
+  const headSourcesContent = headSourcemap.sourcesContent;
+  sourcemap.sources.forEach((source) => {
+    if (headSourcesContent) {
+      const headSourceIndex = headSourcemap.sources.indexOf(source);
+      if (headSourceIndex > -1) {
+        sourcesContent.push(headSourcesContent[headSourceIndex]);
+        return;
+      }
+    }
+    sourcesContent.push(null);
+  });
+  sourcemap.sourcesContent = sourcesContent;
+  return sourcemap;
+};
+
 // "first" maps an intermediate content back to the true original source(s);
 // "second" maps the final content back to that same intermediate content
 // (its "original" positions live in the coordinate space "first" was
@@ -29,19 +90,8 @@ import {
 // don't share a single coordinate space, so naively adding both to the same
 // generator produces mappings that silently collide/override each other
 // wherever "second" happens to cover a position "first" also maps.
-export const composeTwoSourcemaps = (firstSourcemap, secondSourcemap) => {
-  if (!firstSourcemap && !secondSourcemap) {
-    return null;
-  }
-  if (!firstSourcemap) {
-    return secondSourcemap;
-  }
-  if (!secondSourcemap) {
-    return firstSourcemap;
-  }
+const composePairIntoGenMapping = (firstTraceMap, secondTraceMap) => {
   const genMapping = new GenMapping();
-  const firstTraceMap = new TraceMap(firstSourcemap);
-  const secondTraceMap = new TraceMap(secondSourcemap);
   eachMapping(
     secondTraceMap,
     ({
@@ -76,25 +126,5 @@ export const composeTwoSourcemaps = (firstSourcemap, secondSourcemap) => {
       });
     },
   );
-  const encodedMap = toEncodedMap(genMapping);
-  const sourcemap = {
-    version: 3,
-    sources: [...encodedMap.sources],
-    names: [...encodedMap.names],
-    mappings: encodedMap.mappings,
-  };
-  const sourcesContent = [];
-  const firstSourcesContent = firstSourcemap.sourcesContent;
-  sourcemap.sources.forEach((source) => {
-    if (firstSourcesContent) {
-      const firstSourceIndex = firstSourcemap.sources.indexOf(source);
-      if (firstSourceIndex > -1) {
-        sourcesContent.push(firstSourcesContent[firstSourceIndex]);
-        return;
-      }
-    }
-    sourcesContent.push(null);
-  });
-  sourcemap.sourcesContent = sourcesContent;
-  return sourcemap;
+  return genMapping;
 };

package/src/sourcemap_edits.js

@@ -0,0 +1,217 @@
+/*
+ * Compose a sourcemap with a set of content edits WITHOUT generating a map
+ * for the edited content: the edits are applied to the existing map as
+ * position shifts. Composing map A with the generated map of the edits
+ * walks every segment of a full-file map (boundary density) and traces
+ * each one through A; shifting walks A's own segments once with pure
+ * arithmetic, and the result keeps exactly A's density and information (a
+ * generated edit map adds no knowledge about the unchanged content, it
+ * only densifies around it).
+ *
+ * Edit offsets refer to the content BEFORE any edit (magic-string
+ * semantics): every edit lives in that single coordinate space, and the
+ * shifts accumulate while walking segments and edits together in document
+ * order. Segments strictly inside a replaced span are dropped (that
+ * position does not exist anymore — magic-string drops interior mappings
+ * the same way).
+ */
+
+import { decode, encode } from "@jridgewell/sourcemap-codec";
+
+export const applyContentEditsOnSourcemap = (sourcemap, { content, edits }) => {
+  if (typeof sourcemap.mappings !== "string") {
+    return null;
+  }
+
+  // Flatten the edit list into sorted, non-overlapping spans.
+  // - append never moves anything before it: ignored
+  // - prepend accumulates into a single insertion at (0, 0); successive
+  //   magic-string prepends each land BEFORE the previous one
+  const spans = [];
+  let prependText = "";
+  for (const edit of edits) {
+    if (edit.type === "append") {
+      continue;
+    }
+    if (edit.type === "prepend") {
+      prependText = edit.text + prependText;
+      continue;
+    }
+    spans.push({
+      start: edit.start,
+      end: edit.end,
+      replacement: edit.type === "remove" ? "" : edit.replacement,
+    });
+  }
+  if (prependText) {
+    spans.push({ start: 0, end: 0, replacement: prependText });
+  }
+  if (spans.length === 0) {
+    return sourcemap;
+  }
+  spans.sort((a, b) => a.start - b.start || a.end - b.end);
+  let spanIndex = 1;
+  while (spanIndex < spans.length) {
+    const previousSpan = spans[spanIndex - 1];
+    const span = spans[spanIndex];
+    if (
+      span.start === previousSpan.start &&
+      span.end === previousSpan.end &&
+      span.replacement === previousSpan.replacement
+    ) {
+      // the same edit applied twice: magic-string re-overwrites the range
+      // with the same content, one application yields the same result
+      // (happens with import.meta.css template replacements)
+      spans.splice(spanIndex, 1);
+      continue;
+    }
+    if (span.start < previousSpan.end) {
+      // genuinely overlapping distinct edits: their combined effect cannot
+      // be expressed as independent shifts
+      return null;
+    }
+    spanIndex++;
+  }
+
+  let lineStarts;
+  const offsetToLineColumn = (offset) => {
+    if (!lineStarts) {
+      lineStarts = [0];
+      let index = content.indexOf("\n");
+      while (index !== -1) {
+        lineStarts.push(index + 1);
+        index = content.indexOf("\n", index + 1);
+      }
+    }
+    let low = 0;
+    let high = lineStarts.length - 1;
+    while (low < high) {
+      const mid = (low + high + 1) >> 1;
+      if (lineStarts[mid] <= offset) {
+        low = mid;
+      } else {
+        high = mid - 1;
+      }
+    }
+    return { line: low, column: offset - lineStarts[low] };
+  };
+
+  const records = spans.map(({ start, end, replacement }) => {
+    const startLocation = offsetToLineColumn(start);
+    const endLocation = offsetToLineColumn(end);
+    let insertedLineCount = 0;
+    let lastNewlineIndex = -1;
+    let newlineIndex = replacement.indexOf("\n");
+    while (newlineIndex !== -1) {
+      insertedLineCount++;
+      lastNewlineIndex = newlineIndex;
+      newlineIndex = replacement.indexOf("\n", newlineIndex + 1);
+    }
+    return {
+      startLine: startLocation.line,
+      startColumn: startLocation.column,
+      endLine: endLocation.line,
+      endColumn: endLocation.column,
+      insertedLineCount,
+      insertedLastLineLength:
+        insertedLineCount === 0
+          ? replacement.length
+          : replacement.length - lastNewlineIndex - 1,
+    };
+  });
+
+  // Walk segments and edits together in document order. The transform state
+  // says how a position at or after the last applied edit end moves:
+  // - on the same old line as that end: rebased on the end's new position
+  // - on a later line: shifted by the accumulated line delta
+  let recordIndex = 0;
+  let lineDelta = 0;
+  let tailOldLine = -1;
+  let tailOldColumn = 0;
+  let tailNewLine = 0;
+  let tailNewColumn = 0;
+  const transformPosition = (line, column) => {
+    if (line === tailOldLine && column >= tailOldColumn) {
+      return [tailNewLine, tailNewColumn + (column - tailOldColumn)];
+    }
+    return [line + lineDelta, column];
+  };
+  const applyRecord = (record) => {
+    const [newStartLine, newStartColumn] = transformPosition(
+      record.startLine,
+      record.startColumn,
+    );
+    let newEndLine;
+    let newEndColumn;
+    if (record.insertedLineCount === 0) {
+      newEndLine = newStartLine;
+      newEndColumn = newStartColumn + record.insertedLastLineLength;
+    } else {
+      newEndLine = newStartLine + record.insertedLineCount;
+      newEndColumn = record.insertedLastLineLength;
+    }
+    tailOldLine = record.endLine;
+    tailOldColumn = record.endColumn;
+    tailNewLine = newEndLine;
+    tailNewColumn = newEndColumn;
+    lineDelta = newEndLine - record.endLine;
+  };
+  const isAtOrAfterEnd = (line, column, record) => {
+    if (line > record.endLine) {
+      return true;
+    }
+    return line === record.endLine && column >= record.endColumn;
+  };
+  const isStrictlyInside = (line, column, record) => {
+    const afterStart =
+      line > record.startLine ||
+      (line === record.startLine && column > record.startColumn);
+    if (!afterStart) {
+      return false;
+    }
+    return (
+      line < record.endLine ||
+      (line === record.endLine && column < record.endColumn)
+    );
+  };
+
+  const decoded = decode(sourcemap.mappings);
+  const decodedShifted = [];
+  const pushSegment = (newLine, segment) => {
+    while (decodedShifted.length <= newLine) {
+      decodedShifted.push([]);
+    }
+    decodedShifted[newLine].push(segment);
+  };
+  for (let lineIndex = 0; lineIndex < decoded.length; lineIndex++) {
+    for (const segment of decoded[lineIndex]) {
+      const column = segment[0];
+      while (
+        recordIndex < records.length &&
+        isAtOrAfterEnd(lineIndex, column, records[recordIndex])
+      ) {
+        applyRecord(records[recordIndex]);
+        recordIndex++;
+      }
+      if (
+        recordIndex < records.length &&
+        isStrictlyInside(lineIndex, column, records[recordIndex])
+      ) {
+        continue;
+      }
+      const [newLine, newColumn] = transformPosition(lineIndex, column);
+      if (newColumn === column && newLine === lineIndex) {
+        pushSegment(newLine, segment);
+        continue;
+      }
+      const segmentShifted = segment.slice();
+      segmentShifted[0] = newColumn;
+      pushSegment(newLine, segmentShifted);
+    }
+  }
+
+  return {
+    ...sourcemap,
+    mappings: encode(decodedShifted),
+  };
+};