feat: ✨ Add new onboarding flow

2022-03-23 09:56:39 +01:00
parent f9aba27aae
commit f4e6f63b26
32 changed files with 1115 additions and 89 deletions
--- a/apps/viewer/playwright/fixtures/typebots/predefinedVariables.json
+++ b/apps/viewer/playwright/fixtures/typebots/predefinedVariables.json
@ -0,0 +1,122 @@
+{
+  "id": "cl13bgvlm0050t71aq6a3w777",
+  "createdAt": "2022-03-23T08:41:30.106Z",
+  "updatedAt": "2022-03-23T08:41:30.106Z",
+  "name": "My typebot",
+  "ownerId": "cl139ni700000481a01gxhw4z",
+  "publishedTypebotId": null,
+  "folderId": null,
+  "blocks": [
+    {
+      "id": "cl13bgvlk0000t71a4wabccvw",
+      "steps": [
+        {
+          "id": "cl13bgvlk0001t71a3pilbj53",
+          "type": "start",
+          "label": "Start",
+          "blockId": "cl13bgvlk0000t71a4wabccvw",
+          "outgoingEdgeId": "cl13bgz4800062e6dv7ejcchb"
+        }
+      ],
+      "title": "Start",
+      "graphCoordinates": { "x": 0, "y": 0 }
+    },
+    {
+      "id": "cl13bgy1s00042e6dao1wyobm",
+      "graphCoordinates": { "x": 329, "y": 65 },
+      "title": "Block #1",
+      "steps": [
+        {
+          "id": "cl13bgy1w00052e6d5x57wt7o",
+          "blockId": "cl13bgy1s00042e6dao1wyobm",
+          "type": "text",
+          "content": {
+            "html": "<div>Hey I know you!</div>",
+            "richText": [
+              { "type": "p", "children": [{ "text": "Hey I know you!" }] }
+            ],
+            "plainText": "Hey I know you!"
+          }
+        },
+        {
+          "id": "cl13bh6jd00072e6dftdirwy4",
+          "blockId": "cl13bgy1s00042e6dao1wyobm",
+          "type": "text",
+          "content": {
+            "html": "<div>Your name is {{Name}}</div>",
+            "richText": [
+              { "type": "p", "children": [{ "text": "Your name is {{Name}}" }] }
+            ],
+            "plainText": "Your name is {{Name}}"
+          }
+        },
+        {
+          "id": "cl13bhfxd00092e6dydvcqlhm",
+          "blockId": "cl13bgy1s00042e6dao1wyobm",
+          "type": "text",
+          "content": {
+            "html": "<div>What&#x27;s your email?</div>",
+            "richText": [
+              { "type": "p", "children": [{ "text": "What's your email?" }] }
+            ],
+            "plainText": "What's your email?"
+          }
+        },
+        {
+          "id": "cl13bhnay000a2e6dxa630dh3",
+          "blockId": "cl13bgy1s00042e6dao1wyobm",
+          "type": "email input",
+          "options": {
+            "labels": { "button": "Send", "placeholder": "Type your email..." },
+            "retryMessageContent": "This email doesn't seem to be valid. Can you type it again?",
+            "variableId": "cl13bhr3w000b2e6d3c9kid0p"
+          }
+        }
+      ]
+    }
+  ],
+  "variables": [
+    { "id": "cl13bha3l00082e6duaz0xm6f", "name": "Name" },
+    { "id": "cl13bhr3w000b2e6d3c9kid0p", "name": "Email" }
+  ],
+  "edges": [
+    {
+      "from": {
+        "blockId": "cl13bgvlk0000t71a4wabccvw",
+        "stepId": "cl13bgvlk0001t71a3pilbj53"
+      },
+      "to": { "blockId": "cl13bgy1s00042e6dao1wyobm" },
+      "id": "cl13bgz4800062e6dv7ejcchb"
+    }
+  ],
+  "theme": {
+    "chat": {
+      "inputs": {
+        "color": "#303235",
+        "backgroundColor": "#FFFFFF",
+        "placeholderColor": "#9095A0"
+      },
+      "buttons": { "color": "#FFFFFF", "backgroundColor": "#0042DA" },
+      "hostAvatar": {
+        "url": "https://avatars.githubusercontent.com/u/16015833?v=4",
+        "isEnabled": true
+      },
+      "hostBubbles": { "color": "#303235", "backgroundColor": "#F7F8FF" },
+      "guestBubbles": { "color": "#FFFFFF", "backgroundColor": "#FF8E21" }
+    },
+    "general": { "font": "Open Sans", "background": { "type": "None" } }
+  },
+  "settings": {
+    "general": {
+      "isBrandingEnabled": true,
+      "isInputPrefillEnabled": true,
+      "isNewResultOnRefreshEnabled": false
+    },
+    "metadata": {
+      "description": "Build beautiful conversational forms and embed them directly in your applications without a line of code. Triple your response rate and collect answers that has more value compared to a traditional form."
+    },
+    "typingEmulation": { "speed": 300, "enabled": true, "maxDelay": 1.5 }
+  },
+  "publicId": null,
+  "customDomain": null
+}
--- a/apps/viewer/playwright/tests/predefinedVariables.spec.ts
+++ b/apps/viewer/playwright/tests/predefinedVariables.spec.ts
@ -0,0 +1,22 @@
+import test, { expect } from '@playwright/test'
+import { importTypebotInDatabase } from '../services/database'
+import cuid from 'cuid'
+import path from 'path'
+import { typebotViewer } from '../services/selectorUtils'
+
+test('should correctly be injected', async ({ page }) => {
+  const typebotId = cuid()
+  await importTypebotInDatabase(
+    path.join(__dirname, '../fixtures/typebots/predefinedVariables.json'),
+    { id: typebotId, publicId: `${typebotId}-public` }
+  )
+  await page.goto(`/${typebotId}-public`)
+  await expect(typebotViewer(page).locator('text="Your name is"')).toBeVisible()
+  await page.goto(`/${typebotId}-public?Name=Baptiste&Email=email@test.com`)
+  await expect(
+    typebotViewer(page).locator('text="Your name is Baptiste"')
+  ).toBeVisible()
+  await expect(
+    typebotViewer(page).locator('input[value="email@test.com"]')
+  ).toBeVisible()
+})