collavre 0.23.0 → 0.24.0

data/app/javascript/lib/lexical/__tests__/code_block_toggle.test.js

@@ -0,0 +1,326 @@
+import {
+  createEditor,
+  $getRoot,
+  $createParagraphNode,
+  $createTextNode,
+  $createRangeSelection,
+  $setSelection,
+  DecoratorNode
+} from "lexical"
+
+// Minimal top-level decorator (stands in for ImageNode/VideoNode/AttachmentNode)
+// so we can assert the toggle never removes media blocks. Its text content is
+// empty, exactly like real media nodes.
+class TestMediaNode extends DecoratorNode {
+  static getType() {
+    return "test-media"
+  }
+  static clone(node) {
+    return new TestMediaNode(node.__key)
+  }
+  createDOM() {
+    return document.createElement("div")
+  }
+  updateDOM() {
+    return false
+  }
+  decorate() {
+    return null
+  }
+}
+import { HeadingNode, QuoteNode, registerRichText } from "@lexical/rich-text"
+import { CodeNode, CodeHighlightNode, $createCodeNode, $isCodeNode } from "@lexical/code"
+import {
+  ListNode,
+  ListItemNode,
+  $createListNode,
+  $createListItemNode,
+  $isListNode
+} from "@lexical/list"
+import {
+  TableNode,
+  TableRowNode,
+  TableCellNode,
+  $createTableNodeWithDimensions,
+  $isTableNode
+} from "@lexical/table"
+import { $toggleCodeBlockForSelection } from "../code_block_toggle"
+
+function buildEditor() {
+  const editor = createEditor({
+    namespace: "test",
+    onError(error) {
+      throw error
+    },
+    nodes: [
+      HeadingNode,
+      QuoteNode,
+      CodeNode,
+      CodeHighlightNode,
+      ListNode,
+      ListItemNode,
+      TableNode,
+      TableRowNode,
+      TableCellNode,
+      TestMediaNode
+    ]
+  })
+  registerRichText(editor)
+  return editor
+}
+
+function appendParagraph(root, text) {
+  const paragraph = $createParagraphNode()
+  paragraph.append($createTextNode(text))
+  root.append(paragraph)
+  return paragraph
+}
+
+describe("$toggleCodeBlockForSelection", () => {
+  it("merges every selected paragraph into a single code block (not just the last line)", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const a = appendParagraph(root, "line one")
+        appendParagraph(root, "line two")
+        const c = appendParagraph(root, "line three")
+        const selection = $createRangeSelection()
+        selection.anchor.set(a.getFirstChild().getKey(), 0, "text")
+        selection.focus.set(c.getFirstChild().getKey(), "line three".length, "text")
+        $setSelection(selection)
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children).toHaveLength(1)
+      expect($isCodeNode(children[0])).toBe(true)
+      expect(children[0].getTextContent()).toBe("line one\nline two\nline three")
+    })
+  })
+
+  it("converts a single collapsed-selection paragraph into a code block", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const p = appendParagraph(root, "hello")
+        p.getFirstChild().selectEnd()
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children).toHaveLength(1)
+      expect($isCodeNode(children[0])).toBe(true)
+      expect(children[0].getTextContent()).toBe("hello")
+    })
+  })
+
+  it("toggles a selected code block back into one paragraph per line", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const codeNode = $createCodeNode()
+        codeNode.append($createTextNode("a\nb"))
+        root.append(codeNode)
+        codeNode.selectEnd()
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children.some($isCodeNode)).toBe(false)
+      expect(children.map((child) => child.getTextContent())).toEqual(["a", "b"])
+    })
+  })
+
+  it("absorbs a mixed selection (heading + paragraph) into one code block", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const heading = new HeadingNode("h1")
+        heading.append($createTextNode("Title"))
+        root.append(heading)
+        const body = appendParagraph(root, "body")
+        const selection = $createRangeSelection()
+        selection.anchor.set(heading.getFirstChild().getKey(), 0, "text")
+        selection.focus.set(body.getFirstChild().getKey(), "body".length, "text")
+        $setSelection(selection)
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children).toHaveLength(1)
+      expect($isCodeNode(children[0])).toBe(true)
+      expect(children[0].getTextContent()).toBe("Title\nbody")
+    })
+  })
+
+  it("does not flatten a table when the caret is inside a table cell", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const table = $createTableNodeWithDimensions(2, 2, false)
+        root.append(table)
+        const cellParagraph = table.getFirstChild().getFirstChild().getFirstChild()
+        cellParagraph.append($createTextNode("cell"))
+        cellParagraph.getFirstChild().selectEnd()
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children.some($isTableNode)).toBe(true)
+      expect(children.some($isCodeNode)).toBe(false)
+    })
+  })
+
+  it("does not fold table-cell content into the merge when a table sits inside the range", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const before = appendParagraph(root, "before")
+        const table = $createTableNodeWithDimensions(2, 2, false)
+        root.append(table)
+        // Put text in the first cell so we can assert it is never merged out.
+        const cellParagraph = table.getFirstChild().getFirstChild().getFirstChild()
+        cellParagraph.clear()
+        cellParagraph.append($createTextNode("cell"))
+        const after = appendParagraph(root, "after")
+        // Endpoints are the outside paragraphs; the range walks through the
+        // table interior. getTableCell content top-levels to the cell paragraph,
+        // which must be excluded from the merge (it is table-scoped).
+        const selection = $createRangeSelection()
+        selection.anchor.set(before.getFirstChild().getKey(), 0, "text")
+        selection.focus.set(after.getFirstChild().getKey(), "after".length, "text")
+        $setSelection(selection)
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      // Table survives in place; its cell text is NOT pulled into any code block,
+      // and "after" is not moved above the table (document order preserved).
+      expect(children.map((c) => c.getType())).toEqual(["code", "table", "code"])
+      const table = children.find($isTableNode)
+      expect(table.getTextContent()).toContain("cell")
+      const codeBlocks = children.filter($isCodeNode)
+      expect(codeBlocks.map((c) => c.getTextContent())).toEqual(["before", "after"])
+    })
+  })
+
+  it("leaves the whole list intact when only one bullet is selected", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const list = $createListNode("bullet")
+        const first = $createListItemNode()
+        first.append($createTextNode("one"))
+        const second = $createListItemNode()
+        second.append($createTextNode("two"))
+        list.append(first, second)
+        root.append(list)
+        // Caret sits in the first bullet only.
+        first.getFirstChild().selectEnd()
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      // The list survives whole — the unselected second bullet is not absorbed
+      // into a code block, and no code block is created from a single bullet.
+      expect(children.some($isListNode)).toBe(true)
+      expect(children.some($isCodeNode)).toBe(false)
+      expect(children.find($isListNode).getTextContent()).toContain("two")
+    })
+  })
+
+  it("merges surrounding text but leaves a list in place (structural, order preserved)", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const before = appendParagraph(root, "before")
+        const list = $createListNode("bullet")
+        const item = $createListItemNode()
+        item.append($createTextNode("bullet"))
+        list.append(item)
+        root.append(list)
+        const after = appendParagraph(root, "after")
+        const selection = $createRangeSelection()
+        selection.anchor.set(before.getFirstChild().getKey(), 0, "text")
+        selection.focus.set(after.getFirstChild().getKey(), "after".length, "text")
+        $setSelection(selection)
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      // List stays in place; "after" is not pulled above it (order preserved).
+      expect(children.map((c) => c.getType())).toEqual(["code", "list", "code"])
+      const codeBlocks = children.filter($isCodeNode)
+      expect(codeBlocks.map((c) => c.getTextContent())).toEqual(["before", "after"])
+    })
+  })
+
+  it("merges surrounding text but leaves a selected media (decorator) block intact", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const before = appendParagraph(root, "before")
+        const media = new TestMediaNode()
+        root.append(media)
+        const after = appendParagraph(root, "after")
+        const selection = $createRangeSelection()
+        selection.anchor.set(before.getFirstChild().getKey(), 0, "text")
+        selection.focus.set(after.getFirstChild().getKey(), "after".length, "text")
+        $setSelection(selection)
+        $toggleCodeBlockForSelection()
+      },
+      { discrete: true }
+    )
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      // Media block must survive AND stay in document order. Text on each side of
+      // it becomes its own code block — "after" is never pulled above the media.
+      expect(children.map((c) => c.getType())).toEqual(["code", "test-media", "code"])
+      const codeBlocks = children.filter($isCodeNode)
+      expect(codeBlocks.map((c) => c.getTextContent())).toEqual(["before", "after"])
+    })
+  })
+})

