Implement dynamic funnels

assets/js/liveview/live_socket.js

@@ -7,7 +7,7 @@
 import 'phoenix_html'
 import { Socket } from 'phoenix'
 import { LiveSocket } from 'phoenix_live_view'
-import { Modal, Dropdown, Listbox } from 'prima'
+import { Modal, Dropdown, Listbox, Combobox } from 'prima'
 import topbar from 'topbar'
 /* eslint-enable import/no-unresolved */
 
@@ -20,7 +20,15 @@ import MemberRows from './member-rows'
 let csrfToken = document.querySelector("meta[name='csrf-token']")
 let websocketUrl = document.querySelector("meta[name='websocket-url']")
 if (csrfToken && websocketUrl) {
-  let Hooks = { Modal, Dropdown, Listbox, Confirm, CopySnippet, MemberRows }
+  let Hooks = {
+    Modal,
+    Dropdown,
+    Listbox,
+    Confirm,
+    CopySnippet,
+    MemberRows,
+    Combobox
+  }
 
   Hooks.VerificationLifecycle = {
     mounted() {

e2e/tests/fixtures.ts

@@ -62,6 +62,11 @@ type ImportedVisitors = {
   date?: EventDate
 }
 
+type FunnelInputStep =
+  | string
+  | { event_name: string; currency?: string }
+  | { page_path: string; scroll_threshold?: string }
+
 export type StatsEntry = Event | ImportedVisitors
 
 export async function register({
@@ -504,7 +509,7 @@ export async function addFunnel({
   request: APIRequestContext
   domain: string
   name: string
-  steps: string[]
+  steps: FunnelInputStep[]
 }) {
   const response = await request.post('/e2e-tests/funnel', {
     headers: {
@@ -517,6 +522,28 @@ export async function addFunnel({
   expect(response.ok()).toBeTruthy()
 }
 
+export async function getFunnel({
+  request,
+  domain,
+  name
+}: {
+  request: APIRequestContext
+  domain: string
+  name: string
+}) {
+  const response = await request.get('/e2e-tests/funnel', {
+    headers: {
+      'Content-Type': 'application/json',
+      Accept: 'application/json'
+    },
+    params: { domain: domain, name: name }
+  })
+
+  expect(response.ok()).toBeTruthy()
+
+  return await response.json()
+}
+
 export async function subscribeToPlan({
   page,
   planId