From 808b806db8b5649704746b13a57ac399bd8910df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 11 Sep 2020 18:06:13 +0200
Subject: [PATCH] store editor in dom element

---
 .../Examples/ExportHtmlOrJson/index.spec.js   |  6 ++---
 docs/src/demos/Examples/Focus/index.spec.js   |  3 +--
 docs/src/demos/Examples/History/index.spec.js |  9 +++-----
 .../Examples/MarkdownShortcuts/index.spec.js  |  3 +--
 .../src/demos/Examples/ReadOnly/index.spec.js |  6 ++---
 .../demos/Extensions/Blockquote/index.spec.js |  3 +--
 docs/src/demos/Extensions/Bold/index.spec.js  |  3 +--
 docs/src/demos/Extensions/Code/index.spec.js  |  3 +--
 .../demos/Extensions/CodeBlock/index.spec.js  |  3 +--
 .../demos/Extensions/HardBreak/index.spec.js  |  3 +--
 .../demos/Extensions/Heading/index.spec.js    |  3 +--
 .../demos/Extensions/History/index.spec.js    | 23 ++++++++-----------
 .../Extensions/HorizontalRule/index.spec.js   |  9 +++-----
 .../src/demos/Extensions/Italic/index.spec.js |  3 +--
 .../demos/Extensions/Paragraph/index.spec.js  |  3 +--
 .../src/demos/Extensions/Strike/index.spec.js |  3 +--
 .../demos/Extensions/Underline/index.spec.js  |  3 +--
 packages/core/src/Editor.ts                   | 14 +++++++++++
 18 files changed, 45 insertions(+), 58 deletions(-)

