fix(markdown): skip quoted fences, and stop joining runs across inline tags

Two review findings, both real, both the same shape: a rule that looked at the
rendered form and forgot what the source actually says.

QUOTED FENCES. The fence walk only recognised a bare delimiter run, but the
serializer writes a fence inside a blockquote or a `[!NOTE]` callout with a `>`
on every line. Code state was therefore never entered there and the block's
interior was cleaned up as prose: `> x = a\_b` round-tripped to `> x = a_b`,
losing the author's backslash. Unlike the fence-length cases this one is
reachable today — verified against the real serializer before and after. Both
fence walks now unquote the line first.

INLINE JOINS. Runs concatenated the visible text of every inline tag, so
`a<strong>b</strong>c` read as `abc` — a hit that cannot exist in the markdown
the indexer scans, where `**` sits between the words. That is worse than a
spurious mark: `occurrenceIndex` counts SOURCE occurrences, so a fabricated hit
earlier in the document steals the current ordinal and paints the mark on text
the search never matched. Only `<br>` continues a run now, because it alone
stands for a character the source really has (a `\n`, folded to a space).
Everything else stands for syntax the render drops.

Nothing real is lost: a match spanning `a**b**c` would have to contain the
asterisks to exist at all, and a match wholly inside an element is still found —
the element simply starts its own run.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: icecrasher321

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/markdown-fidelity.ts

@@ -60,7 +60,7 @@ function unescapeIntrawordUnderscores(markdown: string): string {
       continue
     }
 
