update deps

package.json

@@ -20,21 +20,21 @@
     "pnpm": ">=7.0.0"
   },
   "devDependencies": {
-    "@changesets/cli": "^2.26.2",
-    "@typescript-eslint/eslint-plugin": "^6.2.1",
-    "@typescript-eslint/parser": "^6.2.1",
-    "concurrently": "^8.2.0",
-    "eslint": "^8.46.0",
-    "eslint-config-prettier": "^8.9.0",
-    "eslint-import-resolver-typescript": "^3.5.5",
-    "eslint-plugin-import": "^2.28.0",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "@changesets/cli": "^2.27.1",
+    "@typescript-eslint/eslint-plugin": "^7.8.0",
+    "@typescript-eslint/parser": "^7.8.0",
+    "concurrently": "^8.2.2",
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-import-resolver-typescript": "^3.6.1",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-prettier": "^5.1.3",
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-svelte3": "^4.0.0",
-    "husky": "^8.0.3",
-    "prettier": "^3.0.0",
-    "prettier-plugin-svelte": "^3.0.3"
+    "husky": "^9.0.11",
+    "prettier": "^3.2.5",
+    "prettier-plugin-svelte": "^3.2.3"
   }
  }

packages/extension/package.json

@@ -12,22 +12,22 @@
     "build:sw": "INPUT=sw vite build --config vite.config.input.ts"
   },
   "devDependencies": {
-    "@iconify-icons/mdi": "^1.2.47",
-    "@sveltejs/vite-plugin-svelte": "^2.4.3",
-    "@types/chrome": "^0.0.242",
-    "@types/node": "^20.4.5",
-    "prosemirror-view": "^1.31.7",
-    "rimraf": "^5.0.1",
-    "sass": "^1.64.2",
-    "svelte": "^4.1.2",
-    "svelte-check": "^3.4.6",
-    "svelte-preprocess": "^5.0.4",
-    "typescript": "5.1.6",
-    "vite": "^4.4.8",
-    "vite-tsconfig-paths": "^4.2.0"
+    "@iconify-icons/mdi": "^1.2.48",
+    "@sveltejs/vite-plugin-svelte": "^3.1.0",
+    "@types/chrome": "^0.0.267",
+    "@types/node": "^20.12.8",
+    "prosemirror-view": "^1.33.6",
+    "rimraf": "^5.0.5",
+    "sass": "^1.76.0",
+    "svelte": "^4.2.15",
+    "svelte-check": "^3.7.1",
+    "svelte-preprocess": "^5.1.4",
+    "typescript": "5.4.5",
+    "vite": "^5.2.11",
+    "vite-tsconfig-paths": "^4.3.2"
   },
   "dependencies": {
-    "@iconify/svelte": "^3.1.4",
+    "@iconify/svelte": "^4.0.1",
     "prosemirror-dev-toolkit": "workspace:*"
   }
 }

packages/prosemirror-dev-toolkit/cypress/e2e/devtools.spec.cy.ts