diff --git a/docs/src/demos/Examples/ExportHtmlOrJson/index.spec.js b/docs/src/demos/Examples/ExportHtmlOrJson/index.spec.js
index 4f327eff..2e51a3dd 100644
--- a/docs/src/demos/Examples/ExportHtmlOrJson/index.spec.js
+++ b/docs/src/demos/Examples/ExportHtmlOrJson/index.spec.js
@@ -4,8 +4,7 @@ context('/examples/export-html-or-json', () => {
   })
 
   it('should return json', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       const json = editor.json()
 
       expect(json).to.deep.equal({
@@ -52,8 +51,7 @@ context('/examples/export-html-or-json', () => {
   })
 
   it('should return html', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       const html = editor.html()
 
       expect(html).to.equal('<p>You are able to export your data as <code>HTML</code> or <code>JSON</code>.</p>')
diff --git a/docs/src/demos/Examples/Focus/index.spec.js b/docs/src/demos/Examples/Focus/index.spec.js
index dc4c2255..fd963af4 100644
--- a/docs/src/demos/Examples/Focus/index.spec.js
+++ b/docs/src/demos/Examples/Focus/index.spec.js
@@ -4,8 +4,7 @@ context('/examples/focus', () => {
   })
 
   it('should have class', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.focus('start')
 
       cy.get('.ProseMirror p:first').should('have.class', 'has-focus')
diff --git a/docs/src/demos/Examples/History/index.spec.js b/docs/src/demos/Examples/History/index.spec.js
index 66261f5e..d1f6a695 100644
--- a/docs/src/demos/Examples/History/index.spec.js
+++ b/docs/src/demos/Examples/History/index.spec.js
@@ -4,8 +4,7 @@ context('/examples/history', () => {
   })
 
   it('should not have a mistake', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       const html = editor.html()
 
       cy.get('.ProseMirror h2:first').should('not.contain', 'Mistake')
@@ -13,8 +12,7 @@ context('/examples/history', () => {
   })
 
   it('should have a mistake', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       const html = editor.html()
 
       editor.insertText('Mistake')
@@ -23,8 +21,7 @@ context('/examples/history', () => {
   })
 
   it('the mistake should be removed again', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       const html = editor.html()
 
       editor.undo()
diff --git a/docs/src/demos/Examples/MarkdownShortcuts/index.spec.js b/docs/src/demos/Examples/MarkdownShortcuts/index.spec.js
index e97f398c..7f204beb 100644
--- a/docs/src/demos/Examples/MarkdownShortcuts/index.spec.js
+++ b/docs/src/demos/Examples/MarkdownShortcuts/index.spec.js
@@ -4,8 +4,7 @@ context('/examples/markdown-shortcuts', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.clearContent()
       done()
     })
diff --git a/docs/src/demos/Examples/ReadOnly/index.spec.js b/docs/src/demos/Examples/ReadOnly/index.spec.js
index a47fe212..88e79df5 100644
--- a/docs/src/demos/Examples/ReadOnly/index.spec.js
+++ b/docs/src/demos/Examples/ReadOnly/index.spec.js
@@ -4,10 +4,9 @@ context('/examples/read-only', () => {
   })
 
   it.skip('should be read-only', () => {
-    cy.get('.ProseMirror').window().then(window => {
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       cy.get('#editable').uncheck()
 
-      const { editor } = window
       editor.insertText('Edited: ')
 
       cy.get('.ProseMirror p:first').should('not.contain', 'Edited: ')
@@ -15,10 +14,9 @@ context('/examples/read-only', () => {
   })
 
   it.skip('should be editable', () => {
-    cy.get('.ProseMirror').window().then(window => {
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       cy.get('#editable').check()
 
-      const { editor } = window
       editor.insertText('Edited: ')
 
       cy.get('.ProseMirror p:first').should('contain', 'Edited: ')
diff --git a/docs/src/demos/Extensions/Blockquote/index.spec.js b/docs/src/demos/Extensions/Blockquote/index.spec.js
index 4a6f3ee5..3fe8009d 100644
--- a/docs/src/demos/Extensions/Blockquote/index.spec.js
+++ b/docs/src/demos/Extensions/Blockquote/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/blockquote', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/Bold/index.spec.js b/docs/src/demos/Extensions/Bold/index.spec.js
index 98ac79a2..b2048443 100644
--- a/docs/src/demos/Extensions/Bold/index.spec.js
+++ b/docs/src/demos/Extensions/Bold/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/bold', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/Code/index.spec.js b/docs/src/demos/Extensions/Code/index.spec.js
index f10f9b02..0655bb65 100644
--- a/docs/src/demos/Extensions/Code/index.spec.js
+++ b/docs/src/demos/Extensions/Code/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/code', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/CodeBlock/index.spec.js b/docs/src/demos/Extensions/CodeBlock/index.spec.js
index e3321905..17ec012a 100644
--- a/docs/src/demos/Extensions/CodeBlock/index.spec.js
+++ b/docs/src/demos/Extensions/CodeBlock/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/code-block', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/HardBreak/index.spec.js b/docs/src/demos/Extensions/HardBreak/index.spec.js
index d68baf3e..016e34d1 100644
--- a/docs/src/demos/Extensions/HardBreak/index.spec.js
+++ b/docs/src/demos/Extensions/HardBreak/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/hard-break', () => {
   })
 
   beforeEach(() => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
     })
   })
diff --git a/docs/src/demos/Extensions/Heading/index.spec.js b/docs/src/demos/Extensions/Heading/index.spec.js
index aa6aeecc..4fce5328 100644
--- a/docs/src/demos/Extensions/Heading/index.spec.js
+++ b/docs/src/demos/Extensions/Heading/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/heading', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/History/index.spec.js b/docs/src/demos/Extensions/History/index.spec.js
index c3aef532..43dc7e47 100644
--- a/docs/src/demos/Extensions/History/index.spec.js
+++ b/docs/src/demos/Extensions/History/index.spec.js
@@ -4,19 +4,16 @@ context('/api/extensions/history', () => {
   })
 
   beforeEach(() => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Mistake</p>')
     })
   })
 
   it('should make the last change undone', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      cy.get('.ProseMirror').should('contain', 'Mistake')
+    cy.get('.ProseMirror').should('contain', 'Mistake')
 
-      cy.get('.demo__preview button:first').click({ force: true })
-      cy.get('.ProseMirror').should('not.contain', 'Mistake')
-    })
+    cy.get('.demo__preview button:first').click({ force: true })
+    cy.get('.ProseMirror').should('not.contain', 'Mistake')
   })
 
   it('the keyboard shortcut should make the last change undone', () => {
@@ -25,14 +22,12 @@ context('/api/extensions/history', () => {
   })
 
   it('should apply the last undone change again', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      cy.get('.ProseMirror').should('contain', 'Mistake')
+    cy.get('.ProseMirror').should('contain', 'Mistake')
 
-      cy.get('.demo__preview button:first').click({ force: true })
-      cy.get('.ProseMirror').should('not.contain', 'Mistake')
-      cy.get('.demo__preview button:nth-child(2)').click({ force: true })
-      cy.get('.ProseMirror').should('contain', 'Mistake')
-    })
+    cy.get('.demo__preview button:first').click({ force: true })
+    cy.get('.ProseMirror').should('not.contain', 'Mistake')
+    cy.get('.demo__preview button:nth-child(2)').click({ force: true })
+    cy.get('.ProseMirror').should('contain', 'Mistake')
   })
 
   it.skip('the keyboard shortcut should apply the last undone change again', () => {
diff --git a/docs/src/demos/Extensions/HorizontalRule/index.spec.js b/docs/src/demos/Extensions/HorizontalRule/index.spec.js
index 41163de2..75b8f105 100644
--- a/docs/src/demos/Extensions/HorizontalRule/index.spec.js
+++ b/docs/src/demos/Extensions/HorizontalRule/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/horizontal-rule', () => {
   })
 
   beforeEach(() => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
     })
   })
