chore: less flappy recordings stories hopefully

PostHog · Sep 13, 2023 · eac462d · eac462d
1 parent 8dcea1f
commit eac462d
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 11 deletions.
diff --git a/...recordings/SessionsRecordings.stories.tsx → ...ionsRecordings-player-success.stories.tsx b/...recordings/SessionsRecordings.stories.tsx → ...ionsRecordings-player-success.stories.tsx
@@ -9,14 +9,14 @@ import recordingSnapshotsJson from 'scenes/session-recordings/__mocks__/recordin
 import recordingMetaJson from 'scenes/session-recordings/__mocks__/recording_meta.json'
 import recordingEventsJson from 'scenes/session-recordings/__mocks__/recording_events_query'
 import recording_playlists from './__mocks__/recording_playlists.json'
-import { ReplayTabs } from '~/types'
 
 const meta: Meta = {
     title: 'Scenes-App/Recordings',
     parameters: {
         layout: 'fullscreen',
         viewMode: 'story',
         mockDate: '2023-02-01',
+        waitForSelector: '.PlayerFrameOverlay__content[aria-busy="false"]',
     },
     decorators: [
         mswDecorator({
@@ -97,16 +97,10 @@ const meta: Meta = {
     ],
 }
 export default meta
-export function RecordingsList(): JSX.Element {
-    useEffect(() => {
-        router.actions.push(urls.replay())
-    }, [])
-    return <App />
-}
 
-export function RecordingsPlayLists(): JSX.Element {
+export function RecentRecordings(): JSX.Element {
     useEffect(() => {
-        router.actions.push(urls.replay(ReplayTabs.Playlists))
+        router.actions.push(urls.replay())
     }, [])
     return <App />
 }

diff --git a/frontend/src/scenes/session-recordings/SessionsRecordings-playlist-listing.stories.tsx b/frontend/src/scenes/session-recordings/SessionsRecordings-playlist-listing.stories.tsx
@@ -0,0 +1,48 @@
+import { Meta } from '@storybook/react'
+import { useEffect } from 'react'
+import { mswDecorator } from '~/mocks/browser'
+import { router } from 'kea-router'
+import { urls } from 'scenes/urls'
+import { App } from 'scenes/App'
+import recording_playlists from './__mocks__/recording_playlists.json'
+import { ReplayTabs } from '~/types'
+import recordings from 'scenes/session-recordings/__mocks__/recordings.json'
+import recordingEventsJson from 'scenes/session-recordings/__mocks__/recording_events_query'
+
+const meta: Meta = {
+    title: 'Scenes-App/Recordings',
+    parameters: {
+        layout: 'fullscreen',
+        viewMode: 'story',
+        mockDate: '2023-02-01',
+    },
+    decorators: [
+        mswDecorator({
+            get: {
+                '/api/projects/:team_id/session_recording_playlists': recording_playlists,
+                '/api/projects/:team_id/session_recordings': (req) => {
+                    const version = req.url.searchParams.get('version')
+                    return [
+                        200,
+                        {
+                            has_next: false,
+                            results: recordings,
+                            version,
+                        },
+                    ]
+                },
+            },
+            post: {
+                '/api/projects/:team/query': recordingEventsJson,
+            },
+        }),
+    ],
+}
+export default meta
+
+export function RecordingsPlayLists(): JSX.Element {
+    useEffect(() => {
+        router.actions.push(urls.replay(ReplayTabs.Playlists))
+    }, [])
+    return <App />
+}
diff --git a/frontend/src/scenes/session-recordings/__mocks__/recording_events.json b/frontend/src/scenes/session-recordings/__mocks__/recording_events.json
@@ -1,6 +1,6 @@
 [
     {
-        "id": "$pageview",
+        "id": "$pageview1",
         "event": "$pageview",
         "name": "$event_before_recording_starts",
         "type": "events",
@@ -14,7 +14,7 @@
         "elements_hash": ""
     },
     {
-        "id": "$pageview",
+        "id": "$pageview2",
         "name": "$pageview",
         "event": "$pageview",
         "type": "events",