chore(bubbles): ✅ Add e2e tests

2022-01-07 07:33:01 +01:00
parent 6fe27bd8ea
commit 2a040308db
6 changed files with 107 additions and 18 deletions
--- a/apps/builder/cypress/tests/bubbles.ts
+++ b/apps/builder/cypress/tests/bubbles.ts
@ -0,0 +1,78 @@
+import { parseTestTypebot } from 'cypress/plugins/utils'
+import { StepType } from 'models'
+
+describe('Text bubbles', () => {
+  beforeEach(() => {
+    cy.task('seed')
+    cy.task(
+      'createTypebot',
+      parseTestTypebot({
+        id: 'typebot3',
+        name: 'Typebot #3',
+        ownerId: 'test2',
+        steps: {
+          byId: {
+            step1: {
+              id: 'step1',
+              blockId: 'block1',
+              type: StepType.TEXT,
+              content: { html: '', plainText: '', richText: [] },
+            },
+          },
+          allIds: ['step1'],
+        },
+        blocks: {
+          byId: {
+            block1: {
+              id: 'block1',
+              graphCoordinates: { x: 400, y: 200 },
+              title: 'Block #1',
+              stepIds: ['step1'],
+            },
+          },
+          allIds: ['block1'],
+        },
+      })
+    )
+    cy.signOut()
+  })
+
+  it('rich text features should work', () => {
+    cy.signIn('test2@gmail.com')
+    cy.visit('/typebots/typebot3/edit')
+    cy.findByTestId('bold-button').click()
+    cy.findByRole('textbox', { name: 'Text editor' }).type('Bold text{enter}')
+    cy.findByTestId('bold-button').click()
+    cy.findByTestId('italic-button').click()
+    cy.findByRole('textbox', { name: 'Text editor' }).type('Italic text{enter}')
+    cy.findByTestId('italic-button').click()
+    cy.findByTestId('underline-button').click()
+    cy.findByRole('textbox', { name: 'Text editor' }).type(
+      'Underlined text{enter}'
+    )
+    cy.findByTestId('bold-button').click()
+    cy.findByTestId('italic-button').click()
+    cy.findByRole('textbox', { name: 'Text editor' }).type('Everything text')
+    cy.findByRole('button', { name: 'Preview' }).click()
+    getIframeBody()
+      .get('span.slate-bold')
+      .should('exist')
+      .should('contain.text', 'Bold text')
+    getIframeBody()
+      .get('span.slate-italic')
+      .should('exist')
+      .should('contain.text', 'Italic text')
+    getIframeBody()
+      .get('span.slate-underline')
+      .should('exist')
+      .should('contain.text', 'Underlined text')
+  })
+})
+
+const getIframeBody = () => {
+  return cy
+    .get('#typebot-iframe')
+    .its('0.contentDocument.body')
+    .should('not.be.empty')
+    .then(cy.wrap)
+}