diff --git a/frontend/app/components/shared/DevTools/NetworkPanel/NetworkPanel.tsx b/frontend/app/components/shared/DevTools/NetworkPanel/NetworkPanel.tsx
index 37d5590a0..26a0f47d8 100644
--- a/frontend/app/components/shared/DevTools/NetworkPanel/NetworkPanel.tsx
+++ b/frontend/app/components/shared/DevTools/NetworkPanel/NetworkPanel.tsx
@@ -173,6 +173,7 @@ function NetworkPanelCont({ panelHeight }: { panelHeight: number }) {
domBuildingTime,
tabStates,
currentTab,
+ tabNames,
} = store.get();
const tabsArr = Object.keys(tabStates);
const tabValues = Object.values(tabStates);
@@ -212,7 +213,7 @@ function NetworkPanelCont({ panelHeight }: { panelHeight: number }) {
}
}, [currentTab, tabStates, dataSource, tabValues]);
const getTabNum = (tab: string) => tabsArr.findIndex((t) => t === tab) + 1;
-
+ const getTabName = (tabId: string) => tabNames[tabId]
return (
);
@@ -311,6 +313,7 @@ interface Props {
activeOutsideIndex?: number;
isSpot?: boolean;
getTabNum?: (tab: string) => number;
+ getTabName?: (tabId: string) => string;
showSingleTab?: boolean;
}
@@ -336,6 +339,7 @@ export const NetworkPanelComp = observer(
isSpot,
getTabNum,
showSingleTab,
+ getTabName,
}: Props) => {
const [selectedWsChannel, setSelectedWsChannel] = React.useState<
WsChannel[] | null
@@ -566,9 +570,8 @@ export const NetworkPanelComp = observer(
label: 'Source',
width: 64,
render: (r: Record
) => (
-
+
- {' '}
{getTabNum?.(r.tabId) ?? 0}
diff --git a/frontend/app/components/shared/DevTools/TabTag.tsx b/frontend/app/components/shared/DevTools/TabTag.tsx
index 983a61f7d..48410c2a0 100644
--- a/frontend/app/components/shared/DevTools/TabTag.tsx
+++ b/frontend/app/components/shared/DevTools/TabTag.tsx
@@ -1,15 +1,23 @@
import React from 'react';
import { Tooltip } from 'antd';
+import { observer } from 'mobx-react-lite';
+import { PlayerContext } from 'Components/Session/playerContext';
+
+function TabTag({ logSource }: { logSource: number; logTabId: string }) {
+ const { store } = React.useContext(PlayerContext);
+ const { tabNames } = store.get();
-function TabTag({ tabNum }: { tabNum?: React.ReactNode }) {
return (
-
-
-
- {tabNum}
-
+
+
+ {logSource}
+
- )
+ );
}
-export default TabTag
\ No newline at end of file
+export default observer(TabTag);
diff --git a/frontend/app/player/web/TabManager.ts b/frontend/app/player/web/TabManager.ts
index 200d5f9b6..6785678b3 100644
--- a/frontend/app/player/web/TabManager.ts
+++ b/frontend/app/player/web/TabManager.ts
@@ -194,6 +194,7 @@ export default class TabSessionManager {
);
}
+ firstTitleSet = false
distributeMessage(msg: Message): void {
this.lastMessageTs = msg.time;
switch (msg.tp) {
@@ -234,6 +235,10 @@ export default class TabSessionManager {
case MType.SetPageLocationDeprecated:
case MType.SetPageLocation:
this.locationManager.append(msg);
+ if ('documentTitle' in msg && !this.firstTitleSet) {
+ this.state.update({ tabNames: { ...this.state.get().tabNames, [this.id]: msg.documentTitle } });
+ this.firstTitleSet = true
+ }
if (msg.navigationStart > 0) {
this.loadedLocationManager.append(msg);
}