data/app/javascript/lib/lexical/__tests__/code_fence_shortcut.test.js

@@ -0,0 +1,179 @@
+import {
+  createEditor,
+  $getRoot,
+  $createParagraphNode,
+  $createTextNode,
+  $createRangeSelection,
+  $setSelection,
+  KEY_ENTER_COMMAND
+} from "lexical"
+import { HeadingNode, QuoteNode, registerRichText } from "@lexical/rich-text"
+import { CodeNode, CodeHighlightNode, $isCodeNode } from "@lexical/code"
+import { registerCodeFenceShortcut } from "../code_fence_shortcut"
+import { isLanguageResolved } from "../../editor/code_languages"
+
+function buildEditor() {
+  const editor = createEditor({
+    namespace: "test",
+    onError(error) {
+      throw error
+    },
+    nodes: [HeadingNode, QuoteNode, CodeNode, CodeHighlightNode]
+  })
+  registerRichText(editor)
+  registerCodeFenceShortcut(editor)
+  return editor
+}
+
+// Put `text` into a fresh paragraph with the caret at its end — the state right
+// before the user presses Enter. This does NOT convert on its own; conversion is
+// the Enter keystroke, so the language token can be typed first.
+function setFenceLine(editor, text) {
+  editor.update(
+    () => {
+      const root = $getRoot()
+      root.clear()
+      const paragraph = $createParagraphNode()
+      const textNode = $createTextNode(text)
+      paragraph.append(textNode)
+      root.append(paragraph)
+      const selection = $createRangeSelection()
+      selection.anchor.set(textNode.getKey(), text.length, "text")
+      selection.focus.set(textNode.getKey(), text.length, "text")
+      $setSelection(selection)
+    },
+    { discrete: true }
+  )
+}
+
+// Dispatch a bare Enter (the fence-commit keystroke). Returns nothing; read the
+// editor state afterwards to assert the outcome.
+function pressEnter(editor, { shiftKey = false } = {}) {
+  editor.dispatchCommand(KEY_ENTER_COMMAND, {
+    shiftKey,
+    preventDefault() {}
+  })
+}
+
+describe("registerCodeFenceShortcut", () => {
+  it("does not convert until Enter — so ```lang can be typed first", () => {
+    const editor = buildEditor()
+    // The fence line is present with the caret at its end, but no Enter yet.
+    setFenceLine(editor, "```")
+    editor.read(() => {
+      expect($isCodeNode($getRoot().getFirstChild())).toBe(false)
+    })
+
+    // Extending the fence with a language must not have converted it either.
+    setFenceLine(editor, "```json")
+    editor.read(() => {
+      expect($isCodeNode($getRoot().getFirstChild())).toBe(false)
+    })
+  })
+
+  it("converts a bare ``` fence into an empty code block on Enter", () => {
+    const editor = buildEditor()
+    setFenceLine(editor, "```")
+    pressEnter(editor)
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children).toHaveLength(1)
+      expect($isCodeNode(children[0])).toBe(true)
+      expect(children[0].getTextContent()).toBe("")
+      expect(children[0].getLanguage()).toBeFalsy()
+    })
+  })
+
+  it("carries the language token from ```json on Enter", () => {
+    const editor = buildEditor()
+    setFenceLine(editor, "```json")
+    pressEnter(editor)
+
+    editor.read(() => {
+      const codeNode = $getRoot().getFirstChild()
+      expect($isCodeNode(codeNode)).toBe(true)
+      expect(codeNode.getLanguage()).toBe("json")
+    })
+  })
+
+  it("marks an explicit fence language resolved so highlighting won't relabel it", () => {
+    const editor = buildEditor()
+    // ```javascript is ambiguous with the tokenizer's baked default; without the
+    // resolved marker the detect transform would re-detect and could relabel it.
+    setFenceLine(editor, "```javascript")
+    pressEnter(editor)
+
+    let key
+    editor.read(() => {
+      const codeNode = $getRoot().getFirstChild()
+      expect($isCodeNode(codeNode)).toBe(true)
+      expect(codeNode.getLanguage()).toBe("javascript")
+      key = codeNode.getKey()
+    })
+    expect(isLanguageResolved(editor, key)).toBe(true)
+  })
+
+  it("does not mark a bare ``` fence resolved", () => {
+    const editor = buildEditor()
+    setFenceLine(editor, "```")
+    pressEnter(editor)
+
+    let key
+    editor.read(() => {
+      key = $getRoot().getFirstChild().getKey()
+    })
+    expect(isLanguageResolved(editor, key)).toBe(false)
+  })
+
+  it("leaves Shift+Enter as a soft newline, not a fence commit", () => {
+    const editor = buildEditor()
+    setFenceLine(editor, "```")
+    pressEnter(editor, { shiftKey: true })
+
+    editor.read(() => {
+      expect($isCodeNode($getRoot().getFirstChild())).toBe(false)
+    })
+  })
+
+  it("leaves prose that merely contains backticks untouched on Enter", () => {
+    const editor = buildEditor()
+    setFenceLine(editor, "run ```code``` inline")
+    pressEnter(editor)
+
+    editor.read(() => {
+      const child = $getRoot().getFirstChild()
+      expect($isCodeNode(child)).toBe(false)
+      expect(child.getTextContent()).toBe("run ```code``` inline")
+    })
+  })
+
+  it("does not convert a ``` paragraph when the caret is elsewhere", () => {
+    const editor = buildEditor()
+    editor.update(
+      () => {
+        const root = $getRoot()
+        root.clear()
+        const fence = $createParagraphNode()
+        fence.append($createTextNode("```"))
+        root.append(fence)
+        const other = $createParagraphNode()
+        const otherText = $createTextNode("elsewhere")
+        other.append(otherText)
+        root.append(other)
+        // Caret sits in the OTHER paragraph, not the fence line.
+        const selection = $createRangeSelection()
+        selection.anchor.set(otherText.getKey(), 1, "text")
+        selection.focus.set(otherText.getKey(), 1, "text")
+        $setSelection(selection)
+      },
+      { discrete: true }
+    )
+    pressEnter(editor)
+
+    editor.read(() => {
+      const children = $getRoot().getChildren()
+      expect(children.some($isCodeNode)).toBe(false)
+    })
+  })
+})

