chrome-devtools-frontend 1.0.1666631 → 1.0.1667564
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/front_end/core/host/AidaClient.ts +6 -4
- package/front_end/core/host/InspectorFrontendHostAPI.ts +1 -0
- package/front_end/core/host/InspectorFrontendHostStub.ts +3 -3
- package/front_end/core/host/UserMetrics.ts +49 -1
- package/front_end/core/sdk/CSSMatchedStyles.ts +2 -5
- package/front_end/core/sdk/CSSPropertyParserMatchers.ts +12 -0
- package/front_end/core/sdk/Connections.ts +1 -1
- package/front_end/core/sdk/DOMModel.test.api.ts +104 -0
- package/front_end/core/sdk/DOMModel.ts +23 -11
- package/front_end/core/sdk/DebuggerModel.ts +9 -9
- package/front_end/core/sdk/IsolateManager.ts +1 -1
- package/front_end/core/sdk/NetworkManager.ts +105 -4
- package/front_end/core/sdk/OverlayModel.ts +15 -14
- package/front_end/core/sdk/RemoteObject.ts +1 -1
- package/front_end/devtools_compatibility.js +1 -0
- package/front_end/entrypoints/main/MainImpl.ts +5 -2
- package/front_end/entrypoints/main/SimpleApp.ts +9 -3
- package/front_end/foundation/Universe.ts +6 -0
- package/front_end/models/ai_assistance/contexts/PerformanceTraceContext.ts +23 -10
- package/front_end/models/computed_style/ComputedStyleModel.ts +4 -7
- package/front_end/models/crux-manager/CrUXManager.ts +4 -0
- package/front_end/models/extensions/ExtensionAPI.ts +3 -3
- package/front_end/models/heap_snapshot/HeapSnapshotProxy.ts +2 -2
- package/front_end/models/live-metrics/LiveMetrics.ts +59 -19
- package/front_end/models/live-metrics/web-vitals-injected/README.md +1 -1
- package/front_end/models/live-metrics/web-vitals-injected/spec/spec.ts +6 -1
- package/front_end/models/live-metrics/web-vitals-injected/web-vitals-injected.ts +11 -3
- package/front_end/models/logs/LogManager.ts +1 -1
- package/front_end/models/persistence/FileSystemWorkspaceBinding.ts +1 -1
- package/front_end/models/source_map_scopes/FunctionCodeResolver.ts +6 -7
- package/front_end/models/workspace_diff/WorkspaceDiff.ts +13 -14
- package/front_end/panels/ai_assistance/AiAssistancePanel.ts +15 -7
- package/front_end/panels/application/BackgroundServiceView.ts +18 -20
- package/front_end/panels/autofill/AutofillView.ts +17 -17
- package/front_end/panels/autofill/autofillView.css +7 -8
- package/front_end/panels/browser_debugger/CategorizedBreakpointsSidebarPane.ts +31 -31
- package/front_end/panels/browser_debugger/DOMBreakpointsSidebarPane.ts +15 -15
- package/front_end/panels/browser_debugger/XHRBreakpointsSidebarPane.ts +12 -12
- package/front_end/panels/browser_debugger/browser_debugger-meta.ts +27 -27
- package/front_end/panels/common/AiCodeCompletionDisclaimer.ts +14 -6
- package/front_end/panels/common/AiCodeCompletionSummaryToolbar.ts +14 -6
- package/front_end/panels/common/AiCodeCompletionTeaser.ts +13 -6
- package/front_end/panels/common/GeminiRebrandPromoDialog.ts +1 -1
- package/front_end/panels/console/ConsoleInsightTeaser.ts +13 -6
- package/front_end/panels/console/ConsoleView.ts +6 -6
- package/front_end/panels/console_counters/WarningErrorCounter.ts +4 -4
- package/front_end/panels/coverage/CoverageModel.ts +11 -1
- package/front_end/panels/elements/StylePropertiesSection.ts +50 -17
- package/front_end/panels/elements/StylesAiCodeCompletionProvider.ts +18 -7
- package/front_end/panels/emulation/AdvancedApp.ts +18 -8
- package/front_end/panels/event_listeners/EventListenersView.ts +8 -8
- package/front_end/panels/explain/components/ConsoleInsight.ts +15 -7
- package/front_end/panels/network/NetworkLogView.ts +13 -14
- package/front_end/panels/screencast/ScreencastApp.ts +12 -6
- package/front_end/panels/screencast/ScreencastView.ts +37 -11
- package/front_end/panels/sensors/locationsSettingsTab.css +4 -0
- package/front_end/panels/settings/AISettingsTab.ts +13 -6
- package/front_end/panels/sources/DebuggerPlugin.ts +13 -2
- package/front_end/panels/timeline/components/LiveMetricsView.ts +14 -1
- package/front_end/panels/timeline/components/cpuThrottlingSelector.css +4 -0
- package/front_end/panels/timeline/components/liveMetricsView.css +28 -0
- package/front_end/panels/timeline/timeline-meta.ts +13 -0
- package/front_end/third_party/chromium/README.chromium +1 -1
- package/front_end/ui/components/menus/menu.css +4 -0
- package/front_end/ui/components/menus/menuItem.css +4 -0
- package/front_end/ui/components/menus/selectMenu.css +4 -0
- package/front_end/ui/components/menus/selectMenuButton.css +4 -0
- package/front_end/ui/components/text_editor/AiCodeCompletionProvider.ts +21 -10
- package/front_end/ui/components/text_editor/AiCodeGenerationProvider.ts +22 -10
- package/front_end/ui/components/text_editor/config.ts +7 -0
- package/front_end/ui/legacy/AppProvider.ts +2 -1
- package/front_end/ui/legacy/RootView.ts +8 -1
- package/front_end/ui/legacy/UniverseRequestEvent.ts +19 -0
- package/front_end/ui/legacy/Widget.ts +49 -6
- package/front_end/ui/legacy/inspectorCommon.css +1 -1
- package/front_end/ui/legacy/legacy.ts +2 -0
- package/front_end/ui/visual_logging/KnownContextValues.ts +2 -0
- package/package.json +1 -1
|
@@ -467,9 +467,9 @@ const UIStrings = {
|
|
|
467
467
|
*/
|
|
468
468
|
blockRequestDomain: 'Block request domain',
|
|
469
469
|
/**
|
|
470
|
-
* @description Text to
|
|
470
|
+
* @description Text to resend a network request
|
|
471
471
|
*/
|
|
472
|
-
|
|
472
|
+
resend: 'Resend',
|
|
473
473
|
/**
|
|
474
474
|
* @description Text in Network Log View of the Network panel
|
|
475
475
|
*/
|
|
@@ -734,12 +734,11 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
|
|
|
734
734
|
return !filter(request);
|
|
735
735
|
}
|
|
736
736
|
|
|
737
|
-
private static
|
|
737
|
+
private static requestHostAndPathFilter(regex: RegExp|null, request: SDK.NetworkRequest.NetworkRequest): boolean {
|
|
738
738
|
if (!regex) {
|
|
739
739
|
return false;
|
|
740
740
|
}
|
|
741
|
-
|
|
742
|
-
return regex.test(request.path() + '/' + request.name());
|
|
741
|
+
return regex.test(request.parsedURL.urlWithoutScheme());
|
|
743
742
|
}
|
|
744
743
|
|
|
745
744
|
private static subdomains(domain: string): string[] {
|
|
@@ -1186,9 +1185,9 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
|
|
|
1186
1185
|
return;
|
|
1187
1186
|
}
|
|
1188
1187
|
|
|
1189
|
-
if (SDK.NetworkManager.NetworkManager.
|
|
1188
|
+
if (SDK.NetworkManager.NetworkManager.canResendRequest(request)) {
|
|
1190
1189
|
SDK.NetworkManager.NetworkManager.replayRequest(request);
|
|
1191
|
-
void VisualLogging.logKeyDown(this.dataGrid.selectedNode.element(), event, '
|
|
1190
|
+
void VisualLogging.logKeyDown(this.dataGrid.selectedNode.element(), event, 'resend');
|
|
1192
1191
|
}
|
|
1193
1192
|
}
|
|
1194
1193
|
});
|
|
@@ -1975,10 +1974,10 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
|
|
|
1975
1974
|
{jslogContext: 'throttle-request-domain'});
|
|
1976
1975
|
}
|
|
1977
1976
|
|
|
1978
|
-
if (SDK.NetworkManager.NetworkManager.
|
|
1979
|
-
contextMenu.debugSection().appendItem(
|
|
1980
|
-
|
|
1981
|
-
|
|
1977
|
+
if (SDK.NetworkManager.NetworkManager.canResendRequest(request)) {
|
|
1978
|
+
contextMenu.debugSection().appendItem(i18nString(UIStrings.resend),
|
|
1979
|
+
SDK.NetworkManager.NetworkManager.replayRequest.bind(null, request),
|
|
1980
|
+
{jslogContext: 'resend'});
|
|
1982
1981
|
}
|
|
1983
1982
|
}
|
|
1984
1983
|
}
|
|
@@ -2169,13 +2168,13 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
|
|
|
2169
2168
|
if (key) {
|
|
2170
2169
|
const defaultText = Platform.StringUtilities.escapeForRegExp(key + ':' + text);
|
|
2171
2170
|
filter = this.createSpecialFilter((key as NetworkForward.UIFilter.FilterType), text) ||
|
|
2172
|
-
NetworkLogView.
|
|
2171
|
+
NetworkLogView.requestHostAndPathFilter.bind(null, new RegExp(defaultText, 'i'));
|
|
2173
2172
|
} else if (descriptor.regex) {
|
|
2174
|
-
filter = NetworkLogView.
|
|
2173
|
+
filter = NetworkLogView.requestHostAndPathFilter.bind(null, (regex as RegExp));
|
|
2175
2174
|
} else if (this.isValidUrl(text)) {
|
|
2176
2175
|
filter = NetworkLogView.requestUrlFilter.bind(null, text);
|
|
2177
2176
|
} else {
|
|
2178
|
-
filter = NetworkLogView.
|
|
2177
|
+
filter = NetworkLogView.requestHostAndPathFilter.bind(
|
|
2179
2178
|
null, new RegExp(Platform.StringUtilities.escapeForRegExp(text), 'i'));
|
|
2180
2179
|
}
|
|
2181
2180
|
if ((descriptor.negative && !invert) || (!descriptor.negative && invert)) {
|
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
import * as Common from '../../core/common/common.js';
|
|
7
7
|
import * as i18n from '../../core/i18n/i18n.js';
|
|
8
8
|
import * as SDK from '../../core/sdk/sdk.js';
|
|
9
|
+
import type * as Foundation from '../../foundation/foundation.js';
|
|
9
10
|
import * as UI from '../../ui/legacy/legacy.js';
|
|
10
11
|
|
|
11
12
|
import {ScreencastView} from './ScreencastView.js';
|
|
@@ -28,7 +29,9 @@ export class ScreencastApp implements UI.App.App,
|
|
|
28
29
|
private screenCaptureModel?: SDK.ScreenCaptureModel.ScreenCaptureModel;
|
|
29
30
|
private screencastView?: ScreencastView;
|
|
30
31
|
rootView?: UI.RootView.RootView;
|
|
31
|
-
|
|
32
|
+
readonly #universe: Foundation.Universe.Universe;
|
|
33
|
+
constructor(universe: Foundation.Universe.Universe) {
|
|
34
|
+
this.#universe = universe;
|
|
32
35
|
this.enabledSetting = Common.Settings.Settings.instance().createSetting('screencast-enabled', true);
|
|
33
36
|
this.toggleButton = new UI.Toolbar.ToolbarToggle(i18nString(UIStrings.toggleScreencast), 'devices');
|
|
34
37
|
this.toggleButton.setToggled(this.enabledSetting.get());
|
|
@@ -37,15 +40,18 @@ export class ScreencastApp implements UI.App.App,
|
|
|
37
40
|
SDK.TargetManager.TargetManager.instance().observeModels(SDK.ScreenCaptureModel.ScreenCaptureModel, this);
|
|
38
41
|
}
|
|
39
42
|
|
|
40
|
-
static instance(): ScreencastApp {
|
|
43
|
+
static instance(universe?: Foundation.Universe.Universe): ScreencastApp {
|
|
41
44
|
if (!appInstance) {
|
|
42
|
-
|
|
45
|
+
if (!universe) {
|
|
46
|
+
throw new Error('ScreencastApp.instance() requires a Universe on initial instantiation');
|
|
47
|
+
}
|
|
48
|
+
appInstance = new ScreencastApp(universe);
|
|
43
49
|
}
|
|
44
50
|
return appInstance;
|
|
45
51
|
}
|
|
46
52
|
|
|
47
53
|
presentUI(document: Document): void {
|
|
48
|
-
this.rootView = new UI.RootView.RootView();
|
|
54
|
+
this.rootView = new UI.RootView.RootView(this.#universe);
|
|
49
55
|
this.rootView.registerRequiredCSS(UI.inspectorCommonStyles);
|
|
50
56
|
|
|
51
57
|
this.rootSplitWidget =
|
|
@@ -137,7 +143,7 @@ export class ScreencastAppProvider implements UI.AppProvider.AppProvider {
|
|
|
137
143
|
return screencastAppProviderInstance;
|
|
138
144
|
}
|
|
139
145
|
|
|
140
|
-
createApp(): UI.App.App {
|
|
141
|
-
return ScreencastApp.instance();
|
|
146
|
+
createApp(universe: Foundation.Universe.Universe): UI.App.App {
|
|
147
|
+
return ScreencastApp.instance(universe);
|
|
142
148
|
}
|
|
143
149
|
}
|
|
@@ -179,6 +179,18 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
|
|
|
179
179
|
this.stopCasting();
|
|
180
180
|
}
|
|
181
181
|
|
|
182
|
+
override onDetach(): void {
|
|
183
|
+
this.navigationProgressBar?.dispose();
|
|
184
|
+
SDK.TargetManager.TargetManager.instance().removeEventListener(SDK.TargetManager.Events.SUSPEND_STATE_CHANGED,
|
|
185
|
+
this.onSuspendStateChange, this);
|
|
186
|
+
if (this.resourceTreeModel) {
|
|
187
|
+
this.resourceTreeModel.removeEventListener(SDK.ResourceTreeModel.Events.PrimaryPageChanged,
|
|
188
|
+
this.requestNavigationHistoryEvent, this);
|
|
189
|
+
this.resourceTreeModel.removeEventListener(SDK.ResourceTreeModel.Events.CachedResourcesLoaded,
|
|
190
|
+
this.requestNavigationHistoryEvent, this);
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
|
|
182
194
|
private async startCasting(): Promise<void> {
|
|
183
195
|
if (SDK.TargetManager.TargetManager.instance().allTargetsSuspended()) {
|
|
184
196
|
return;
|
|
@@ -629,11 +641,9 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
|
|
|
629
641
|
}
|
|
630
642
|
|
|
631
643
|
private createCheckerboardPattern(context: CanvasRenderingContext2D): CanvasPattern|null {
|
|
632
|
-
const pattern = document.createElement('canvas');
|
|
633
644
|
const size = 32;
|
|
634
|
-
pattern
|
|
635
|
-
pattern.
|
|
636
|
-
const pctx = pattern.getContext('2d', {willReadFrequently: true}) as CanvasRenderingContext2D;
|
|
645
|
+
const pattern = new OffscreenCanvas(size * 2, size * 2);
|
|
646
|
+
const pctx = pattern.getContext('2d', {willReadFrequently: true}) as OffscreenCanvasRenderingContext2D;
|
|
637
647
|
|
|
638
648
|
pctx.fillStyle = 'var(--sys-color-neutral-outline)';
|
|
639
649
|
pctx.fillRect(0, 0, size * 2, size * 2);
|
|
@@ -787,6 +797,8 @@ export const HTTP_REGEX = /^http:\/\/(.+)/;
|
|
|
787
797
|
export const SCHEME_REGEX = /^(https?|about|chrome):/;
|
|
788
798
|
|
|
789
799
|
export class ProgressTracker {
|
|
800
|
+
private readonly resourceTreeModel: SDK.ResourceTreeModel.ResourceTreeModel|null;
|
|
801
|
+
private readonly networkManager: SDK.NetworkManager.NetworkManager|null;
|
|
790
802
|
private element: HTMLElement;
|
|
791
803
|
private requestIds: Map<string, SDK.NetworkRequest.NetworkRequest>|null;
|
|
792
804
|
private startedRequests: number;
|
|
@@ -797,14 +809,16 @@ export class ProgressTracker {
|
|
|
797
809
|
resourceTreeModel: SDK.ResourceTreeModel.ResourceTreeModel|null,
|
|
798
810
|
networkManager: SDK.NetworkManager.NetworkManager|null, element: HTMLElement) {
|
|
799
811
|
this.element = element;
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.
|
|
812
|
+
this.resourceTreeModel = resourceTreeModel;
|
|
813
|
+
this.networkManager = networkManager;
|
|
814
|
+
if (this.resourceTreeModel) {
|
|
815
|
+
this.resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.PrimaryPageChanged,
|
|
816
|
+
this.onPrimaryPageChanged, this);
|
|
817
|
+
this.resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.Load, this.onLoad, this);
|
|
804
818
|
}
|
|
805
|
-
if (networkManager) {
|
|
806
|
-
networkManager.addEventListener(SDK.NetworkManager.Events.RequestStarted, this.onRequestStarted, this);
|
|
807
|
-
networkManager.addEventListener(SDK.NetworkManager.Events.RequestFinished, this.onRequestFinished, this);
|
|
819
|
+
if (this.networkManager) {
|
|
820
|
+
this.networkManager.addEventListener(SDK.NetworkManager.Events.RequestStarted, this.onRequestStarted, this);
|
|
821
|
+
this.networkManager.addEventListener(SDK.NetworkManager.Events.RequestFinished, this.onRequestFinished, this);
|
|
808
822
|
}
|
|
809
823
|
this.requestIds = null;
|
|
810
824
|
this.startedRequests = 0;
|
|
@@ -812,6 +826,18 @@ export class ProgressTracker {
|
|
|
812
826
|
this.maxDisplayedProgress = 0;
|
|
813
827
|
}
|
|
814
828
|
|
|
829
|
+
dispose(): void {
|
|
830
|
+
if (this.resourceTreeModel) {
|
|
831
|
+
this.resourceTreeModel.removeEventListener(SDK.ResourceTreeModel.Events.PrimaryPageChanged,
|
|
832
|
+
this.onPrimaryPageChanged, this);
|
|
833
|
+
this.resourceTreeModel.removeEventListener(SDK.ResourceTreeModel.Events.Load, this.onLoad, this);
|
|
834
|
+
}
|
|
835
|
+
if (this.networkManager) {
|
|
836
|
+
this.networkManager.removeEventListener(SDK.NetworkManager.Events.RequestStarted, this.onRequestStarted, this);
|
|
837
|
+
this.networkManager.removeEventListener(SDK.NetworkManager.Events.RequestFinished, this.onRequestFinished, this);
|
|
838
|
+
}
|
|
839
|
+
}
|
|
840
|
+
|
|
815
841
|
private onPrimaryPageChanged(): void {
|
|
816
842
|
this.requestIds = new Map();
|
|
817
843
|
this.startedRequests = 0;
|
|
@@ -438,7 +438,8 @@ export class AISettingsTab extends UI.Widget.VBox {
|
|
|
438
438
|
#aiAssistanceSetting?: Common.Settings.Setting<boolean>;
|
|
439
439
|
#aiCodeCompletionSetting?: Common.Settings.Setting<boolean>;
|
|
440
440
|
#aidaAvailability = Host.AidaClient.AidaAccessPreconditions.NO_ACCOUNT_EMAIL;
|
|
441
|
-
#boundOnAidaAvailabilityChange:
|
|
441
|
+
#boundOnAidaAvailabilityChange:
|
|
442
|
+
(ev: Common.EventTarget.EventTargetEvent<Host.AidaClient.AidaAccessPreconditions>) => void;
|
|
442
443
|
// Setting to parameters needed to display it in the UI.
|
|
443
444
|
// To display a a setting, it needs to be added to this map.
|
|
444
445
|
#settingToParams = new Map<Common.Settings.Setting<boolean>, AiSettingParams>();
|
|
@@ -514,7 +515,10 @@ export class AISettingsTab extends UI.Widget.VBox {
|
|
|
514
515
|
super.wasShown();
|
|
515
516
|
Host.AidaClient.HostConfigTracker.instance().addEventListener(
|
|
516
517
|
Host.AidaClient.Events.AIDA_AVAILABILITY_CHANGED, this.#boundOnAidaAvailabilityChange);
|
|
517
|
-
|
|
518
|
+
const initialAvailability = Host.AidaClient.HostConfigTracker.instance().aidaAvailability;
|
|
519
|
+
if (initialAvailability !== undefined) {
|
|
520
|
+
this.#updateAidaAvailability(initialAvailability);
|
|
521
|
+
}
|
|
518
522
|
this.requestUpdate();
|
|
519
523
|
}
|
|
520
524
|
|
|
@@ -657,14 +661,17 @@ export class AISettingsTab extends UI.Widget.VBox {
|
|
|
657
661
|
}
|
|
658
662
|
}
|
|
659
663
|
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
this.#aidaAvailability = currentAidaAvailability;
|
|
664
|
+
#updateAidaAvailability(aidaAvailability: Host.AidaClient.AidaAccessPreconditions): void {
|
|
665
|
+
if (aidaAvailability !== this.#aidaAvailability) {
|
|
666
|
+
this.#aidaAvailability = aidaAvailability;
|
|
664
667
|
this.requestUpdate();
|
|
665
668
|
}
|
|
666
669
|
}
|
|
667
670
|
|
|
671
|
+
#onAidaAvailabilityChange(ev: Common.EventTarget.EventTargetEvent<Host.AidaClient.AidaAccessPreconditions>): void {
|
|
672
|
+
this.#updateAidaAvailability(ev.data);
|
|
673
|
+
}
|
|
674
|
+
|
|
668
675
|
#getAiAssistanceSettingDescription(): Platform.UIString.LocalizedString {
|
|
669
676
|
const {hostConfig} = Root.Runtime;
|
|
670
677
|
if (hostConfig.devToolsAiAssistanceV2?.enabled) {
|
|
@@ -2287,16 +2287,27 @@ export function computePopoverHighlightRange(state: CodeMirror.EditorState, mime
|
|
|
2287
2287
|
}
|
|
2288
2288
|
}
|
|
2289
2289
|
|
|
2290
|
-
function containsSideEffects(doc: CodeMirror.Text, root: CodeMirror.SyntaxNode): boolean {
|
|
2290
|
+
export function containsSideEffects(doc: CodeMirror.Text, root: CodeMirror.SyntaxNode): boolean {
|
|
2291
2291
|
let containsSideEffects = false;
|
|
2292
2292
|
root.toTree().iterate({
|
|
2293
2293
|
enter(node: CodeMirror.SyntaxNode): boolean {
|
|
2294
2294
|
switch (node.name) {
|
|
2295
2295
|
case 'AssignmentExpression':
|
|
2296
|
-
case 'CallExpression':
|
|
2296
|
+
case 'CallExpression':
|
|
2297
|
+
case 'NewExpression':
|
|
2298
|
+
case 'TaggedTemplateExpression':
|
|
2299
|
+
case 'DynamicImport': {
|
|
2297
2300
|
containsSideEffects = true;
|
|
2298
2301
|
return false;
|
|
2299
2302
|
}
|
|
2303
|
+
case 'UnaryExpression': {
|
|
2304
|
+
const text = doc.sliceString(root.from + node.from, root.from + node.to).trim();
|
|
2305
|
+
if (text.startsWith('delete')) {
|
|
2306
|
+
containsSideEffects = true;
|
|
2307
|
+
return false;
|
|
2308
|
+
}
|
|
2309
|
+
break;
|
|
2310
|
+
}
|
|
2300
2311
|
case 'ArithOp': {
|
|
2301
2312
|
const op = doc.sliceString(root.from + node.from, root.from + node.to);
|
|
2302
2313
|
if (op === '++' || op === '--') {
|
|
@@ -17,6 +17,7 @@ import * as SDK from '../../../core/sdk/sdk.js';
|
|
|
17
17
|
import * as CrUXManager from '../../../models/crux-manager/crux-manager.js';
|
|
18
18
|
import * as EmulationModel from '../../../models/emulation/emulation.js';
|
|
19
19
|
import * as LiveMetrics from '../../../models/live-metrics/live-metrics.js';
|
|
20
|
+
import type * as Spec from '../../../models/live-metrics/web-vitals-injected/spec/spec.js';
|
|
20
21
|
import * as Trace from '../../../models/trace/trace.js';
|
|
21
22
|
import * as Buttons from '../../../ui/components/buttons/buttons.js';
|
|
22
23
|
import type * as Menus from '../../../ui/components/menus/menus.js';
|
|
@@ -44,6 +45,10 @@ const DEVICE_OPTION_LIST: DeviceOption[] = ['AUTO', ...CrUXManager.DEVICE_SCOPE_
|
|
|
44
45
|
const RTT_MINIMUM = 60;
|
|
45
46
|
|
|
46
47
|
const UIStrings = {
|
|
48
|
+
/**
|
|
49
|
+
* @description Label of a badge/pill indicating that the metrics are for a soft navigation.
|
|
50
|
+
*/
|
|
51
|
+
softNavigationPillText: 'SOFT NAV',
|
|
47
52
|
/**
|
|
48
53
|
* @description Title of a view that shows performance metrics from the local environment and field metrics collected from real users. "field metrics" should be interpreted as "real user metrics".
|
|
49
54
|
*/
|
|
@@ -317,6 +322,7 @@ export interface ViewInput {
|
|
|
317
322
|
logExtraInteractionDetails: (interaction: LiveMetrics.Interaction) => void;
|
|
318
323
|
highlightedInteractionId?: string;
|
|
319
324
|
highlightedLayoutShiftClusterIds?: Set<string>;
|
|
325
|
+
navigationType?: Spec.NavigationType;
|
|
320
326
|
}
|
|
321
327
|
|
|
322
328
|
export interface ViewOutput {
|
|
@@ -1010,7 +1016,10 @@ export const DEFAULT_VIEW: View = (input, output, target) => {
|
|
|
1010
1016
|
<div class="container">
|
|
1011
1017
|
<div class="live-metrics-view">
|
|
1012
1018
|
<main class="live-metrics">
|
|
1013
|
-
<
|
|
1019
|
+
<div class="section-header">
|
|
1020
|
+
<h2 class="section-title">${liveMetricsTitle}</h2>
|
|
1021
|
+
${input.navigationType === 'soft-navigation' ? html`<span class="badge">${i18nString(UIStrings.softNavigationPillText)}</span>` : nothing}
|
|
1022
|
+
</div>
|
|
1014
1023
|
<div class="metric-cards">
|
|
1015
1024
|
<div id="lcp">
|
|
1016
1025
|
${renderLcpCard(input)}
|
|
@@ -1098,6 +1107,7 @@ export class LiveMetricsView extends UI.Widget.Widget {
|
|
|
1098
1107
|
#lcpValue?: LiveMetrics.LcpValue;
|
|
1099
1108
|
#clsValue?: LiveMetrics.ClsValue;
|
|
1100
1109
|
#inpValue?: LiveMetrics.InpValue;
|
|
1110
|
+
#navigationType?: Spec.NavigationType;
|
|
1101
1111
|
#interactions: LiveMetrics.InteractionMap = new Map();
|
|
1102
1112
|
#layoutShifts: LiveMetrics.LayoutShift[] = [];
|
|
1103
1113
|
|
|
@@ -1125,6 +1135,7 @@ export class LiveMetricsView extends UI.Widget.Widget {
|
|
|
1125
1135
|
this.#lcpValue = event.data.lcp;
|
|
1126
1136
|
this.#clsValue = event.data.cls;
|
|
1127
1137
|
this.#inpValue = event.data.inp;
|
|
1138
|
+
this.#navigationType = event.data.navigationType;
|
|
1128
1139
|
|
|
1129
1140
|
const hasNewLS = this.#layoutShifts.length < event.data.layoutShifts.length;
|
|
1130
1141
|
this.#layoutShifts = [...event.data.layoutShifts];
|
|
@@ -1182,6 +1193,7 @@ export class LiveMetricsView extends UI.Widget.Widget {
|
|
|
1182
1193
|
this.#inpValue = liveMetrics.inpValue;
|
|
1183
1194
|
this.#interactions = liveMetrics.interactions;
|
|
1184
1195
|
this.#layoutShifts = liveMetrics.layoutShifts;
|
|
1196
|
+
this.#navigationType = liveMetrics.navigationType;
|
|
1185
1197
|
this.requestUpdate();
|
|
1186
1198
|
}
|
|
1187
1199
|
|
|
@@ -1249,6 +1261,7 @@ export class LiveMetricsView extends UI.Widget.Widget {
|
|
|
1249
1261
|
logExtraInteractionDetails: this.#logExtraInteractionDetails.bind(this),
|
|
1250
1262
|
highlightedInteractionId: this.#highlightedInteractionId,
|
|
1251
1263
|
highlightedLayoutShiftClusterIds: this.#highlightedLayoutShiftClusterIds,
|
|
1264
|
+
navigationType: this.#navigationType,
|
|
1252
1265
|
};
|
|
1253
1266
|
|
|
1254
1267
|
this.#view(viewInput, this.#viewOutput, this.contentElement);
|
|
@@ -394,3 +394,31 @@ devtools-link {
|
|
|
394
394
|
.node-description {
|
|
395
395
|
margin-bottom: 12px;
|
|
396
396
|
}
|
|
397
|
+
|
|
398
|
+
.section-header {
|
|
399
|
+
display: flex;
|
|
400
|
+
align-items: center;
|
|
401
|
+
gap: 8px;
|
|
402
|
+
margin-bottom: 10px;
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
.section-header .section-title {
|
|
406
|
+
margin-bottom: 0;
|
|
407
|
+
}
|
|
408
|
+
|
|
409
|
+
.section-header .badge {
|
|
410
|
+
display: inline-flex;
|
|
411
|
+
align-items: center;
|
|
412
|
+
width: fit-content;
|
|
413
|
+
height: var(--sys-size-8);
|
|
414
|
+
line-height: var(--sys-size-8);
|
|
415
|
+
border-radius: var(--sys-shape-corner-extra-small);
|
|
416
|
+
padding: 0 var(--sys-size-3);
|
|
417
|
+
border: var(--sys-size-1) solid var(--sys-color-primary);
|
|
418
|
+
color: var(--sys-color-primary);
|
|
419
|
+
font-weight: var(--ref-typeface-weight-bold);
|
|
420
|
+
font-size: var(--sys-size-5);
|
|
421
|
+
text-align: center;
|
|
422
|
+
margin-top: var(--sys-size-5);
|
|
423
|
+
margin-bottom: var(--sys-size-5);
|
|
424
|
+
}
|
|
@@ -66,6 +66,10 @@ const UIStrings = {
|
|
|
66
66
|
* @description Title of a setting under the Performance category in Settings
|
|
67
67
|
*/
|
|
68
68
|
timelineShowAllEvents: 'Show all events',
|
|
69
|
+
/**
|
|
70
|
+
* @description Title of a setting under the Performance category in Settings
|
|
71
|
+
*/
|
|
72
|
+
enableSoftNavigations: 'Enable soft navigation performance monitoring',
|
|
69
73
|
/**
|
|
70
74
|
* @description Title of a setting under the Performance category in Settings
|
|
71
75
|
*/
|
|
@@ -399,6 +403,15 @@ Common.Settings.registerSettingExtension({
|
|
|
399
403
|
defaultValue: false,
|
|
400
404
|
});
|
|
401
405
|
|
|
406
|
+
Common.Settings.registerSettingExtension({
|
|
407
|
+
category: Common.Settings.SettingCategory.PERFORMANCE,
|
|
408
|
+
storageType: Common.Settings.SettingStorageType.SYNCED,
|
|
409
|
+
title: i18nLazyString(UIStrings.enableSoftNavigations),
|
|
410
|
+
settingName: 'timeline-enable-soft-navigations',
|
|
411
|
+
settingType: Common.Settings.SettingType.BOOLEAN,
|
|
412
|
+
defaultValue: true,
|
|
413
|
+
});
|
|
414
|
+
|
|
402
415
|
// IMPORTANT: if you are updating this, you should also update the setting in
|
|
403
416
|
// js_timeline-meta.
|
|
404
417
|
Common.Settings.registerSettingExtension({
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
Name: Dependencies sourced from the upstream `chromium` repository
|
|
2
2
|
URL: Internal
|
|
3
3
|
Version: N/A
|
|
4
|
-
Revision:
|
|
4
|
+
Revision: e5e53aeb8a8dee88dadf13158fd44662113307d2
|
|
5
5
|
Update Mechanism: Manual (https://crbug.com/428069060)
|
|
6
6
|
License: BSD-3-Clause
|
|
7
7
|
License File: LICENSE
|
|
@@ -78,7 +78,16 @@ export class AiCodeCompletionProvider {
|
|
|
78
78
|
#aiCodeGenerationConfig?: AiCodeGenerationConfig;
|
|
79
79
|
#aiCodeGenerationProvider?: AiCodeGenerationProvider;
|
|
80
80
|
|
|
81
|
-
#
|
|
81
|
+
#boundOnAidaAvailabilityChange =
|
|
82
|
+
(ev: Common.EventTarget.EventTargetEvent<Host.AidaClient.AidaAccessPreconditions>): void => {
|
|
83
|
+
this.#updateAiCodeCompletionStateWithAvailability(ev.data);
|
|
84
|
+
};
|
|
85
|
+
#boundOnSettingChange = (): void => {
|
|
86
|
+
const aidaAvailability = Host.AidaClient.HostConfigTracker.instance().aidaAvailability;
|
|
87
|
+
if (aidaAvailability !== undefined) {
|
|
88
|
+
this.#updateAiCodeCompletionStateWithAvailability(aidaAvailability);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
82
91
|
|
|
83
92
|
private constructor(aiCodeCompletionConfig: AiCodeCompletionConfig) {
|
|
84
93
|
if (!AiCodeCompletion.AiCodeCompletion.AiCodeCompletion.isAiCodeCompletionAvailable()) {
|
|
@@ -122,9 +131,9 @@ export class AiCodeCompletionProvider {
|
|
|
122
131
|
dispose(): void {
|
|
123
132
|
this.#detachTeaser();
|
|
124
133
|
this.#teaser = undefined;
|
|
125
|
-
this.#aiCodeCompletionSetting.removeChangeListener(this.#
|
|
126
|
-
Host.AidaClient.HostConfigTracker.instance().removeEventListener(
|
|
127
|
-
|
|
134
|
+
this.#aiCodeCompletionSetting.removeChangeListener(this.#boundOnSettingChange);
|
|
135
|
+
Host.AidaClient.HostConfigTracker.instance().removeEventListener(Host.AidaClient.Events.AIDA_AVAILABILITY_CHANGED,
|
|
136
|
+
this.#boundOnAidaAvailabilityChange);
|
|
128
137
|
this.#cleanupAiCodeCompletion();
|
|
129
138
|
this.#aiCodeGenerationProvider?.dispose();
|
|
130
139
|
}
|
|
@@ -139,10 +148,13 @@ export class AiCodeCompletionProvider {
|
|
|
139
148
|
this.#editor.editor.dispatch(
|
|
140
149
|
{effects: this.#teaserCompartment.reconfigure([aiCodeCompletionTeaserExtension(this.#teaser)])});
|
|
141
150
|
}
|
|
142
|
-
Host.AidaClient.HostConfigTracker.instance().addEventListener(
|
|
143
|
-
|
|
144
|
-
this.#aiCodeCompletionSetting.addChangeListener(this.#
|
|
145
|
-
|
|
151
|
+
Host.AidaClient.HostConfigTracker.instance().addEventListener(Host.AidaClient.Events.AIDA_AVAILABILITY_CHANGED,
|
|
152
|
+
this.#boundOnAidaAvailabilityChange);
|
|
153
|
+
this.#aiCodeCompletionSetting.addChangeListener(this.#boundOnSettingChange);
|
|
154
|
+
const initialAvailability = Host.AidaClient.HostConfigTracker.instance().aidaAvailability;
|
|
155
|
+
if (initialAvailability !== undefined) {
|
|
156
|
+
this.#updateAiCodeCompletionStateWithAvailability(initialAvailability);
|
|
157
|
+
}
|
|
146
158
|
this.#aiCodeGenerationProvider?.editorInitialized(editor);
|
|
147
159
|
}
|
|
148
160
|
|
|
@@ -183,8 +195,7 @@ export class AiCodeCompletionProvider {
|
|
|
183
195
|
this.#aiCodeCompletionConfig?.onFeatureDisabled();
|
|
184
196
|
}
|
|
185
197
|
|
|
186
|
-
|
|
187
|
-
const aidaAvailability = await Host.AidaClient.AidaClient.checkAccessPreconditions();
|
|
198
|
+
#updateAiCodeCompletionStateWithAvailability(aidaAvailability: Host.AidaClient.AidaAccessPreconditions): void {
|
|
188
199
|
const isAvailable = aidaAvailability === Host.AidaClient.AidaAccessPreconditions.AVAILABLE;
|
|
189
200
|
const devtoolsLocale = i18n.DevToolsLocale.DevToolsLocale.instance().locale;
|
|
190
201
|
const aiCodeCompletionEnabled =
|
|
@@ -67,7 +67,16 @@ export class AiCodeGenerationProvider {
|
|
|
67
67
|
#aiCodeGenerationCitations: Host.AidaClient.Citation[] = [];
|
|
68
68
|
|
|
69
69
|
#aidaClient: Host.AidaClient.AidaClient = new Host.AidaClient.AidaClient();
|
|
70
|
-
#
|
|
70
|
+
#boundOnAidaAvailabilityChange =
|
|
71
|
+
(ev: Common.EventTarget.EventTargetEvent<Host.AidaClient.AidaAccessPreconditions>): void => {
|
|
72
|
+
void this.#updateAiCodeGenerationStateWithAvailability(ev.data);
|
|
73
|
+
};
|
|
74
|
+
#boundOnSettingChange = (): void => {
|
|
75
|
+
const aidaAvailability = Host.AidaClient.HostConfigTracker.instance().aidaAvailability;
|
|
76
|
+
if (aidaAvailability !== undefined) {
|
|
77
|
+
void this.#updateAiCodeGenerationStateWithAvailability(aidaAvailability);
|
|
78
|
+
}
|
|
79
|
+
};
|
|
71
80
|
#controller = new AbortController();
|
|
72
81
|
|
|
73
82
|
private constructor(aiCodeGenerationConfig: AiCodeGenerationConfig) {
|
|
@@ -100,17 +109,20 @@ export class AiCodeGenerationProvider {
|
|
|
100
109
|
dispose(): void {
|
|
101
110
|
this.#controller.abort();
|
|
102
111
|
this.#cleanupAiCodeGeneration();
|
|
103
|
-
this.#aiCodeGenerationEnabledSetting.removeChangeListener(this.#
|
|
104
|
-
Host.AidaClient.HostConfigTracker.instance().removeEventListener(
|
|
105
|
-
|
|
112
|
+
this.#aiCodeGenerationEnabledSetting.removeChangeListener(this.#boundOnSettingChange);
|
|
113
|
+
Host.AidaClient.HostConfigTracker.instance().removeEventListener(Host.AidaClient.Events.AIDA_AVAILABILITY_CHANGED,
|
|
114
|
+
this.#boundOnAidaAvailabilityChange);
|
|
106
115
|
}
|
|
107
116
|
|
|
108
117
|
editorInitialized(editor: TextEditor): void {
|
|
109
118
|
this.#editor = editor;
|
|
110
|
-
Host.AidaClient.HostConfigTracker.instance().addEventListener(
|
|
111
|
-
|
|
112
|
-
this.#aiCodeGenerationEnabledSetting.addChangeListener(this.#
|
|
113
|
-
|
|
119
|
+
Host.AidaClient.HostConfigTracker.instance().addEventListener(Host.AidaClient.Events.AIDA_AVAILABILITY_CHANGED,
|
|
120
|
+
this.#boundOnAidaAvailabilityChange);
|
|
121
|
+
this.#aiCodeGenerationEnabledSetting.addChangeListener(this.#boundOnSettingChange);
|
|
122
|
+
const initialAvailability = Host.AidaClient.HostConfigTracker.instance().aidaAvailability;
|
|
123
|
+
if (initialAvailability !== undefined) {
|
|
124
|
+
void this.#updateAiCodeGenerationStateWithAvailability(initialAvailability);
|
|
125
|
+
}
|
|
114
126
|
}
|
|
115
127
|
|
|
116
128
|
async #setupAiCodeGeneration(): Promise<void> {
|
|
@@ -137,8 +149,8 @@ export class AiCodeGenerationProvider {
|
|
|
137
149
|
});
|
|
138
150
|
}
|
|
139
151
|
|
|
140
|
-
async #
|
|
141
|
-
|
|
152
|
+
async #updateAiCodeGenerationStateWithAvailability(aidaAvailability: Host.AidaClient.AidaAccessPreconditions):
|
|
153
|
+
Promise<void> {
|
|
142
154
|
const isAvailable = aidaAvailability === Host.AidaClient.AidaAccessPreconditions.AVAILABLE;
|
|
143
155
|
const devtoolsLocale = i18n.DevToolsLocale.DevToolsLocale.instance().locale;
|
|
144
156
|
const aiCodeGenerationEnabled =
|
|
@@ -411,6 +411,13 @@ function getTooltipHost(): ShadowRoot {
|
|
|
411
411
|
return tooltipHost;
|
|
412
412
|
}
|
|
413
413
|
|
|
414
|
+
export function removeTooltipHost(): void {
|
|
415
|
+
if (tooltipHost) {
|
|
416
|
+
tooltipHost.host.remove();
|
|
417
|
+
tooltipHost = null;
|
|
418
|
+
}
|
|
419
|
+
}
|
|
420
|
+
|
|
414
421
|
class CompletionHint extends CM.WidgetType {
|
|
415
422
|
constructor(readonly text: string) {
|
|
416
423
|
super();
|
|
@@ -3,11 +3,12 @@
|
|
|
3
3
|
// found in the LICENSE file.
|
|
4
4
|
|
|
5
5
|
import * as Root from '../../core/root/root.js';
|
|
6
|
+
import type * as Foundation from '../../foundation/foundation.js';
|
|
6
7
|
|
|
7
8
|
import type {App} from './App.js';
|
|
8
9
|
|
|
9
10
|
export interface AppProvider {
|
|
10
|
-
createApp(): App;
|
|
11
|
+
createApp(universe: Foundation.Universe.Universe): App;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
const registeredAppProvider: AppProviderRegistration[] = [];
|