Fixed export/copy test failures

Author: matthewlipski

packages/core/src/blocks/Code/block.ts

@@ -83,7 +83,6 @@ export const createCodeBlockSpec = createBlockSpec(
       const wrapper = document.createDocumentFragment();
       const pre = document.createElement("pre");
       const code = document.createElement("code");
-      code.textContent = block.content as unknown as string;
       pre.appendChild(code);
       const select = document.createElement("select");
       const selectWrapper = document.createElement("div");
@@ -119,13 +118,13 @@ export const createCodeBlockSpec = createBlockSpec(
     },
     toExternalHTML(block) {
       const pre = document.createElement("pre");
-      pre.className = `language-${block.props.language}`;
-      pre.dataset.language = block.props.language;
       const code = document.createElement("code");
-      code.textContent = block.content as unknown as string;
+      code.className = `language-${block.props.language}`;
+      code.dataset.language = block.props.language;
       pre.appendChild(code);
       return {
         dom: pre,
+        contentDOM: code,
       };
     },
   }),

packages/core/src/blocks/Heading/block.ts

@@ -73,6 +73,14 @@ export const createHeadingBlockSpec = createBlockSpec(
         return { ...toggleWrapper, contentDOM: dom };
       }
 
+      return {
+        dom,
+        contentDOM: dom,
+      };
+    },
+    toExternalHTML(block) {
+      const dom = document.createElement(`h${block.props.level}`);
+
       return {
         dom,
         contentDOM: dom,

packages/core/src/blocks/ListItem/ToggleListItem/block.ts

@@ -29,6 +29,10 @@ export const createToggleListItemBlockSpec = createBlockSpec(
       );
       return { ...toggleWrapper, contentDOM: paragraphEl };
     },
+    toExternalHTML() {
+      const paragraphEl = document.createElement("p");
+      return { dom: paragraphEl, contentDOM: paragraphEl };
+    },
   },
   [
     createBlockNoteExtension({

packages/core/src/blocks/ToggleWrapper/createToggleWrapper.ts

@@ -28,7 +28,7 @@ export const createToggleWrapper = (
   ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
   destroy?: () => void;
 } => {
-  if ("isToggleable" in block.props && !block.props.isToggleable) {
+  if (!("isToggleable" in block.props) || !block.props.isToggleable) {
     return {
       dom: renderedElement,
     };

packages/core/src/extensions/KeyboardShortcuts/KeyboardShortcutsExtension.ts

@@ -15,7 +15,7 @@ import { getBlockInfoFromSelection } from "../../api/getBlockInfoFromPos.js";
 import { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
 
 export const KeyboardShortcutsExtension = Extension.create<{
-  editor: BlockNoteEditor;
+  editor: BlockNoteEditor<any, any, any>;
   tabBehavior: "prefer-navigate-ui" | "prefer-indent";
 }>({
   priority: 50,

tests/src/unit/core/clipboard/copy/__snapshots__/text/html/basicBlocksWithProps.html

@@ -14,7 +14,7 @@ <h2 data-level="2">Heading 1</h2>
     <p class="bn-inline-content">Check List Item 1</p>
   </li>
 </ul>
-<pre>
+<pre data-language="typescript">
   <code class="bn-inline-content language-typescript" data-language="typescript">console.log("Hello World");</code>
 </pre>
 <table>

tests/src/unit/core/formatConversion/export/__snapshots__/blocknoteHTML/codeBlock/contains-newlines.html

@@ -1,9 +1,16 @@
 <div class="bn-block-group" data-node-type="blockGroup">
   <div class="bn-block-outer" data-node-type="blockOuter" data-id="1">
     <div class="bn-block" data-node-type="blockContainer" data-id="1">
-      <div class="bn-block-content" data-content-type="codeBlock">
+      <div
+        class="bn-block-content"
+        data-content-type="codeBlock"
+        data-language="javascript"
+      >
+        <div>
+          <select></select>
+        </div>
         <pre>
-          <code class="bn-inline-content language-javascript" data-language="javascript">const hello ='world';console.log(hello);</code>
+          <code class="bn-inline-content">const hello ='world';console.log(hello);</code>
         </pre>
       </div>
     </div>

tests/src/unit/core/formatConversion/export/__snapshots__/blocknoteHTML/codeBlock/defaultLanguage.html

@@ -2,8 +2,11 @@
   <div class="bn-block-outer" data-node-type="blockOuter" data-id="1">
     <div class="bn-block" data-node-type="blockContainer" data-id="1">
       <div class="bn-block-content" data-content-type="codeBlock">
+        <div>
+          <select></select>
+        </div>
         <pre>
-          <code class="bn-inline-content language-text" data-language="text">console.log('Hello, world!');</code>
+          <code class="bn-inline-content">console.log('Hello, world!');</code>
         </pre>
       </div>
     </div>

tests/src/unit/core/formatConversion/export/__snapshots__/blocknoteHTML/codeBlock/empty.html

@@ -2,8 +2,11 @@
   <div class="bn-block-outer" data-node-type="blockOuter" data-id="1">
     <div class="bn-block" data-node-type="blockContainer" data-id="1">
       <div class="bn-block-content" data-content-type="codeBlock">
+        <div>
+          <select></select>
+        </div>
         <pre>
-          <code class="bn-inline-content language-text" data-language="text"></code>
+          <code class="bn-inline-content"></code>
         </pre>
       </div>
     </div>

tests/src/unit/core/formatConversion/export/__snapshots__/blocknoteHTML/codeBlock/python.html

@@ -1,9 +1,16 @@
 <div class="bn-block-group" data-node-type="blockGroup">
   <div class="bn-block-outer" data-node-type="blockOuter" data-id="1">
     <div class="bn-block" data-node-type="blockContainer" data-id="1">
-      <div class="bn-block-content" data-content-type="codeBlock">
+      <div
+        class="bn-block-content"
+        data-content-type="codeBlock"
+        data-language="python"
+      >
+        <div>
+          <select></select>
+        </div>
         <pre>
-          <code class="bn-inline-content language-python" data-language="python">print('Hello, world!')</code>
+          <code class="bn-inline-content">print('Hello, world!')</code>
         </pre>
       </div>
     </div>