Skip to content

Commit d93254c

Browse files
zendivezendive
committed
code review
1 parent 1f5f376 commit d93254c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+831
-736
lines changed

‎public/global.css‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
--text-trace: light-dark(rgb(30% 30% 30%), rgb(70% 70% 70%));
1212
--link: light-dark(rgb(0% 0% 0%), rgb(100% 100% 100%));
1313
--link-visited-bg: rgb(79 189 36 / 0.24);
14-
--error: rgb(100% 0% 0%);
14+
--attention: rgb(100% 0% 0%);
1515

1616
--small-icon-size: 0.6875rem;
1717
}
@@ -80,6 +80,9 @@ th,
8080
.ta-r {
8181
text-align: right;
8282
}
83+
.tc-attention {
84+
color: var(--attention);
85+
}
8386
.t-zebra:where(:nth-child(even)) {
8487
background-color: var(--bg-table-even);
8588
}
@@ -111,9 +114,10 @@ th,
111114
}
112115

113116
.sticky-header {
114-
position: sticky;
115-
top: 0;
116-
z-index: 1;
117+
/* @NOTE: unstable in Chrome v135 */
118+
/*position: sticky;*/
119+
/*top: 0;*/
120+
/*z-index: 1;*/
117121
height: 1rem;
118122
vertical-align: middle;
119123
}
@@ -188,6 +192,9 @@ th .icon {
188192
.icon.-trace-extension {
189193
mask-image: url(img/trace-extension.svg);
190194
}
195+
.icon.-trace-webpack {
196+
mask-image: url(img/trace-webpack.svg);
197+
}
191198
.icon.-breakpoint {
192199
mask-image: url(img/breakpoint.svg);
193200
}

‎public/img/breakpoint.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎public/img/trace-webpack.svg‎

Lines changed: 5 additions & 0 deletions
Loading

‎src/api-monitor-cs-isolated.ts‎

Lines changed: 26 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,24 +5,34 @@ import {
55
windowListen,
66
windowPost,
77
} from './api/communication.ts';
8-
import { getSettings, onSettingsChange } from './api/settings.ts';
9-
import { getSession, onSessionChange } from './api/session.ts';
8+
import { loadLocalStorage, onLocalStorageChange } from './api/storage.local.ts';
9+
import {
10+
loadSessionStorage,
11+
onSessionStorageChange,
12+
} from './api/storage.session.ts';
13+
14+
Promise.all([loadLocalStorage(), loadSessionStorage()]).then(
15+
([config, session]) => {
16+
windowPost({ msg: EMsg.CONFIG, config });
17+
windowPost({ msg: EMsg.SESSION, session });
1018

11-
Promise.all([getSettings(), getSession()]).then(([settings, session]) => {
12-
windowPost({ msg: EMsg.SETTINGS, settings });
13-
windowPost({ msg: EMsg.SESSION, session });
19+
if (config.devtoolsPanelShown && !config.paused) {
20+
windowPost({ msg: EMsg.START_OBSERVE });
21+
}
1422

15-
portListen(windowPost);
16-
windowListen(runtimePost);
23+
portListen(windowPost);
24+
windowListen(runtimePost);
1725

18-
onSettingsChange((newValue) => {
19-
windowPost({ msg: EMsg.SETTINGS, settings: newValue });
20-
});
21-
onSessionChange((newValue) => {
22-
windowPost({ msg: EMsg.SESSION, session: newValue });
23-
});
26+
onLocalStorageChange((newValue) => {
27+
windowPost({ msg: EMsg.CONFIG, config: newValue });
28+
});
29+
onSessionStorageChange((newValue) => {
30+
windowPost({ msg: EMsg.SESSION, session: newValue });
31+
});
2432

25-
runtimePost({ msg: EMsg.CONTENT_SCRIPT_LOADED });
33+
runtimePost({ msg: EMsg.CONTENT_SCRIPT_LOADED });
2634

27-
__development__ && console.log('api-monitor-cs-isolated.ts', performance.now());
28-
});
35+
__development__ &&
36+
console.log('api-monitor-cs-isolated.ts', performance.now());
37+
},
38+
);

‎src/api-monitor-cs-main.ts‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@ import { EMsg, windowListen, windowPost } from './api/communication.ts';
22
import { TELEMETRY_FREQUENCY_1PS } from './api/const.ts';
33
import { adjustTelemetryDelay, Timer } from './api/time.ts';
44
import {
5+
applyConfig,
6+
applySession,
57
cleanHistory,
68
collectMetrics,
79
onEachSecond,
810
runMediaCommand,
911
runTimerCommand,
10-
setSettings,
11-
setTracePoints,
1212
type TTelemetry,
1313
} from './wrapper/Wrapper.ts';
1414
import diff from './api/diff.ts';
@@ -52,11 +52,9 @@ windowListen((o) => {
5252
originalMetrics = currentMetrics;
5353
eachSecond.isPending() && tick.start();
5454
} else if (
55-
o.msg === EMsg.SETTINGS &&
56-
o.settings &&
57-
typeof o.settings === 'object'
55+
o.msg === EMsg.CONFIG && o.config && typeof o.config === 'object'
5856
) {
59-
setSettings(o.settings);
57+
applyConfig(o.config);
6058
} else if (o.msg === EMsg.START_OBSERVE) {
6159
originalMetrics = currentMetrics = null;
6260
tick.trigger();
@@ -74,7 +72,7 @@ windowListen((o) => {
7472
} else if (o.msg === EMsg.MEDIA_COMMAND) {
7573
runMediaCommand(o.mediaId, o.cmd, o.property);
7674
} else if (o.msg === EMsg.SESSION) {
77-
setTracePoints(o.session);
75+
applySession(o.session);
7876
}
7977
});
8078

‎src/api-monitor-devtools-panel.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
import { mount } from 'svelte';
22
import App from './view/App.svelte';
3+
import { initConfigState } from './state/config.state.svelte.ts';
4+
import { onHidePanel } from './devtoolsPanelUtil.ts';
35

4-
mount(App, { target: document.body });
6+
initConfigState().then(() => {
7+
mount(App, { target: document.body });
8+
globalThis.addEventListener('beforeunload', onHidePanel);
9+
});

‎src/api-monitor-devtools.ts‎

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { EMsg, portPost } from './api/communication.ts';
2-
import { getSettings, setSettings } from './api/settings.ts';
3-
import { enableSessionInContentScript } from './api/session.ts';
2+
import { loadLocalStorage, saveLocalStorage } from './api/storage.local.ts';
3+
import { enableSessionInContentScript } from './api/storage.session.ts';
4+
import { onHidePanel } from './devtoolsPanelUtil.ts';
45

56
// tabId may be null if user opened the devtools of the devtools
67
if (chrome.devtools.inspectedWindow.tabId !== null) {
@@ -10,20 +11,17 @@ if (chrome.devtools.inspectedWindow.tabId !== null) {
1011
'/public/api-monitor-devtools-panel.html',
1112
(panel) => {
1213
panel.onShown.addListener(async () => {
13-
const settings = await getSettings();
14-
if (!settings.paused) {
14+
const config = await loadLocalStorage();
15+
if (!config.paused) {
1516
portPost({ msg: EMsg.START_OBSERVE });
1617
}
17-
if (settings.keepAwake) {
18+
if (config.keepAwake) {
1819
chrome.power.requestKeepAwake('display');
1920
}
20-
setSettings({ devtoolsPanelShown: true });
21-
});
22-
panel.onHidden.addListener(() => {
23-
chrome.power.releaseKeepAwake();
24-
portPost({ msg: EMsg.STOP_OBSERVE });
25-
setSettings({ devtoolsPanelShown: false });
21+
await saveLocalStorage({ devtoolsPanelShown: true });
2622
});
23+
24+
panel.onHidden.addListener(onHidePanel);
2725
},
2826
);
2927

‎src/api/communication.ts‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,10 @@ import { APPLICATION_NAME } from './env.ts';
1414
import { ERRORS_IGNORED } from './const.ts';
1515
import { ETimerType } from '../wrapper/TimerWrapper.ts';
1616
import type { TTelemetry } from '../wrapper/Wrapper.ts';
17-
import type { TSettings } from './settings.ts';
17+
import type { TConfig } from './storage.local.ts';
1818
import type { TMediaCommand } from '../wrapper/MediaWrapper.ts';
1919
import type { Delta } from 'jsondiffpatch';
20-
import type { TSession } from './session.ts';
20+
import type { TSession } from './storage.session.ts';
2121

2222
let port: chrome.runtime.Port | null = null;
2323
export function portPost(payload: TMsgOptions) {
@@ -92,7 +92,7 @@ function handleRuntimeMessageResponse(): void {
9292
}
9393

9494
export enum EMsg {
95-
SETTINGS,
95+
CONFIG,
9696
CONTENT_SCRIPT_LOADED,
9797
START_OBSERVE,
9898
STOP_OBSERVE,
@@ -136,9 +136,9 @@ export interface IMsgTelemetryAcknowledged {
136136
msg: EMsg.TELEMETRY_ACKNOWLEDGED;
137137
timeOfCollection: number;
138138
}
139-
export interface IMsgSettings {
140-
msg: EMsg.SETTINGS;
141-
settings: TSettings;
139+
export interface IMsgConfig {
140+
msg: EMsg.CONFIG;
141+
config: TConfig;
142142
}
143143
export interface IMsgMediaCommand {
144144
msg: EMsg.MEDIA_COMMAND;
@@ -159,6 +159,6 @@ export type TMsgOptions =
159159
| IMsgLoaded
160160
| IMsgResetHistory
161161
| IMsgTimerCommand
162-
| IMsgSettings
162+
| IMsgConfig
163163
| IMsgMediaCommand
164164
| IMsgSession;

‎src/api/comparator.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { TOnlineTimerMetrics } from '../wrapper/TimerWrapper.ts';
2-
import { ESortOrder } from './settings.ts';
2+
import { ESortOrder } from './storage.local.ts';
33

44
const SEMISORTING_FIELDS = ['calls', 'delay', 'online'];
55

‎src/api/const.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export const FRAME_1of60 = 0.0166666666667; // ms
1010
export const VARIABLE_ANIMATION_THROTTLE = 3500; // eye blinking average frequency
1111
export const SELF_TIME_MAX_GOOD = 13.333333333333332; // ms
1212

13-
// store native functions
13+
// state native functions
1414
export const setTimeout = /*@__PURE__*/ globalThis.setTimeout.bind(globalThis);
1515
export const clearTimeout = /*@__PURE__*/ globalThis.clearTimeout.bind(
1616
globalThis,

0 commit comments

Comments
 (0)