fix: cleanup accesses to prosemirrorView to account for tiptap 3 behavior (#2017)

Author: nperez0111

packages/core/src/api/clipboard/fromClipboard/handleFileInsertion.ts

@@ -152,15 +152,15 @@ export async function handleFileInsertion<
           top: (event as DragEvent).clientY,
         };
 
-        const pos = editor.prosemirrorView?.posAtCoords(coords);
+        const pos = editor.prosemirrorView.posAtCoords(coords);
 
         if (!pos) {
           return;
         }
 
         insertedBlockId = editor.transact((tr) => {
           const posInfo = getNearestBlockPos(tr.doc, pos.pos);
-          const blockElement = editor.prosemirrorView?.dom.querySelector(
+          const blockElement = editor.prosemirrorView.dom.querySelector(
             `[data-id="${posInfo.node.attrs.id}"]`,
           );
 

packages/core/src/api/clipboard/fromClipboard/pasteExtension.ts

@@ -57,7 +57,7 @@ function defaultPasteHandler({
   }
 
   if (format === "vscode-editor-data") {
-    handleVSCodePaste(event, editor.prosemirrorView!);
+    handleVSCodePaste(event, editor.prosemirrorView);
     return true;
   }
 

packages/core/src/extensions/Placeholder/PlaceholderPlugin.ts

@@ -32,10 +32,10 @@ export class PlaceholderPlugin extends BlockNoteExtension {
             styleEl.setAttribute("nonce", nonce);
           }
 
-          if (editor.prosemirrorView?.root instanceof window.ShadowRoot) {
-            editor.prosemirrorView.root.append(styleEl);
+          if (view.root instanceof window.ShadowRoot) {
+            view.root.append(styleEl);
           } else {
-            editor.prosemirrorView?.root.head.appendChild(styleEl);
+            view.root.head.appendChild(styleEl);
           }
 
           const styleSheet = styleEl.sheet!;
@@ -88,10 +88,10 @@ export class PlaceholderPlugin extends BlockNoteExtension {
 
           return {
             destroy: () => {
-              if (editor.prosemirrorView?.root instanceof window.ShadowRoot) {
-                editor.prosemirrorView.root.removeChild(styleEl);
+              if (view.root instanceof window.ShadowRoot) {
+                view.root.removeChild(styleEl);
               } else {
-                editor.prosemirrorView?.root.head.removeChild(styleEl);
+                view.root.head.removeChild(styleEl);
               }
             },
           };

packages/core/src/extensions/SideMenu/SideMenuPlugin.ts

@@ -733,9 +733,7 @@ export class SideMenuProsemirrorPlugin<
    * Handles drag & drop events for blocks.
    */
   blockDragEnd = () => {
-    if (this.editor.prosemirrorView) {
-      unsetDragImage(this.editor.prosemirrorView.root);
-    }
+    unsetDragImage(this.editor.prosemirrorView.root);
 
     if (this.view) {
       this.view.isDragOrigin = false;

packages/core/src/extensions/SideMenu/dragging.ts

@@ -159,10 +159,10 @@ export function dragStart<
     return;
   }
 
-  const view = editor.prosemirrorView;
-  if (!view) {
+  if (editor.headless) {
     return;
   }
+  const view = editor.prosemirrorView;
 
   const posInfo = getNodeById(block.id, view.state.doc);
   if (!posInfo) {

packages/core/src/extensions/SuggestionMenu/SuggestionPlugin.ts

@@ -32,6 +32,7 @@ class SuggestionMenuView<
   constructor(
     private readonly editor: BlockNoteEditor<BSchema, I, S>,
     emitUpdate: (menuName: string, state: SuggestionMenuState) => void,
+    view: EditorView,
   ) {
     this.pluginState = undefined;
 
@@ -46,7 +47,7 @@ class SuggestionMenuView<
       });
     };
 
-    this.rootEl = this.editor.prosemirrorView?.root;
+    this.rootEl = view.root;
 
     // Setting capture=true ensures that any parent container of the editor that
     // gets scrolled will trigger the scroll event. Scroll events do not bubble
@@ -181,12 +182,13 @@ export class SuggestionMenuProseMirrorPlugin<
       new Plugin({
         key: suggestionMenuPluginKey,
 
-        view: () => {
+        view: (view) => {
           this.view = new SuggestionMenuView<BSchema, I, S>(
             editor,
             (triggerCharacter, state) => {
               this.emit(`update ${triggerCharacter}`, state);
             },
+            view,
           );
           return this.view;
         },

packages/core/src/extensions/TableHandles/TableHandlesPlugin.ts

@@ -829,8 +829,8 @@ export class TableHandlesProsemirrorPlugin<
       }),
     );
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     setHiddenDragImage(this.editor.prosemirrorView.root);
@@ -872,8 +872,8 @@ export class TableHandlesProsemirrorPlugin<
       }),
     );
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     setHiddenDragImage(this.editor.prosemirrorView.root);
@@ -897,8 +897,8 @@ export class TableHandlesProsemirrorPlugin<
 
     this.editor.transact((tr) => tr.setMeta(tableHandlesPluginKey, null));
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     unsetHiddenDragImage(this.editor.prosemirrorView.root);

packages/react/src/components/FormattingToolbar/DefaultButtons/CreateLinkButton.tsx

@@ -66,12 +66,16 @@ export const CreateLinkButton = () => {
       }
     };
 
-    editor.prosemirrorView?.dom.addEventListener("keydown", callback);
+    if (editor.headless) {
+      return;
+    }
+
+    editor.prosemirrorView.dom.addEventListener("keydown", callback);
 
     return () => {
-      editor.prosemirrorView?.dom.removeEventListener("keydown", callback);
+      editor.prosemirrorView.dom.removeEventListener("keydown", callback);
     };
-  }, [editor.prosemirrorView?.dom]);
+  }, [editor.prosemirrorView, editor.headless]);
 
   const update = useCallback(
     (url: string) => {

tests/src/unit/shared/clipboard/copy/copyTestExecutors.ts

@@ -22,7 +22,7 @@ export const testCopyBlockNoteHTML = async <
   initTestEditor(editor, testCase.document, testCase.getCopySelection);
 
   const { clipboardHTML } = selectedFragmentToHTML(
-    editor.prosemirrorView!,
+    editor.prosemirrorView,
     editor,
   );
 
@@ -42,7 +42,7 @@ export const testCopyHTML = async <
   initTestEditor(editor, testCase.document, testCase.getCopySelection);
 
   const { externalHTML } = selectedFragmentToHTML(
-    editor.prosemirrorView!,
+    editor.prosemirrorView,
     editor,
   );
 
@@ -61,7 +61,7 @@ export const testCopyMarkdown = async <
 ) => {
   initTestEditor(editor, testCase.document, testCase.getCopySelection);
 
-  const { markdown } = selectedFragmentToHTML(editor.prosemirrorView!, editor);
+  const { markdown } = selectedFragmentToHTML(editor.prosemirrorView, editor);
 
   await expect(markdown).toMatchFileSnapshot(
     `./__snapshots__/text/plain/${testCase.name}.md`,

tests/src/unit/shared/clipboard/copyPaste/copyPasteTestExecutors.ts

@@ -22,14 +22,14 @@ export const testCopyPaste = async <
   initTestEditor(editor, testCase.document, testCase.getCopySelection);
 
   const { clipboardHTML } = selectedFragmentToHTML(
-    editor.prosemirrorView!,
+    editor.prosemirrorView,
     editor,
   );
 
   editor.transact((tr) => tr.setSelection(testCase.getPasteSelection(tr.doc)));
 
   doPaste(
-    editor.prosemirrorView!,
+    editor.prosemirrorView,
     "text",
     clipboardHTML,
     false,