feat(integration): ✨ Add Google Analytics integration

apps/builder/cypress/tests/integrations/googleAnalytics.ts

@@ -0,0 +1,36 @@
+import { createTypebotWithStep } from 'cypress/plugins/data'
+import { preventUserFromRefreshing } from 'cypress/plugins/utils'
+import { IntegrationStepType } from 'models'
+
+describe('Google Analytics', () => {
+  beforeEach(() => {
+    cy.task('seed')
+    createTypebotWithStep({ type: IntegrationStepType.GOOGLE_ANALYTICS })
+    cy.signOut()
+  })
+
+  afterEach(() => {
+    cy.window().then((win) => {
+      win.removeEventListener('beforeunload', preventUserFromRefreshing)
+    })
+  })
+
+  it.only('can be filled correctly', () => {
+    cy.signIn('test2@gmail.com')
+    cy.visit('/typebots/typebot3/edit')
+    cy.intercept({
+      url: '/g/collect',
+      method: 'POST',
+    }).as('gaRequest')
+    cy.findByTestId('step-step1').click()
+    cy.findByRole('textbox', { name: 'Tracking ID:' }).type('G-VWX9WG1TNS')
+    cy.findByRole('textbox', { name: 'Event category:' }).type('Typebot')
+    cy.findByRole('textbox', { name: 'Event action:' }).type('Submit email')
+    cy.findByRole('button', { name: 'Advanced' }).click()
+    cy.findByRole('textbox', { name: 'Event label Optional :' }).type(
+      'Campaign Z'
+    )
+    cy.findByRole('textbox', { name: 'Event value Optional :' }).type('20')
+    // Not sure how to test if GA integration works correctly in the preview tab
+  })
+})

apps/builder/cypress/tests/integrations/googleSheets.ts

@@ -0,0 +1,139 @@
+import { preventUserFromRefreshing } from 'cypress/plugins/utils'
+import { getIframeBody } from 'cypress/support'
+
+describe('Google sheets', () => {
+  beforeEach(() => {
+    cy.task('seed', Cypress.env('GOOGLE_SHEETS_REFRESH_TOKEN'))
+    cy.signOut()
+  })
+
+  afterEach(() => {
+    cy.window().then((win) => {
+      win.removeEventListener('beforeunload', preventUserFromRefreshing)
+    })
+  })
+
+  it('Insert row should work', () => {
+    cy.intercept({
+      url: '/api/integrations/google-sheets/spreadsheets/1k_pIDw3YHl9tlZusbBVSBRY0PeRPd2H6t4Nj7rwnOtM/sheets/0',
+      method: 'POST',
+    }).as('insertRowInGoogleSheets')
+    cy.loadTypebotFixtureInDatabase('typebots/integrations/googleSheets.json')
+    cy.signIn('test2@gmail.com')
+    cy.visit('/typebots/typebot4/edit')
+
+    fillInSpreadsheetInfo()
+
+    cy.findByRole('button', { name: 'Select an operation' }).click()
+    cy.findByRole('menuitem', { name: 'Insert a row' }).click({ force: true })
+
+    cy.findByRole('button', { name: 'Select a column' }).click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+    cy.findByRole('button', { name: 'Insert a variable' }).click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+
+    cy.findByRole('button', { name: 'Add' }).click()
+
+    cy.findByRole('button', { name: 'Select a column' }).click()
+    cy.findByRole('menuitem', { name: 'First name' }).click()
+    cy.findAllByPlaceholderText('Type a value...').last().type('Georges')
+
+    cy.findByRole('button', { name: 'Preview' }).click()
+    getIframeBody()
+      .findByPlaceholderText('Type your email...')
+      .type('georges@gmail.com{enter}')
+    cy.wait('@insertRowInGoogleSheets')
+      .then((interception) => {
+        return interception.response?.statusCode
+      })
+      .should('eq', 200)
+  })
+
+  it('Update row should work', () => {
+    cy.intercept({
+      url: '/api/integrations/google-sheets/spreadsheets/1k_pIDw3YHl9tlZusbBVSBRY0PeRPd2H6t4Nj7rwnOtM/sheets/0',
+      method: 'PATCH',
+    }).as('updateRowInGoogleSheets')
+    cy.loadTypebotFixtureInDatabase('typebots/integrations/googleSheets.json')
+    cy.signIn('test2@gmail.com')
+    cy.visit('/typebots/typebot4/edit')
+
+    fillInSpreadsheetInfo()
+
+    cy.findByRole('button', { name: 'Select an operation' }).click()
+    cy.findByRole('menuitem', { name: 'Update a row' }).click({ force: true })
+
+    cy.findAllByRole('button', { name: 'Select a column' }).first().click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+    cy.findAllByRole('button', { name: 'Insert a variable' }).first().click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+
+    cy.findByRole('button', { name: 'Select a column' }).click()
+    cy.findByRole('menuitem', { name: 'Last name' }).click()
+    cy.findAllByPlaceholderText('Type a value...').last().type('Last name')
+
+    cy.findByRole('button', { name: 'Preview' }).click()
+    getIframeBody()
+      .findByPlaceholderText('Type your email...')
+      .type('test@test.com{enter}')
+    cy.wait('@updateRowInGoogleSheets')
+      .then((interception) => {
+        return interception.response?.statusCode
+      })
+      .should('eq', 200)
+  })
+
+  it('Get row should work', () => {
+    cy.loadTypebotFixtureInDatabase(
+      'typebots/integrations/googleSheetsGet.json'
+    )
+    cy.signIn('test2@gmail.com')
+    cy.visit('/typebots/typebot4/edit')
+
+    fillInSpreadsheetInfo()
+
+    cy.findByRole('button', { name: 'Select an operation' }).click()
+    cy.findByRole('menuitem', { name: 'Get data from sheet' }).click({
+      force: true,
+    })
+
+    cy.findAllByRole('button', { name: 'Select a column' }).first().click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+    cy.findByRole('button', { name: 'Insert a variable' }).click()
+    cy.findByRole('menuitem', { name: 'Email' }).click()
+
+    cy.findByRole('button', { name: 'Select a column' }).click()
+    cy.findByRole('menuitem', { name: 'First name' }).click()
+    createNewVar('First name')
+
+    cy.findByRole('button', { name: 'Add' }).click()
+
+    cy.findByRole('button', { name: 'Select a column' }).click()
+    cy.findByRole('menuitem', { name: 'Last name' }).click()
+    createNewVar('Last name')
+
+    cy.findByRole('button', { name: 'Preview' }).click()
+    getIframeBody()
+      .findByPlaceholderText('Type your email...')
+      .type('test2@test.com{enter}')
+    getIframeBody().findByText('Your name is: John Smith').should('exist')
+  })
+})
+
+const fillInSpreadsheetInfo = () => {
+  cy.findByTestId('step-step1').click()
+
+  cy.findByRole('button', { name: 'Select an account' }).click()
+  cy.findByRole('menuitem', { name: 'test2@gmail.com' }).click()
+
+  cy.findByPlaceholderText('Search for spreadsheet').type('CR')
+  cy.findByRole('menuitem', { name: 'CRM' }).click()
+
+  cy.findByPlaceholderText('Select the sheet').type('Sh')
+  cy.findByRole('menuitem', { name: 'Sheet1' }).click()
+}
+
+const createNewVar = (name: string) => {
+  cy.findAllByTestId('variables-input').last().type(name)
+  cy.findByRole('menuitem', { name: `Create "${name}"` }).click()
+}