diff --git a/docs/src/demos/Extensions/History/index.spec.js b/docs/src/demos/Extensions/History/index.spec.js
index 605156ca..e1ee5b9a 100644
--- a/docs/src/demos/Extensions/History/index.spec.js
+++ b/docs/src/demos/Extensions/History/index.spec.js
@@ -13,7 +13,7 @@ context('/demos/Extensions/History', () => {
     cy.get('.ProseMirror')
       .should('contain', 'Mistake')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -30,13 +30,13 @@ context('/demos/Extensions/History', () => {
     cy.get('.ProseMirror')
       .should('contain', 'Mistake')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .should('not.contain', 'Mistake')
 
-    cy.get('.demo__preview button:nth-child(2)')
+    cy.get('button:nth-child(2)')
       .click()
 
     cy.get('.ProseMirror')
diff --git a/docs/src/demos/Extensions/TextAlign/index.spec.js b/docs/src/demos/Extensions/TextAlign/index.spec.js
index e42ad8e7..e7303270 100644
--- a/docs/src/demos/Extensions/TextAlign/index.spec.js
+++ b/docs/src/demos/Extensions/TextAlign/index.spec.js
@@ -38,7 +38,7 @@ context('/demos/Extensions/TextAlign', () => {
   })
 
   it('aligns the text left on the 1st button', () => {
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
@@ -47,7 +47,7 @@ context('/demos/Extensions/TextAlign', () => {
   })
 
   it('aligns the text center on the 2nd button', () => {
-    cy.get('.demo__preview button:nth-child(2)')
+    cy.get('button:nth-child(2)')
       .click()
 
     cy.get('.ProseMirror')
@@ -56,7 +56,7 @@ context('/demos/Extensions/TextAlign', () => {
   })
 
   it('aligns the text right on the 3rd button', () => {
-    cy.get('.demo__preview button:nth-child(3)')
+    cy.get('button:nth-child(3)')
       .click()
 
     cy.get('.ProseMirror')
@@ -65,7 +65,7 @@ context('/demos/Extensions/TextAlign', () => {
   })
 
   it('aligns the text justified on the 4th button', () => {
-    cy.get('.demo__preview button:nth-child(4)')
+    cy.get('button:nth-child(4)')
       .click()
 
     cy.get('.ProseMirror')
@@ -74,7 +74,7 @@ context('/demos/Extensions/TextAlign', () => {
   })
 
   it('aligns the text default on the 5th button', () => {
-    cy.get('.demo__preview button:nth-child(5)')
+    cy.get('button:nth-child(5)')
       .click()
 
     cy.get('.ProseMirror')
diff --git a/docs/src/demos/Marks/Bold/index.spec.js b/docs/src/demos/Marks/Bold/index.spec.js
index 27b11fcb..0a891146 100644
--- a/docs/src/demos/Marks/Bold/index.spec.js
+++ b/docs/src/demos/Marks/Bold/index.spec.js
@@ -41,7 +41,7 @@ context('/demos/Marks/Bold', () => {
   })
 
   it('the button should make the selected text bold', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -50,9 +50,9 @@ context('/demos/Marks/Bold', () => {
   })
 
   it('the button should toggle the selected text bold', () => {
-    cy.get('.demo__preview button:first').click()
+    cy.get('button:first').click()
     cy.get('.ProseMirror').type('{selectall}')
-    cy.get('.demo__preview button:first').click()
+    cy.get('button:first').click()
     cy.get('.ProseMirror strong').should('not.exist')
   })
 
diff --git a/docs/src/demos/Marks/Code/index.spec.js b/docs/src/demos/Marks/Code/index.spec.js
index fb4ce29c..508d2a18 100644
--- a/docs/src/demos/Marks/Code/index.spec.js
+++ b/docs/src/demos/Marks/Code/index.spec.js
@@ -21,7 +21,7 @@ context('/demos/Marks/Code', () => {
   })
 
   it('should mark the selected text as inline code', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -30,13 +30,13 @@ context('/demos/Marks/Code', () => {
   })
 
   it('should toggle the selected text as inline code', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror code')
diff --git a/docs/src/demos/Marks/Highlight/index.spec.js b/docs/src/demos/Marks/Highlight/index.spec.js
index d9e8b45a..7e0b74dc 100644
--- a/docs/src/demos/Marks/Highlight/index.spec.js
+++ b/docs/src/demos/Marks/Highlight/index.spec.js
@@ -14,7 +14,7 @@ context('/demos/Marks/Highlight', () => {
   })
 
   it('the button should highlight the selected text', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -108,13 +108,13 @@ context('/demos/Marks/Highlight', () => {
   })
 
   it('the button should toggle the selected text highlighted', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
diff --git a/docs/src/demos/Marks/Italic/index.spec.js b/docs/src/demos/Marks/Italic/index.spec.js
index 7fd6ff49..1e9b9a50 100644
--- a/docs/src/demos/Marks/Italic/index.spec.js
+++ b/docs/src/demos/Marks/Italic/index.spec.js
@@ -32,7 +32,7 @@ context('/demos/Marks/Italic', () => {
   })
 
   it('the button should make the selected text italic', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -41,13 +41,13 @@ context('/demos/Marks/Italic', () => {
   })
 
   it('the button should toggle the selected text italic', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror em')
diff --git a/docs/src/demos/Marks/Link/index.spec.js b/docs/src/demos/Marks/Link/index.spec.js
index 40b3864a..7255d5e4 100644
--- a/docs/src/demos/Marks/Link/index.spec.js
+++ b/docs/src/demos/Marks/Link/index.spec.js
@@ -35,7 +35,7 @@ context('/demos/Marks/Link', () => {
     cy.window().then(win => {
       cy.stub(win, 'prompt').returns('https://tiptap.dev')
 
-      cy.get('.demo__preview button:first')
+      cy.get('button:first')
         .click()
 
       cy.window().its('prompt').should('be.called')
diff --git a/docs/src/demos/Marks/Strike/index.spec.js b/docs/src/demos/Marks/Strike/index.spec.js
index 526c0441..b3410136 100644
--- a/docs/src/demos/Marks/Strike/index.spec.js
+++ b/docs/src/demos/Marks/Strike/index.spec.js
@@ -39,7 +39,7 @@ context('/demos/Marks/Strike', () => {
   })
 
   it('the button should strike the selected text', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -48,13 +48,13 @@ context('/demos/Marks/Strike', () => {
   })
 
   it('the button should toggle the selected text striked', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
diff --git a/docs/src/demos/Marks/Underline/index.spec.js b/docs/src/demos/Marks/Underline/index.spec.js
index 9e5a95d3..94db9677 100644
--- a/docs/src/demos/Marks/Underline/index.spec.js
+++ b/docs/src/demos/Marks/Underline/index.spec.js
@@ -25,7 +25,7 @@ context('/demos/Marks/Underline', () => {
   })
 
   it('the button should underline the selected text', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -34,13 +34,13 @@ context('/demos/Marks/Underline', () => {
   })
 
   it('the button should toggle the selected text underline', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
diff --git a/docs/src/demos/Nodes/Blockquote/index.spec.js b/docs/src/demos/Nodes/Blockquote/index.spec.js
index b1e597c7..30fa8c45 100644
--- a/docs/src/demos/Nodes/Blockquote/index.spec.js
+++ b/docs/src/demos/Nodes/Blockquote/index.spec.js
@@ -28,7 +28,7 @@ context('/demos/Nodes/Blockquote', () => {
     cy.get('.ProseMirror blockquote')
       .should('not.exist')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -42,7 +42,7 @@ context('/demos/Nodes/Blockquote', () => {
       cy.get('.ProseMirror').type('{selectall}')
     })
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -54,7 +54,7 @@ context('/demos/Nodes/Blockquote', () => {
     cy.get('.ProseMirror blockquote')
       .should('not.exist')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -64,7 +64,7 @@ context('/demos/Nodes/Blockquote', () => {
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror blockquote')
diff --git a/docs/src/demos/Nodes/BulletList/index.spec.js b/docs/src/demos/Nodes/BulletList/index.spec.js
index eea2bfaf..7fc6d344 100644
--- a/docs/src/demos/Nodes/BulletList/index.spec.js
+++ b/docs/src/demos/Nodes/BulletList/index.spec.js
@@ -31,7 +31,7 @@ context('/demos/Nodes/BulletList', () => {
     cy.get('.ProseMirror ul li')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
@@ -47,14 +47,14 @@ context('/demos/Nodes/BulletList', () => {
     cy.get('.ProseMirror ul')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
       .find('ul')
       .should('contain', 'Example Text')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror ul')
diff --git a/docs/src/demos/Nodes/CodeBlock/index.spec.js b/docs/src/demos/Nodes/CodeBlock/index.spec.js
index de94f670..898de8c0 100644
--- a/docs/src/demos/Nodes/CodeBlock/index.spec.js
+++ b/docs/src/demos/Nodes/CodeBlock/index.spec.js
@@ -25,7 +25,7 @@ context('/demos/Nodes/CodeBlock', () => {
   })
 
   it('the button should make the selected line a code block', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -34,7 +34,7 @@ context('/demos/Nodes/CodeBlock', () => {
   })
 
   it('the button should toggle the code block', () => {
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror')
@@ -44,7 +44,7 @@ context('/demos/Nodes/CodeBlock', () => {
     cy.get('.ProseMirror')
       .type('{selectall}')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror pre')
diff --git a/docs/src/demos/Nodes/HardBreak/index.spec.js b/docs/src/demos/Nodes/HardBreak/index.spec.js
index 73670dd0..0f22ad07 100644
--- a/docs/src/demos/Nodes/HardBreak/index.spec.js
+++ b/docs/src/demos/Nodes/HardBreak/index.spec.js
@@ -27,7 +27,7 @@ context('/demos/Nodes/HardBreak', () => {
     cy.get('.ProseMirror br')
       .should('not.exist')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror br')
diff --git a/docs/src/demos/Nodes/Heading/index.spec.js b/docs/src/demos/Nodes/Heading/index.spec.js
index 784239ca..8a9179bc 100644
--- a/docs/src/demos/Nodes/Heading/index.spec.js
+++ b/docs/src/demos/Nodes/Heading/index.spec.js
@@ -36,7 +36,7 @@ context('/demos/Nodes/Heading', () => {
     cy.get('.ProseMirror h1')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
@@ -48,7 +48,7 @@ context('/demos/Nodes/Heading', () => {
     cy.get('.ProseMirror h2')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(2)')
+    cy.get('button:nth-child(2)')
       .click()
 
     cy.get('.ProseMirror')
@@ -60,7 +60,7 @@ context('/demos/Nodes/Heading', () => {
     cy.get('.ProseMirror h3')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(3)')
+    cy.get('button:nth-child(3)')
       .click()
 
     cy.get('.ProseMirror')
@@ -72,14 +72,14 @@ context('/demos/Nodes/Heading', () => {
     cy.get('.ProseMirror h1')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
       .find('h1')
       .should('contain', 'Example Text')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror h1')
diff --git a/docs/src/demos/Nodes/HorizontalRule/index.spec.js b/docs/src/demos/Nodes/HorizontalRule/index.spec.js
index b88c7eb6..0013e305 100644
--- a/docs/src/demos/Nodes/HorizontalRule/index.spec.js
+++ b/docs/src/demos/Nodes/HorizontalRule/index.spec.js
@@ -27,7 +27,7 @@ context('/demos/Nodes/HorizontalRule', () => {
     cy.get('.ProseMirror hr')
       .should('not.exist')
 
-    cy.get('.demo__preview button:first')
+    cy.get('button:first')
       .click()
 
     cy.get('.ProseMirror hr')
diff --git a/docs/src/demos/Nodes/Image/index.spec.js b/docs/src/demos/Nodes/Image/index.spec.js
index 2e0271e9..f2357782 100644
--- a/docs/src/demos/Nodes/Image/index.spec.js
+++ b/docs/src/demos/Nodes/Image/index.spec.js
@@ -14,7 +14,7 @@ context('/demos/Nodes/Image', () => {
     cy.window().then(win => {
       cy.stub(win, 'prompt').returns('foobar.png')
 
-      cy.get('.demo__preview button:first')
+      cy.get('button:first')
         .click()
 
       cy.window().its('prompt').should('be.called')
diff --git a/docs/src/demos/Nodes/OrderedList/index.spec.js b/docs/src/demos/Nodes/OrderedList/index.spec.js
index 8825cd6d..85706502 100644
--- a/docs/src/demos/Nodes/OrderedList/index.spec.js
+++ b/docs/src/demos/Nodes/OrderedList/index.spec.js
@@ -31,7 +31,7 @@ context('/demos/Nodes/OrderedList', () => {
     cy.get('.ProseMirror ol li')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
@@ -47,14 +47,14 @@ context('/demos/Nodes/OrderedList', () => {
     cy.get('.ProseMirror ol')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
       .find('ol')
       .should('contain', 'Example Text')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror ol')
diff --git a/docs/src/demos/Nodes/TaskList/index.spec.js b/docs/src/demos/Nodes/TaskList/index.spec.js
index 00a0e01c..97fb08ac 100644
--- a/docs/src/demos/Nodes/TaskList/index.spec.js
+++ b/docs/src/demos/Nodes/TaskList/index.spec.js
@@ -31,7 +31,7 @@ context('/demos/Nodes/TaskList', () => {
     cy.get('.ProseMirror ul li')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
@@ -47,14 +47,14 @@ context('/demos/Nodes/TaskList', () => {
     cy.get('.ProseMirror ul')
       .should('not.exist')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror')
       .find('ul[data-type="taskList"]')
       .should('contain', 'Example Text')
 
-    cy.get('.demo__preview button:nth-child(1)')
+    cy.get('button:nth-child(1)')
       .click()
 
     cy.get('.ProseMirror ul')