diff --git a/packages/trace-viewer/src/ui/modelUtil.ts b/packages/trace-viewer/src/ui/modelUtil.ts
index c82cbc99a6..d7bfe268e9 100644
--- a/packages/trace-viewer/src/ui/modelUtil.ts
+++ b/packages/trace-viewer/src/ui/modelUtil.ts
@@ -356,6 +356,10 @@ export function prevInList(action: ActionTraceEvent): ActionTraceEvent {
   return (action as any)[prevInListSymbol];
 }
 
+export function pageForAction(action: ActionTraceEvent): PageEntry {
+  return context(action).pages[0]; // TODO: figure out what to do about multiple pages.
+}
+
 export function stats(action: ActionTraceEvent): { errors: number, warnings: number } {
   let errors = 0;
   let warnings = 0;
diff --git a/packages/trace-viewer/src/ui/snapshotTab.tsx b/packages/trace-viewer/src/ui/snapshotTab.tsx
index dc48ed0de3..55c9bc5fd8 100644
--- a/packages/trace-viewer/src/ui/snapshotTab.tsx
+++ b/packages/trace-viewer/src/ui/snapshotTab.tsx
@@ -17,7 +17,7 @@
 import './snapshotTab.css';
 import * as React from 'react';
 import type { ActionTraceEvent } from '@trace/trace';
-import { context, type MultiTraceModel, prevInList } from './modelUtil';
+import { context, type MultiTraceModel, pageForAction, prevInList } from './modelUtil';
 import { Toolbar } from '@web/components/toolbar';
 import { ToolbarButton } from '@web/components/toolbarButton';
 import { clsx, useMeasure, useSetting } from '@web/uiUtils';
@@ -166,12 +166,13 @@ export const SnapshotTab: React.FunctionComponent<{
     y: (measure.height - snapshotContainerSize.height) / 2,
   };
 
-  const page = model?.pages[0]; // TODO: figure out what to do about multiple pages.
+  const page = action ? pageForAction(action) : undefined;
   const screencastFrame = React.useMemo(
-      () => snapshotInfo.timestamp && page?.screencastFrames
-        ? findClosest(page.screencastFrames, snapshotInfo.timestamp)
-        : undefined
-      , [page?.screencastFrames, snapshotInfo.timestamp]
+      () => {
+        if (snapshotInfo.timestamp && page?.screencastFrames)
+          return findClosest(page.screencastFrames, snapshotInfo.timestamp);
+      },
+      [page?.screencastFrames, snapshotInfo.timestamp]
   );
 
   return <div
@@ -201,7 +202,7 @@ export const SnapshotTab: React.FunctionComponent<{
       iframe={iframeRef1.current}
       iteration={loadingRef.current.iteration} />
     <Toolbar>
-      <ToolbarButton className='pick-locator' title={showScreenshotInsteadOfSnapshot ? 'Locators not available when showing screenshot' : 'Pick locator'} icon='target' toggled={isInspecting} onClick={() => setIsInspecting(!isInspecting)} disabled={showScreenshotInsteadOfSnapshot} />
+      <ToolbarButton className='pick-locator' title={showScreenshotInsteadOfSnapshot ? 'Disable "screenshots instead of snapshots" to pick a locator' : 'Pick locator'} icon='target' toggled={isInspecting} onClick={() => setIsInspecting(!isInspecting)} disabled={showScreenshotInsteadOfSnapshot} />
       {['action', 'before', 'after'].map(tab => {
         return <TabbedPaneTab
           key={tab}