@@ -1,4 +1,4 @@
-const TEST_TEXT = 'asdf qwer'
+const TEST_TEXT1 = 'asdf qwer'
 
 describe('# DevTools', () => {
   it('Should render and allow to be closed / reopened', () => {
@@ -44,10 +44,10 @@ describe('# DevTools', () => {
       cy.devTools().find('ul.tabs-menu li button').contains('HISTORY').click()
       cy.devTools().find('.left-panel').find('li').should('have.length', 0)
 
-      cy.pmInsParagraphBolded(TEST_TEXT)
+      cy.pmInsParagraphBolded(TEST_TEXT1)
       cy.devTools().find('.left-panel').find('li').should('have.length', 1)
 
-      cy.pmInsParagraphBolded(TEST_TEXT)
+      cy.pmInsParagraphBolded(TEST_TEXT1)
       cy.devTools().find('.left-panel').find('li').should('have.length', 2)
 
       cy.window().then(async window => {
@@ -59,7 +59,7 @@ describe('# DevTools', () => {
       cy.devTools().find('ul.tabs-menu li button').contains('HISTORY').click()
       cy.devTools().find('.left-panel').find('li').should('have.length', 0)
 
-      cy.pmInsParagraphBolded(TEST_TEXT)
+      cy.pmInsParagraphBolded(TEST_TEXT1)
       cy.devTools().find('.left-panel').find('li').should('have.length', 1)
     })
   })
@@ -113,7 +113,7 @@ describe('# DevTools', () => {
     cy.devTools().find('ul.tabs-menu li button').contains('HISTORY').click()
     cy.devTools().find('.left-panel').find('li').should('have.length', 0)
 
-    cy.pmInsParagraphBolded(TEST_TEXT)
+    cy.pmInsParagraphBolded(TEST_TEXT1)
     cy.devTools().find('.left-panel').find('li').should('have.length', 1)
   })
 })

packages/prosemirror-dev-toolkit/cypress/e2e/plugins-tab.spec.cy.ts

@@ -28,7 +28,7 @@ describe('# Plugins tab', () => {
       const { editorView: view } = window
       const tr = view.state.tr
       const schema = view.state.schema
-      tr.insert(1, schema.nodes.paragraph.create(null, schema.text(TEST_TEXT)))
+      tr.insert(1, schema.nodes.paragraph.create(null, schema.text(TEST_TEXT1)))
       view.dispatch(tr)
     })
 

packages/prosemirror-dev-toolkit/package.json

@@ -30,45 +30,47 @@
     "cy": "cypress"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.9",
+    "@babel/core": "^7.24.5",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.22.9",
-    "@babel/preset-env": "^7.22.9",
-    "@babel/runtime": "^7.22.6",
+    "@babel/plugin-transform-runtime": "^7.24.3",
+    "@babel/preset-env": "^7.24.5",
+    "@babel/runtime": "^7.24.5",
     "@frsource/cypress-plugin-visual-regression-diff": "^3.3.10",
-    "@rollup/plugin-alias": "^5.0.0",
-    "@rollup/plugin-commonjs": "^25.0.3",
-    "@rollup/plugin-node-resolve": "^15.1.0",
-    "@sveltejs/vite-plugin-svelte": "^2.4.3",
-    "@testing-library/cypress": "9.0.0",
-    "@testing-library/jest-dom": "^5.17.0",
-    "@testing-library/svelte": "^4.0.3",
-    "cypress": "12.14.0",
-    "jsdom": "^22.1.0",
+    "@rollup/plugin-alias": "^5.1.0",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@sveltejs/vite-plugin-svelte": "^3.1.0",
+    "@testing-library/cypress": "10.0.1",
+    "@testing-library/jest-dom": "^6.4.5",
+    "@testing-library/svelte": "^5.1.0",
+    "@types/node": "^20.12.12",
+    "cypress": "13.8.1",
+    "jsdom": "^24.0.0",
     "jsondiffpatch": "^0.4.1",
-    "postcss": "^8.4.27",
+    "postcss": "^8.4.38",
     "prosemirror-example-setup": "^1.2.2",
     "prosemirror-state": "^1.4.3",
-    "prosemirror-view": "^1.31.7",
-    "rimraf": "^5.0.1",
-    "rollup": "^3.27.0",
+    "prosemirror-view": "^1.33.6",
+    "rimraf": "^5.0.5",
+    "rollup": "^4.17.2",
     "rollup-plugin-babel": "^4.4.0",
     "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-svelte": "^7.1.6",
+    "rollup-plugin-svelte": "^7.2.0",
     "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-ts": "^3.2.0",
-    "sass": "^1.64.2",
-    "svelte": "^4.1.2",
-    "svelte-check": "^3.4.6",
-    "svelte-preprocess": "^5.0.4",
-    "tslib": "^2.6.1",
-    "typescript": "^5.1.6",
-    "vite": "^4.4.8",
-    "vitest": "^0.34.1"
+    "rollup-plugin-ts": "^3.4.5",
+    "sass": "^1.76.0",
+    "svelte": "^4.2.15",
+    "svelte-check": "^3.7.1",
+    "svelte-preprocess": "^5.1.4",
+    "tslib": "^2.6.2",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.11",
+    "vite-tsconfig-paths": "^4.3.2",
+    "vitest": "^1.5.3"
   },
   "dependencies": {
     "html": "^1.0.0",
-    "prosemirror-model": "^1.19.3",
+    "prosemirror-model": "^1.20.0",
     "svelte-tree-view": "^1.4.2"
   },
   "files": [

packages/prosemirror-dev-toolkit/src/ProseMirrorDevToolkit.ts

@@ -8,7 +8,7 @@ import { DevToolsOpts } from './types'
 // Using a web component allows toolkit to encapsulate its DOM and CSS styles without affecting
 // the site or being affected by its global stylesheets
 export class ProseMirrorDevToolkit extends HTMLElement {
-  _element?: SvelteComponent
+  private component?: SvelteComponent
 
   constructor() {
     super()
@@ -18,7 +18,7 @@ export class ProseMirrorDevToolkit extends HTMLElement {
       const {
         detail: { view, opts }
       } = event as CustomEvent<{ view: EditorView; opts: DevToolsOpts }>
-      this._element = new DevTools({
+      this.component = new DevTools({
         target: shadowRoot,
         props: {
           view,
@@ -29,6 +29,6 @@ export class ProseMirrorDevToolkit extends HTMLElement {
   }
 
   disconnectedCallback(): void {
-    this._element?.$destroy()
+    this.component?.$destroy()
   }
 }

packages/prosemirror-dev-toolkit/src/__tests__/applyDevTools.spec.ts

@@ -1,7 +1,3 @@
-/**
- * @jest-environment jsdom
- */
-
 import { render, fireEvent } from '@testing-library/svelte'
 import { EditorView } from 'prosemirror-view'
 import { beforeAll, describe, expect, it, vi } from 'vitest'

packages/prosemirror-dev-toolkit/src/__tests__/edge-cases.spec.ts

@@ -1,23 +1,17 @@
-/**
- * @jest-environment jsdom
- */
-
 import { DirectEditorProps, EditorView } from 'prosemirror-view'
 import { exampleSetup } from 'prosemirror-example-setup'
-import { beforeAll, describe, expect, it, SpyInstance, vi } from 'vitest'
+import { beforeAll, describe, expect, it, MockInstance, vi } from 'vitest'
 
 import { applyDevTools, removeDevTools } from '../applyDevTools'
 import { setupEditor } from '../test-utils/setupEditor'
 import { EditorState, Transaction } from 'prosemirror-state'
 import { schema } from '../test-utils/schema'
 
-let view: EditorView
-
 interface Spies {
-  log: SpyInstance
-  info: SpyInstance
-  warn: SpyInstance
-  error: SpyInstance
+  log: MockInstance
+  info: MockInstance
+  warn: MockInstance
+  error: MockInstance
 }
 
 let spies: Spies
@@ -30,7 +24,12 @@ class CustomEditorView extends EditorView {
   }
 }
 
-describe('various-bug.spec', () => {
+describe('edge cases', () => {
+  let editor: EditorView
+  const div = document.createElement('div')
+  div.id = 'pm-editor'
+  document.body.appendChild(div)
+
   beforeAll(() => {
     spies = {
       log: vi.spyOn(console, 'log'),
@@ -40,41 +39,42 @@ describe('various-bug.spec', () => {
     }
   })
 
+  afterEach(() => {
+    if (editor) {
+      editor.destroy()
+    }
+    vi.restoreAllMocks()
+  })
+
   it('should not crash if somebody is using weird CustomEditorView hack which overrides props', () => {
-    const el = document.createElement('div')
-    document.body.appendChild(el)
-    el.id = 'pm-editor'
-    view = new CustomEditorView(el, {
+    editor = new CustomEditorView(div, {
       state: EditorState.create({
         schema,
         plugins: exampleSetup({ schema })
       }),
       dispatchTransaction(tr: Transaction) {
-        view.updateState(view.state.apply(tr))
+        editor.updateState(editor.state.apply(tr))
       }
     })
 
     vi.stubGlobal('prompt', (str: string) => undefined)
 
-    applyDevTools(view, { disableWebComponent: true })
-    view.dispatch(view.state.tr.insert(1, view.state.schema.text('hello')))
+    applyDevTools(editor, { disableWebComponent: true })
+    editor.dispatch(editor.state.tr.insert(1, editor.state.schema.text('hello')))
     expect(spies.log).toHaveBeenCalledTimes(0)
     expect(spies.info).toHaveBeenCalledTimes(0)
     expect(spies.warn).toHaveBeenCalledTimes(0)
     expect(spies.error).toHaveBeenCalledTimes(0)
   })
 
   it('should not run applyDevTools on already destroyed EditorView', () => {
-    const el = document.createElement('div')
-    document.body.appendChild(el)
-    el.id = 'pm-editor'
-    view = setupEditor(el)
+    editor = setupEditor(div)
 
-    applyDevTools(view, { disableWebComponent: true })
-    view.dispatch(view.state.tr.insert(1, view.state.schema.text('hello')))
+    applyDevTools(editor, { disableWebComponent: true })
+    editor.dispatch(editor.state.tr.insert(1, editor.state.schema.text('hello')))
 
-    view.destroy()
-    applyDevTools(view, { disableWebComponent: true })
+    editor.destroy()
+    applyDevTools(editor, { disableWebComponent: true })
 
     expect(spies.log).toHaveBeenCalledTimes(0)
     expect(spies.info).toHaveBeenCalledTimes(0)

packages/prosemirror-dev-toolkit/src/components/__tests__/Button.spec.ts

@@ -1,14 +1,10 @@
-/**
- * @jest-environment jsdom
- */
-
 import { render, fireEvent } from '@testing-library/svelte'
 import Button from '../Button.svelte'
 import { vi } from 'vitest'
 
 // https://sveltesociety.dev/recipes/testing-and-debugging/unit-testing-svelte-component/
 
-describe('Button', () => {
+describe('Button component', () => {
   it('should render', async () => {
     const results = render(Button)
     const onClick = vi.fn()