fix: show visibility less (#24488)

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
PostHog · Aug 21, 2024 · e1def6e · e1def6e
1 parent 8f3d31c
commit e1def6e
Show file tree

Hide file tree

Showing 4 changed files with 386 additions and 221 deletions.
diff --git a/frontend/__snapshots__/exporter-exporter--funnel-left-to-right-insight--dark.png b/frontend/__snapshots__/exporter-exporter--funnel-left-to-right-insight--dark.png
diff --git a/frontend/__snapshots__/scenes-app-dashboards--edit--light.png b/frontend/__snapshots__/scenes-app-dashboards--edit--light.png
diff --git a/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.test.ts b/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.test.ts
@@ -1,9 +1,17 @@
 import { expectLogic } from 'kea-test-utils'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
-import { playerInspectorLogic } from 'scenes/session-recordings/player/inspector/playerInspectorLogic'
+import {
+    filterInspectorListItems,
+    InspectorListBrowserVisibility,
+    InspectorListItemEvent,
+    InspectorListOfflineStatusChange,
+    playerInspectorLogic,
+} from 'scenes/session-recordings/player/inspector/playerInspectorLogic'
+import { SharedListMiniFilter } from 'scenes/session-recordings/player/playerSettingsLogic'
 
 import { useMocks } from '~/mocks/jest'
 import { initKeaTests } from '~/test/init'
+import { PerformanceEvent, SessionRecordingPlayerTab } from '~/types'
 
 const playerLogicProps = { sessionRecordingId: '1', playerKey: 'playlist' }
 
@@ -22,6 +30,133 @@ describe('playerInspectorLogic', () => {
         logic.mount()
     })
 
+    describe('filtering inspector list items', () => {
+        describe('the events tab', () => {
+            it('includes browser visibility', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: 'browser-visibility',
+                            } as InspectorListBrowserVisibility,
+                        ],
+                        tab: SessionRecordingPlayerTab.EVENTS,
+                        miniFiltersByKey: { 'all-everything': { enabled: true } as unknown as SharedListMiniFilter },
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(1)
+            })
+
+            it('excludes browser visibility on console filter', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: 'browser-visibility',
+                            } as InspectorListBrowserVisibility,
+                        ],
+                        tab: SessionRecordingPlayerTab.EVENTS,
+                        miniFiltersByKey: { 'all-everything': { enabled: false } as unknown as SharedListMiniFilter },
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(0)
+            })
+
+            it('excludes browser visibility when show only matching', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: 'browser-visibility',
+                            } as InspectorListBrowserVisibility,
+                        ],
+                        tab: SessionRecordingPlayerTab.EVENTS,
+                        miniFiltersByKey: { 'all-everything': { enabled: true } as unknown as SharedListMiniFilter },
+                        showOnlyMatching: true,
+                        showMatchingEventsFilter: true,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(0)
+            })
+        })
+
+        describe('the doctor tab', () => {
+            it('ignores events that are not exceptions', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: SessionRecordingPlayerTab.EVENTS,
+                                data: { event: 'an event' } as unknown as PerformanceEvent,
+                            } as unknown as InspectorListItemEvent,
+                        ],
+                        tab: SessionRecordingPlayerTab.DOCTOR,
+                        miniFiltersByKey: {},
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(0)
+            })
+
+            it('includes events that are exceptions', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: SessionRecordingPlayerTab.EVENTS,
+                                data: { event: '$exception' } as unknown as PerformanceEvent,
+                            } as unknown as InspectorListItemEvent,
+                        ],
+                        tab: SessionRecordingPlayerTab.DOCTOR,
+                        miniFiltersByKey: {},
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(1)
+            })
+
+            it('includes browser offline status', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: 'offline-status',
+                            } as unknown as InspectorListOfflineStatusChange,
+                        ],
+                        tab: SessionRecordingPlayerTab.DOCTOR,
+                        miniFiltersByKey: {},
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(1)
+            })
+
+            it('includes browser visibility status', () => {
+                expect(
+                    filterInspectorListItems({
+                        allItems: [
+                            {
+                                type: 'browser-visibility',
+                            } as InspectorListBrowserVisibility,
+                        ],
+                        tab: SessionRecordingPlayerTab.DOCTOR,
+                        miniFiltersByKey: {},
+                        showOnlyMatching: false,
+                        showMatchingEventsFilter: false,
+                        windowIdFilter: null,
+                    })
+                ).toHaveLength(1)
+            })
+        })
+    })
+
     describe('setWindowIdFilter', () => {
         it('happy case', async () => {
             await expectLogic(logic).toMatchValues({