diff --git a/frontend/app/components/Session/WebPlayer.tsx b/frontend/app/components/Session/WebPlayer.tsx index d0fff842d..874f15bd5 100644 --- a/frontend/app/components/Session/WebPlayer.tsx +++ b/frontend/app/components/Session/WebPlayer.tsx @@ -38,8 +38,8 @@ function WebPlayer(props: any) { uxtestingStore, uiPlayerStore, integrationsStore, - userStore, } = useStore(); + const devTools = sessionStore.devTools const session = sessionStore.current; const { prefetched } = sessionStore; const startedAt = sessionStore.current.startedAt || 0; @@ -66,6 +66,10 @@ function WebPlayer(props: any) { }; document.addEventListener('visibilitychange', handleActivation); } + + return () => { + devTools.update('network', { activeTab: 'ALL' }); + } }, []); useEffect(() => { diff --git a/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx b/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx index 67767572a..8b37a2819 100644 --- a/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx +++ b/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx @@ -85,19 +85,30 @@ function EventsBlock(props: IProps) { } }); } - const eventsWithMobxNotes = [...notesWithEvents, ...notes].sort(sortEvents); - return mergeEventLists( - filteredLength > 0 ? filteredEvents : eventsWithMobxNotes, - tabChangeEvents, - ).filter((e) => - zoomEnabled + const eventsWithMobxNotes = [...notesWithEvents, ...notes] + .sort(sortEvents); + const filteredTabEvents = query.length + ? tabChangeEvents + .filter((e => (e.activeUrl as string).includes(query))) + : tabChangeEvents; + const list = mergeEventLists( + query.length > 0 ? filteredEvents : eventsWithMobxNotes, + filteredTabEvents + ) + if (zoomEnabled) { + return list.filter((e) => + zoomEnabled ? 'time' in e ? e.time >= zoomStartTs && e.time <= zoomEndTs : false - : true, - ); + : true + ); + } else { + return list + } }, [ filteredLength, + query, notesWithEvtsLength, notesLength, zoomEnabled, diff --git a/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx b/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx index 8075b918b..50c132f6f 100644 --- a/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx +++ b/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx @@ -145,7 +145,7 @@ function TimeTable(props: Props) { ]); React.useEffect(() => { if (props.activeIndex && props.activeIndex >= 0 && scroller.current) { - scroller.current.scrollToIndex(props.activeIndex); + scroller.current.scrollToIndex(props.activeIndex, { align: 'center', smooth: false }); setFirstVisibleRowIndex(props.activeIndex ?? 0); } }, [props.activeIndex]);