-    const delimiter = lines[i].match(FENCE_DELIMITER)?.[1]
+    const delimiter = opensFence(lines[i])
     if (delimiter) {
       fence = delimiter
       continue
@@ -177,10 +177,26 @@ const FENCE_DELIMITER = /^[ \t]*(`{3,}|~{3,})/
  * as prose.
  */
 const CLOSING_FENCE = /^[ \t]*(`{3,}|~{3,})[ \t]*$/
+/**
+ * Leading blockquote markers, which every line of a fence inside a quote or a `[!NOTE]` callout
+ * carries. The serializer writes those (` > ```js `), so a walk that only recognises a bare fence
+ * never enters code state there and rewrites the block's interior as prose.
+ */
+const BLOCKQUOTE_PREFIX = /^[ \t]*(?:>[ \t]?)*/
+
+/** The line with any blockquote markers removed, so a quoted fence reads like a bare one. */
+function unquote(line: string): string {
+  return line.replace(BLOCKQUOTE_PREFIX, '')
+}
+
+/** The delimiter run that OPENS a fence on this line, quoted or not, or undefined. */
+function opensFence(line: string): string | undefined {
+  return unquote(line).match(FENCE_DELIMITER)?.[1]
+}
 
 /** Whether `line` closes a fence opened with `fence`: same character, and at least as long. */
 function closesFence(line: string, fence: string): boolean {
-  const delimiter = line.match(CLOSING_FENCE)?.[1]
+  const delimiter = unquote(line).match(CLOSING_FENCE)?.[1]
   return Boolean(delimiter && delimiter[0] === fence[0] && delimiter.length >= fence.length)
 }
 /** Leading indentation of a line, used to detect whether an empty list item has indented children. */
@@ -213,7 +229,7 @@ function stripEmptyListItemLines(markdown: string): string {
       if (closesFence(line, fence)) fence = null
       continue
     }
-    const delimiter = line.match(FENCE_DELIMITER)?.[1]
+    const delimiter = opensFence(line)
     if (delimiter) {
       fence = delimiter
       kept.push(line)

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/round-trip.test.ts

@@ -279,6 +279,21 @@ describe('editor markdown round-trip', () => {
     expect(roundTrip('call ``a\\_b`c`` here')).toContain('a\\_b')
   })
 
+  /* Unlike the fence-length cases, this one is reachable: the serializer really does write a
+     quoted fence as ` > ```js `, so a walk that only recognises a bare fence never enters code
+     state and rewrites the block's interior as prose. */
+  it('leaves code alone inside a blockquoted fence', () => {
+    expect(roundTrip('> ```js\n> x = a\\_b\n> ```')).toContain('a\\_b')
+  })
+
+  it('leaves code alone inside a callout fence', () => {
+    expect(roundTrip('> [!NOTE]\n> ```js\n> x = a\\_b\n> ```')).toContain('a\\_b')
+  })
+
+  it('still unescapes prose inside a blockquote', () => {
+    expect(roundTrip('> SB_ACTION_ROUTER_SECRET')).toContain('SB_ACTION_ROUTER_SECRET')
+  })
+
   it('preserves an image url (does not drop the src)', () => {
     const out = roundTrip('![alt](https://example.com/i.png)')
     expect(out).toContain('![alt](https://example.com/i.png)')

packages/workflow-renderer/src/note/note-search-highlight.test.tsx

@@ -274,7 +274,10 @@ describe('note search across inline boundaries', () => {
     expect(ordinals).toEqual(['0', '0'])
   })
 
-  it('marks a phrase spanning a bold word', () => {
+  /* A match spanning `a**b**c` cannot exist in the source the indexer scans — the asterisks are
+     between the words there. Joining across the element would invent one, and because the ordinal
+     counts source occurrences, an invented hit appearing earlier steals the current mark. */
+  it('does not join text across a bold word', () => {
     const tree: Root = {
       type: 'root',
       children: [
@@ -296,7 +299,7 @@ describe('note search across inline boundaries', () => {
       ],
     }
     noteSearchHighlightPlugin({ query: 'a bold word' })(tree)
-    expect(markedTextsOf(tree)).toEqual(['a ', 'bold', ' word'])
+    expect(markedTextsOf(tree)).toEqual([])
   })
 
   /* Two paragraphs are not one phrase on screen. Joining them would invent a hit
@@ -308,6 +311,81 @@ describe('note search across inline boundaries', () => {
     expect(markedTextsOf(tree)).toEqual([])
   })
 
+  it('still marks a match wholly inside an inline element', () => {
+    const tree: Root = {
+      type: 'root',
+      children: [
+        {
+          type: 'element',
+          tagName: 'p',
+          properties: {},
+          children: [
+            {
+              type: 'element',
+              tagName: 'strong',
+              properties: {},
+              children: [{ type: 'text', value: 'SB_ACTION' }],
+            },
+          ],
+        },
+      ],
+    }
+    noteSearchHighlightPlugin({ query: 'SB_ACTION' })(tree)
+    expect(markedTextsOf(tree)).toEqual(['SB_ACTION'])
+  })
+
+  /* The ordinal counts SOURCE occurrences. A hit that only exists once formatting is stripped
+     would take ordinal 0 here while the real one — the one the panel is pointing at — became 1,
+     so the card would paint the current mark on text the search never matched. */
+  it('does not let a formatted concatenation steal the current ordinal', () => {
+    const tree: Root = {
+      type: 'root',
+      children: [
+        {
+          type: 'element',
+          tagName: 'p',
+          properties: {},
+          children: [
+            { type: 'text', value: 'a' },
+            {
+              type: 'element',
+              tagName: 'strong',
+              properties: {},
+              children: [{ type: 'text', value: 'b' }],
+            },
+            { type: 'text', value: 'c' },
+          ],
+        },
+        {
+          type: 'element',
+          tagName: 'p',
+          properties: {},
+          children: [{ type: 'text', value: 'abc' }],
+        },
+      ],
+    }
+    noteSearchHighlightPlugin({ query: 'abc' })(tree)
+
+    const marks: Array<[string, unknown]> = []
+    const walk = (node: Root | Element) => {
+      const children: Array<RootContent | ElementContent> = node.children
+      for (const child of children) {
+        if (child.type !== 'element') continue
+        if (child.tagName === 'mark') {
+          const [first] = child.children
+          marks.push([
+            first?.type === 'text' ? first.value : '',
+            child.properties.dataNoteSearchIndex,
+          ])
+          continue
+        }
+        walk(child)
+      }
+    }
+    walk(tree)
+    expect(marks).toEqual([['abc', '0']])
+  })
+
   it('folds a non-breaking space the way the indexer does', () => {
     const tree = paragraphTree('a b')
     noteSearchHighlightPlugin({ query: 'a b' })(tree)

packages/workflow-renderer/src/note/note-search-highlight.ts

@@ -41,40 +41,6 @@ export interface NoteSearchRange {
  */
 export const NOTE_SEARCH_MARK_INDEX_PROPERTY = 'dataNoteSearchIndex'
 
-/**
- * Elements that do not interrupt a run of text. Text either side of one reads
- * as a single phrase, so the scan below joins across them — the same thing the
- * browser's own find does in `a<strong>b</strong>c`.
- *
- * An allowlist rather than a block-level denylist: raw HTML can put any tag in
- * this tree, and treating something unrecognised as a break can only ever miss
- * a match, while treating it as inline could invent one that is not on screen.
- */
-const INLINE_TAG_NAMES: ReadonlySet<string> = new Set([
-  'a',
-  'abbr',
-  'b',
-  'br',
-  'cite',
-  'code',
-  'del',
-  'em',
-  'i',
-  'ins',
-  'kbd',
-  'mark',
-  'q',
-  's',
-  'samp',
-  'small',
-  'span',
-  'strong',
-  'sub',
-  'sup',
-  'u',
-  'var',
-])
-
 /**
  * Visits every occurrence of `query` in `text`, case-insensitively and without
  * overlaps.
@@ -187,13 +153,21 @@ function collectTextRuns(node: Root | Element, builder: RunBuilder): void {
       continue
     }
 
-    /* An inline element continues the run — the builder state is shared, so
-       descending is all it takes. Anything else breaks it either side. */
-    if (INLINE_TAG_NAMES.has(child.tagName)) {
-      collectTextRuns(child, builder)
-      continue
-    }
-
+    /*
+     * Every other element ends the run, `<strong>` and `<a>` included.
+     *
+     * `<br>` is the one boundary that stands for a character the source really
+     * has. Every other inline element stands for syntax the render DROPS —
+     * `**`, `_`, a backtick, a link's `](url)` — so joining across one invents
+     * an adjacency that exists on screen but not in the markdown the indexer
+     * scans. That is not merely a spurious extra mark: `occurrenceIndex` counts
+     * source occurrences, so a fabricated hit appearing earlier in the document
+     * steals the current ordinal and paints the wrong one.
+     *
+     * Nothing real is lost. A match spanning `a**b**c` would have to contain
+     * the asterisks to exist in the source at all, and a match wholly inside
+     * the element is still found — the element simply starts its own run.
+     */
     endRun(builder)
     collectTextRuns(child, builder)
     endRun(builder)