data/app/javascript/lib/lexical/code_block_toggle.js

@@ -0,0 +1,130 @@
+import {
+  $createParagraphNode,
+  $createTextNode,
+  $getSelection,
+  $isDecoratorNode,
+  $isRangeSelection
+} from "lexical"
+import { $createCodeNode, $isCodeNode } from "@lexical/code"
+import { $isTableNode } from "@lexical/table"
+import { $isListNode } from "@lexical/list"
+
+/**
+ * Toggle the current selection between a code block and normal paragraphs.
+ *
+ * Must be called inside an editor.update() callback.
+ *
+ * Selecting several blocks and hitting the code-block button merges ALL of them
+ * into a single code block (one line per source block), instead of only the
+ * anchor block — the old single-node behaviour dropped every line but the last.
+ *
+ * When every selected top-level block is already a code block the toggle runs in
+ * reverse: each code block is expanded back into one paragraph per line.
+ * Text blocks (headings, quotes, paragraphs) are absorbed as plain text; tables,
+ * media, and lists are structural and left in place (see $isMergeableTextBlock).
+ */
+export function $toggleCodeBlockForSelection() {
+  const selection = $getSelection()
+  if (!$isRangeSelection(selection)) return
+
+  const topLevels = $selectedTopLevelBlocks(selection)
+  if (topLevels.length === 0) return
+
+  // All selected blocks are code → toggle OFF (expand each back to paragraphs).
+  if (topLevels.every($isCodeNode)) {
+    let lastParagraph = null
+    topLevels.forEach((codeNode) => {
+      lastParagraph = $expandCodeNodeToParagraphs(codeNode)
+    })
+    // The code nodes the selection referenced are gone; move the caret to the
+    // end of the expanded text so Lexical keeps a valid selection.
+    if (lastParagraph) lastParagraph.selectEnd()
+    return
+  }
+
+  // Otherwise → fold the selected TEXT blocks into code blocks. Tables and media
+  // (image/video/attachment DecoratorNodes) are structural: their text content is
+  // empty or a flattening of tabular data, so absorbing them would silently
+  // destroy the table/media. They are left in place, which SPLITS the selection:
+  // merging text from both sides of a structural block into one code block would
+  // pull later content across the block and corrupt document order. So each
+  // contiguous run of text blocks becomes its own code block, structural blocks
+  // untouched in between (matches the old paragraph-only guard, widened to
+  // headings/quotes/lists but not across structural containers).
+  let run = []
+  let lastCode = null
+  const flushRun = () => {
+    if (run.length === 0) return
+    const content = run.map((node) => node.getTextContent()).join("\n")
+    const codeNode = $createCodeNode()
+    codeNode.append($createTextNode(content))
+    run[0].replace(codeNode)
+    for (let index = 1; index < run.length; index += 1) run[index].remove()
+    lastCode = codeNode
+    run = []
+  }
+  topLevels.forEach((node) => {
+    if ($isMergeableTextBlock(node)) run.push(node)
+    else flushRun()
+  })
+  flushRun()
+  if (lastCode) lastCode.selectEnd()
+}
+
+// A block can be folded into a code block only if its text content faithfully
+// represents it. Tables (tabular structure) and decorator media (no text) do
+// not, so they are excluded from the merge to avoid destroying content.
+function $isMergeableTextBlock(node) {
+  if ($isTableNode(node) || $isDecoratorNode(node)) return false
+  // A ListNode is the top-level element for every bullet, so selecting text in
+  // ONE bullet top-levels to the whole list. Merging it would flatten every
+  // sibling bullet (via getTextContent()) and replace the entire list — losing
+  // unselected bullets. Item-granular folding (split the list, keep the rest) is
+  // out of scope here, so lists are treated as structural and left in place;
+  // convert a list to code via a ``` fence instead.
+  if ($isListNode(node)) return false
+  // TableCellNode is a shadow root, so getTopLevelElement() on cell content
+  // returns the cell's own paragraph — a plain block that slips past the
+  // $isTableNode check above. Merging that cell block with document-root blocks
+  // moves content across the table boundary (relocating outside text into a
+  // cell, or replacing the cell body). Never merge table-scoped blocks.
+  if (node.getParents().some($isTableNode)) return false
+  return true
+}
+
+// Distinct top-level blocks the selection touches, in document order. getNodes()
+// returns the range's nodes in document order; each maps to its owning top-level
+// element. Falls back to the anchor's block for a collapsed selection.
+function $selectedTopLevelBlocks(selection) {
+  const seen = new Set()
+  const blocks = []
+  selection.getNodes().forEach((node) => {
+    const topLevel = node.getTopLevelElement()
+    if (!topLevel || seen.has(topLevel.getKey())) return
+    seen.add(topLevel.getKey())
+    blocks.push(topLevel)
+  })
+  if (blocks.length === 0) {
+    const anchorTop = selection.anchor.getNode().getTopLevelElement()
+    if (anchorTop) blocks.push(anchorTop)
+  }
+  return blocks
+}
+
+// Replace a code block with one paragraph per line, preserving order. Returns
+// the last paragraph so the caller can restore a valid selection (the code
+// node the selection pointed at is gone once we replace it).
+function $expandCodeNodeToParagraphs(codeNode) {
+  const lines = codeNode.getTextContent().split("\n")
+  const firstParagraph = $createParagraphNode()
+  firstParagraph.append($createTextNode(lines[0] || ""))
+  codeNode.replace(firstParagraph)
+  let previous = firstParagraph
+  for (let index = 1; index < lines.length; index += 1) {
+    const paragraph = $createParagraphNode()
+    paragraph.append($createTextNode(lines[index]))
+    previous.insertAfter(paragraph)
+    previous = paragraph
+  }
+  return previous
+}

