diff --git a/cypress/integration/examples/checkLists.ts b/cypress/integration/examples/check-lists.ts
similarity index 100%
rename from cypress/integration/examples/checkLists.ts
rename to cypress/integration/examples/check-lists.ts
diff --git a/cypress/integration/examples/editable-voids.ts b/cypress/integration/examples/editable-voids.ts
new file mode 100644
index 000000000..2367d1d6a
--- /dev/null
+++ b/cypress/integration/examples/editable-voids.ts
@@ -0,0 +1,28 @@
+describe('editable voids', () => {
+  const elements = [
+    { tag: 'h4', count: 3 },
+    { tag: 'input[type="text"]', count: 1 },
+    { tag: 'input[type="radio"]', count: 2 },
+  ]
+
+  beforeEach(() => {
+    cy.visit('examples/editable-voids')
+  })
+
+  it('checks for the elements', () => {
+    elements.forEach(({ tag, count }) => {
+      cy.get(tag).should('have.length', count)
+    })
+  })
+
+  it('should double the elements', () => {
+    // click the `+` sign to duplicate the editable void
+    cy.get('span.material-icons')
+      .eq(1)
+      .click()
+
+    elements.forEach(({ tag, count }) => {
+      cy.get(tag).should('have.length', count * 2)
+    })
+  })
+})
diff --git a/cypress/integration/examples/embeds.ts b/cypress/integration/examples/embeds.ts
new file mode 100644
index 000000000..f019b7f3f
--- /dev/null
+++ b/cypress/integration/examples/embeds.ts
@@ -0,0 +1,14 @@
+describe('embeds example', () => {
+  const slateEditor = 'div[data-slate-editor="true"]'
+
+  beforeEach(() => {
+    cy.visit('examples/embeds')
+  })
+
+  it('contains embeded', () => {
+    cy.get(slateEditor)
+      .find('iframe')
+      .should('exist')
+      .should('have.length', 1)
+  })
+})
diff --git a/cypress/integration/examples/forced-layout.ts b/cypress/integration/examples/forced-layout.ts
new file mode 100644
index 000000000..e534d170c
--- /dev/null
+++ b/cypress/integration/examples/forced-layout.ts
@@ -0,0 +1,27 @@
+describe('forced layout example', () => {
+  const elements = [
+    { tag: 'h2', count: 1 },
+    { tag: 'p', count: 1 },
+  ]
+
+  beforeEach(() => {
+    cy.visit('examples/forced-layout')
+  })
+
+  it('checks for the elements', () => {
+    elements.forEach(({ tag, count }) => {
+      cy.get(tag).should('have.length', count)
+    })
+  })
+
+  it('checks if elements persist even after everything is deleted', () => {
+    // clear the textbox
+    cy.get('div[role="textbox"]')
+      .type(`{selectall}`)
+      .clear()
+
+    elements.forEach(({ tag, count }) => {
+      cy.get(tag).should('have.length', count)
+    })
+  })
+})
diff --git a/cypress/integration/examples/hovering-toolbar.ts b/cypress/integration/examples/hovering-toolbar.ts
new file mode 100644
index 000000000..1fe2e5e68
--- /dev/null
+++ b/cypress/integration/examples/hovering-toolbar.ts
@@ -0,0 +1,21 @@
+describe('hovering toolbar example', () => {
+  beforeEach(() => {
+    cy.visit('examples/hovering-toolbar')
+  })
+
+  it('hovering toolbar appears', () => {
+    cy.get('div')
+      .eq(13)
+      .should('not.exist')
+
+    cy.get('span[data-slate-string="true"]')
+      .eq(0)
+      .type(`{selectall}`)
+      .get('div')
+      .eq(13)
+      .should('exist')
+      .should('have.css', 'opacity', '1')
+      .find('span.material-icons')
+      .should('have.length', 3)
+  })
+})
diff --git a/cypress/integration/examples/huge-document.ts b/cypress/integration/examples/huge-document.ts
new file mode 100644
index 000000000..b13e1d171
--- /dev/null
+++ b/cypress/integration/examples/huge-document.ts
@@ -0,0 +1,16 @@
+describe('huge document example', () => {
+  const elements = [
+    { tag: 'h1', count: 100 },
+    { tag: 'p', count: 700 },
+  ]
+
+  beforeEach(() => {
+    cy.visit('examples/huge-document')
+  })
+
+  it('contains image', () => {
+    elements.forEach(({ tag, count }) => {
+      cy.get(tag).should('have.length', count)
+    })
+  })
+})
diff --git a/cypress/integration/examples/images.ts b/cypress/integration/examples/images.ts
new file mode 100644
index 000000000..ee5b26c4e
--- /dev/null
+++ b/cypress/integration/examples/images.ts
@@ -0,0 +1,12 @@
+describe('images example', () => {
+  beforeEach(() => {
+    cy.visit('examples/images')
+  })
+
+  it('contains image', () => {
+    cy.findByRole('textbox')
+      .find('img')
+      .should('exist')
+      .should('have.length', 1)
+  })
+})
diff --git a/cypress/integration/examples/markdown-preview.ts b/cypress/integration/examples/markdown-preview.ts
new file mode 100644
index 000000000..18f4978f3
--- /dev/null
+++ b/cypress/integration/examples/markdown-preview.ts
@@ -0,0 +1,19 @@
+describe('markdown preview', () => {
+  const slateEditor = 'div[data-slate-editor="true"]'
+  const markdown = 'span[data-slate-string="true"]'
+
+  beforeEach(() => {
+    cy.visit('examples/markdown-preview')
+  })
+
+  it('checks for markdown', () => {
+    cy.get(slateEditor)
+      .find(markdown)
+      .should('have.length', 9)
+
+    cy.get(slateEditor)
+      .type('{movetoend}{enter}## Try it out!{enter}')
+      .find(markdown)
+      .should('have.length', 10)
+  })
+})