@@ -17,8 +16,7 @@ context('/api/extensions/horizontal-rule', () => {
   })
 
   it('the default markdown shortcut should add a horizontal rule', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.clearContent()
 
       cy.get('.ProseMirror hr').should('not.exist')
@@ -28,8 +26,7 @@ context('/api/extensions/horizontal-rule', () => {
   })
 
   it('the alternative markdown shortcut should add a horizontal rule', () => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.clearContent()
 
       cy.get('.ProseMirror hr').should('not.exist')
diff --git a/docs/src/demos/Extensions/Italic/index.spec.js b/docs/src/demos/Extensions/Italic/index.spec.js
index c29cb392..54033d22 100644
--- a/docs/src/demos/Extensions/Italic/index.spec.js
+++ b/docs/src/demos/Extensions/Italic/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/italic', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/Paragraph/index.spec.js b/docs/src/demos/Extensions/Paragraph/index.spec.js
index f1ab8688..934b14c1 100644
--- a/docs/src/demos/Extensions/Paragraph/index.spec.js
+++ b/docs/src/demos/Extensions/Paragraph/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/paragraph', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.clearContent()
       done()
     })
diff --git a/docs/src/demos/Extensions/Strike/index.spec.js b/docs/src/demos/Extensions/Strike/index.spec.js
index c1d80daf..7e1e53fa 100644
--- a/docs/src/demos/Extensions/Strike/index.spec.js
+++ b/docs/src/demos/Extensions/Strike/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/strike', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/docs/src/demos/Extensions/Underline/index.spec.js b/docs/src/demos/Extensions/Underline/index.spec.js
index 4e26ca91..096e71be 100644
--- a/docs/src/demos/Extensions/Underline/index.spec.js
+++ b/docs/src/demos/Extensions/Underline/index.spec.js
@@ -4,8 +4,7 @@ context('/api/extensions/underline', () => {
   })
 
   beforeEach((done) => {
-    cy.get('.ProseMirror').window().then(window => {
-      const { editor } = window
+    cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.setContent('<p>Example Text</p>')
       editor.selectAll()
       done()
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 7ac2742d..76b31fa7 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -28,6 +28,16 @@ export interface CommandSpec {
 
 type EditorContent = string | JSON | null
 
+// interface Element {
+//   editor?: Editor
+// }
+
+interface HTMLElement {
+  editor?: Editor
+}
+
+// Element.prototype.editor = Editor
+
 interface EditorOptions {
   element: Element,
   content: EditorContent,
@@ -241,6 +251,10 @@ export class Editor extends EventEmitter {
       dispatchTransaction: this.dispatchTransaction.bind(this),
       nodeViews: this.extensionManager.nodeViews,
     })
+
+    // store editor in dom element for better testing
+    const dom = this.view.dom as HTMLElement
+    dom.editor = this.proxy
   }
 
   /**