data/app/javascript/lib/lexical/code_fence_shortcut.js

@@ -0,0 +1,60 @@
+import {
+  $getSelection,
+  $isRangeSelection,
+  $isParagraphNode,
+  KEY_ENTER_COMMAND,
+  COMMAND_PRIORITY_HIGH
+} from "lexical"
+import { $createCodeNode } from "@lexical/code"
+import { markLanguageResolved } from "../editor/code_languages"
+
+// A paragraph whose entire text is a Markdown fence opener: three backticks,
+// optionally followed by a language token (e.g. ```ruby). Nothing may follow
+// the language, so normal prose that merely contains backticks is untouched.
+const FENCE_REGEX = /^```([\w+-]*)$/
+
+/**
+ * Open a code block when the user presses Enter on a "```" (optionally
+ * "```lang") line. The built-in @lexical/markdown CODE transformer only fires on
+ * "``` " + a trailing space, so Enter after the fence (what users actually do)
+ * left the paragraph as plain text; this adds the Enter path.
+ *
+ * Enter is used deliberately rather than reacting to the fence text itself:
+ * converting the moment the third backtick lands would swallow "```json" before
+ * the language could be typed. Conversion must wait for the delimiter — a space
+ * (handled by the built-in transformer) or Enter (handled here) — so whatever
+ * language the user typed between the fence and the delimiter is captured.
+ *
+ * Returns the editor.registerCommand teardown so callers can clean up.
+ */
+export function registerCodeFenceShortcut(editor) {
+  return editor.registerCommand(
+    KEY_ENTER_COMMAND,
+    (event) => {
+      // Shift+Enter is a soft newline within a block, never a fence commit.
+      if (event?.shiftKey) return false
+
+      const selection = $getSelection()
+      if (!$isRangeSelection(selection) || !selection.isCollapsed()) return false
+
+      const paragraph = selection.anchor.getNode().getTopLevelElement()
+      if (!$isParagraphNode(paragraph)) return false
+
+      const match = paragraph.getTextContent().match(FENCE_REGEX)
+      if (!match) return false
+
+      // Swallow the newline Enter would otherwise insert; replace the fence line.
+      event?.preventDefault()
+      const language = match[1] || undefined
+      const codeNode = $createCodeNode(language)
+      paragraph.replace(codeNode)
+      // An explicit fence language must survive the highlight transform, which
+      // otherwise re-detects any block still on the "javascript" default and would
+      // silently relabel a deliberate ```javascript. Mirror the import path.
+      if (language) markLanguageResolved(editor, codeNode.getKey())
+      codeNode.selectStart()
+      return true
+    },
+    COMMAND_PRIORITY_HIGH
+  )
+}