chrome-devtools-frontend 1.0.1526203 → 1.0.1528866
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/docs/ui_engineering.md +159 -0
- package/eslint.config.mjs +6 -1
- package/front_end/core/i18n/i18nImpl.ts +5 -0
- package/front_end/core/protocol_client/protocol_client.ts +1 -1
- package/front_end/core/root/Runtime.ts +28 -4
- package/front_end/core/sdk/CSSMatchedStyles.ts +50 -7
- package/front_end/core/sdk/CSSRule.ts +35 -6
- package/front_end/core/sdk/ChildTargetManager.ts +2 -0
- package/front_end/core/sdk/Connections.ts +2 -1
- package/front_end/core/sdk/DOMModel.ts +4 -0
- package/front_end/core/sdk/DebuggerModel.ts +5 -1
- package/front_end/core/sdk/NetworkManager.ts +214 -31
- package/front_end/core/sdk/PreloadingModel.ts +82 -17
- package/front_end/core/sdk/RehydratingConnection.snapshot.txt +1 -1
- package/front_end/core/sdk/RehydratingConnection.ts +29 -4
- package/front_end/core/sdk/ScopeTreeCache.ts +8 -3
- package/front_end/core/sdk/SourceMap.ts +37 -11
- package/front_end/core/sdk/SourceMapManager.ts +13 -2
- package/front_end/core/sdk/SourceMapScopesInfo.ts +17 -0
- package/front_end/core/sdk/TargetManager.ts +0 -22
- package/front_end/core/sdk/TraceObject.ts +8 -7
- package/front_end/entrypoints/heap_snapshot_worker/HeapSnapshot.ts +81 -0
- package/front_end/entrypoints/inspector_main/InspectorMain.ts +3 -1
- package/front_end/entrypoints/main/GlobalAiButton.ts +1 -0
- package/front_end/entrypoints/main/MainImpl.ts +20 -25
- package/front_end/generated/InspectorBackendCommands.js +4 -3
- package/front_end/generated/protocol-mapping.d.ts +3 -1
- package/front_end/generated/protocol-proxy-api.d.ts +3 -1
- package/front_end/generated/protocol.ts +17 -3
- package/front_end/models/ai_assistance/BuiltInAi.ts +111 -0
- package/front_end/models/ai_assistance/ai_assistance.ts +53 -24
- package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.snapshot.txt +105 -0
- package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.ts +6 -1
- package/front_end/models/extensions/ExtensionView.ts +3 -0
- package/front_end/models/javascript_metadata/NativeFunctions.js +23 -27
- package/front_end/models/live-metrics/web-vitals-injected/web-vitals-injected.ts +31 -29
- package/front_end/models/persistence/EditFileSystemView.ts +1 -0
- package/front_end/models/source_map_scopes/NamesResolver.ts +5 -11
- package/front_end/models/stack_trace/Trie.ts +9 -0
- package/front_end/models/trace/lantern/types/Lantern.ts +1 -1
- package/front_end/panels/accessibility/AXBreadcrumbsPane.ts +1 -0
- package/front_end/panels/accessibility/AccessibilitySidebarView.ts +1 -0
- package/front_end/panels/ai_assistance/AiAssistancePanel.ts +120 -113
- package/front_end/panels/ai_assistance/PatchWidget.ts +9 -8
- package/front_end/panels/ai_assistance/SelectWorkspaceDialog.ts +2 -0
- package/front_end/panels/ai_assistance/components/ChatView.ts +29 -29
- package/front_end/panels/ai_assistance/components/UserActionRow.ts +1 -0
- package/front_end/panels/animation/AnimationTimeline.ts +1 -0
- package/front_end/panels/application/CookieItemsView.ts +1 -0
- package/front_end/panels/application/KeyValueStorageItemsView.ts +1 -0
- package/front_end/panels/application/ServiceWorkerCacheViews.ts +2 -0
- package/front_end/panels/application/preloading/components/PreloadingDetailsReportView.ts +11 -5
- package/front_end/panels/application/preloading/components/PreloadingMismatchedHeadersGrid.ts +2 -2
- package/front_end/panels/application/preloading/components/PreloadingString.ts +7 -5
- package/front_end/panels/application/preloading/components/UsedPreloadingView.ts +22 -10
- package/front_end/panels/changes/CombinedDiffView.ts +1 -0
- package/front_end/panels/console/ConsoleInsightTeaser.ts +106 -0
- package/front_end/panels/console/ConsolePanel.ts +2 -0
- package/front_end/panels/console/ConsolePrompt.ts +12 -2
- package/front_end/panels/console/ConsoleSidebar.ts +1 -1
- package/front_end/panels/console/ConsoleView.ts +12 -0
- package/front_end/panels/console/ConsoleViewMessage.ts +27 -0
- package/front_end/panels/{explain → console}/PromptBuilder.ts +12 -7
- package/front_end/panels/console/console.ts +6 -0
- package/front_end/panels/console/consoleInsightTeaser.css +55 -0
- package/front_end/panels/coverage/CoverageListView.ts +141 -277
- package/front_end/panels/coverage/CoverageView.ts +330 -324
- package/front_end/panels/coverage/coverageView.css +17 -0
- package/front_end/panels/elements/ComputedStyleWidget.ts +1 -0
- package/front_end/panels/elements/LayoutPane.ts +1 -0
- package/front_end/panels/elements/NodeStackTraceWidget.ts +1 -0
- package/front_end/panels/elements/StylePropertyTreeElement.ts +5 -1
- package/front_end/panels/elements/stylePropertiesTreeOutline.css +17 -0
- package/front_end/panels/emulation/DeviceModeView.ts +2 -0
- package/front_end/panels/explain/ActionDelegate.ts +1 -2
- package/front_end/panels/explain/components/ConsoleInsight.ts +14 -12
- package/front_end/panels/explain/explain.ts +0 -1
- package/front_end/panels/js_timeline/js_timeline-meta.ts +1 -1
- package/front_end/panels/layer_viewer/Layers3DView.ts +2 -0
- package/front_end/panels/lighthouse/LighthouseReportSelector.ts +1 -0
- package/front_end/panels/linear_memory_inspector/LinearMemoryInspectorPane.ts +12 -19
- package/front_end/panels/linear_memory_inspector/components/LinearMemoryInspector.ts +27 -43
- package/front_end/panels/media/MainView.ts +1 -0
- package/front_end/panels/media/TickingFlameChart.ts +2 -0
- package/front_end/panels/network/BlockedURLsPane.ts +111 -85
- package/front_end/panels/network/EventSourceMessagesView.ts +1 -0
- package/front_end/panels/network/NetworkItemView.ts +1 -0
- package/front_end/panels/network/NetworkLogView.ts +9 -7
- package/front_end/panels/network/NetworkOverview.ts +1 -0
- package/front_end/panels/network/RequestCookiesView.ts +1 -0
- package/front_end/panels/network/RequestHTMLView.ts +1 -0
- package/front_end/panels/network/RequestInitiatorView.ts +1 -0
- package/front_end/panels/network/RequestPayloadView.ts +1 -0
- package/front_end/panels/network/RequestPreviewView.ts +1 -0
- package/front_end/panels/network/RequestResponseView.ts +2 -1
- package/front_end/panels/network/RequestTimingView.ts +2 -0
- package/front_end/panels/network/ResourceDirectSocketChunkView.ts +1 -0
- package/front_end/panels/network/ResourceWebSocketFrameView.ts +1 -0
- package/front_end/panels/network/components/RequestHeadersView.ts +2 -0
- package/front_end/panels/network/components/RequestTrustTokensView.ts +2 -0
- package/front_end/panels/performance_monitor/PerformanceMonitor.ts +2 -0
- package/front_end/panels/profiler/HeapSnapshotDataGrids.ts +2 -0
- package/front_end/panels/profiler/HeapSnapshotView.ts +7 -0
- package/front_end/panels/profiler/IsolateSelector.ts +1 -0
- package/front_end/panels/profiler/LiveHeapProfileView.ts +1 -0
- package/front_end/panels/profiler/ProfileView.ts +1 -0
- package/front_end/panels/protocol_monitor/ProtocolMonitor.ts +1 -0
- package/front_end/panels/recorder/RecorderPanel.ts +2 -0
- package/front_end/panels/screencast/ScreencastView.ts +1 -0
- package/front_end/panels/search/SearchView.ts +1 -0
- package/front_end/panels/settings/AISettingsTab.ts +3 -3
- package/front_end/panels/settings/WorkspaceSettingsTab.ts +2 -0
- package/front_end/panels/settings/emulation/components/UserAgentClientHintsForm.ts +2 -2
- package/front_end/panels/sources/AiCodeCompletionPlugin.ts +12 -0
- package/front_end/panels/sources/BreakpointsView.ts +1 -0
- package/front_end/panels/sources/DebuggerPlugin.ts +1 -0
- package/front_end/panels/sources/UISourceCodeFrame.ts +17 -2
- package/front_end/panels/timeline/README.md +2 -2
- package/front_end/panels/timeline/TimelineFlameChartDataProvider.ts +1 -1
- package/front_end/panels/timeline/TimelineFlameChartView.ts +4 -3
- package/front_end/panels/timeline/TimelineLayersView.ts +1 -0
- package/front_end/panels/timeline/TimelinePaintProfilerView.ts +114 -37
- package/front_end/panels/timeline/TimelinePanel.ts +43 -62
- package/front_end/panels/timeline/TimelineTreeView.ts +1 -0
- package/front_end/panels/timeline/components/LiveMetricsView.ts +4 -8
- package/front_end/panels/timeline/components/Sidebar.ts +2 -0
- package/front_end/panels/timeline/components/SidebarSingleInsightSet.ts +1 -1
- package/front_end/panels/timeline/components/insights/BaseInsightComponent.ts +7 -7
- package/front_end/panels/timeline/overlays/OverlaysImpl.ts +1 -1
- package/front_end/panels/timeline/overlays/components/EntryLabelOverlay.ts +4 -4
- package/front_end/panels/web_audio/WebAudioView.ts +1 -0
- package/front_end/third_party/chromium/README.chromium +1 -1
- package/front_end/third_party/lighthouse/README.chromium +2 -2
- package/front_end/third_party/lighthouse/lighthouse-dt-bundle.js +1530 -2426
- package/front_end/third_party/lighthouse/locales/ar-XB.json +107 -455
- package/front_end/third_party/lighthouse/locales/ar.json +107 -455
- package/front_end/third_party/lighthouse/locales/bg.json +96 -444
- package/front_end/third_party/lighthouse/locales/ca.json +96 -444
- package/front_end/third_party/lighthouse/locales/cs.json +96 -444
- package/front_end/third_party/lighthouse/locales/da.json +96 -444
- package/front_end/third_party/lighthouse/locales/de.json +96 -444
- package/front_end/third_party/lighthouse/locales/el.json +96 -444
- package/front_end/third_party/lighthouse/locales/en-GB.json +96 -444
- package/front_end/third_party/lighthouse/locales/en-US.json +116 -467
- package/front_end/third_party/lighthouse/locales/en-XA.json +93 -441
- package/front_end/third_party/lighthouse/locales/en-XL.json +116 -467
- package/front_end/third_party/lighthouse/locales/es-419.json +96 -444
- package/front_end/third_party/lighthouse/locales/es.json +96 -444
- package/front_end/third_party/lighthouse/locales/fi.json +96 -444
- package/front_end/third_party/lighthouse/locales/fil.json +96 -444
- package/front_end/third_party/lighthouse/locales/fr.json +96 -444
- package/front_end/third_party/lighthouse/locales/he.json +118 -466
- package/front_end/third_party/lighthouse/locales/hi.json +96 -444
- package/front_end/third_party/lighthouse/locales/hr.json +100 -448
- package/front_end/third_party/lighthouse/locales/hu.json +96 -444
- package/front_end/third_party/lighthouse/locales/id.json +96 -444
- package/front_end/third_party/lighthouse/locales/it.json +96 -444
- package/front_end/third_party/lighthouse/locales/ja.json +96 -444
- package/front_end/third_party/lighthouse/locales/ko.json +97 -445
- package/front_end/third_party/lighthouse/locales/lt.json +96 -444
- package/front_end/third_party/lighthouse/locales/lv.json +97 -445
- package/front_end/third_party/lighthouse/locales/nl.json +96 -444
- package/front_end/third_party/lighthouse/locales/no.json +96 -444
- package/front_end/third_party/lighthouse/locales/pl.json +96 -444
- package/front_end/third_party/lighthouse/locales/pt-PT.json +96 -444
- package/front_end/third_party/lighthouse/locales/pt.json +97 -445
- package/front_end/third_party/lighthouse/locales/ro.json +97 -445
- package/front_end/third_party/lighthouse/locales/ru.json +96 -444
- package/front_end/third_party/lighthouse/locales/sk.json +96 -444
- package/front_end/third_party/lighthouse/locales/sl.json +96 -444
- package/front_end/third_party/lighthouse/locales/sr-Latn.json +96 -444
- package/front_end/third_party/lighthouse/locales/sr.json +96 -444
- package/front_end/third_party/lighthouse/locales/sv.json +96 -444
- package/front_end/third_party/lighthouse/locales/ta.json +96 -444
- package/front_end/third_party/lighthouse/locales/te.json +97 -445
- package/front_end/third_party/lighthouse/locales/th.json +96 -444
- package/front_end/third_party/lighthouse/locales/tr.json +96 -444
- package/front_end/third_party/lighthouse/locales/uk.json +96 -444
- package/front_end/third_party/lighthouse/locales/vi.json +96 -444
- package/front_end/third_party/lighthouse/locales/zh-HK.json +96 -444
- package/front_end/third_party/lighthouse/locales/zh-TW.json +97 -445
- package/front_end/third_party/lighthouse/locales/zh.json +96 -444
- package/front_end/third_party/lighthouse/report/bundle.d.ts +8 -14
- package/front_end/third_party/lighthouse/report/bundle.js +10 -49
- package/front_end/third_party/lighthouse/report-assets/report-generator.mjs +1 -1
- package/front_end/third_party/web-vitals/README.chromium +5 -8
- package/front_end/third_party/web-vitals/package/README.md +191 -152
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/index.d.ts +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/index.js +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onCLS.d.ts +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onCLS.js +45 -26
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onFCP.d.ts +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onFCP.js +3 -3
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onINP.d.ts +10 -10
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onINP.js +307 -206
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onLCP.d.ts +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onLCP.js +69 -49
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onTTFB.d.ts +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onTTFB.js +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/index.d.ts +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/index.js +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/InteractionManager.d.ts +33 -0
- package/front_end/third_party/web-vitals/package/dist/modules/lib/InteractionManager.js +111 -0
- package/front_end/third_party/web-vitals/package/dist/modules/lib/LCPEntryManager.d.ts +4 -0
- package/front_end/third_party/web-vitals/package/dist/modules/{attribution/deprecated.js → lib/LCPEntryManager.js} +6 -7
- package/front_end/third_party/web-vitals/package/dist/modules/lib/LayoutShiftManager.d.ts +6 -0
- package/front_end/third_party/web-vitals/package/dist/modules/lib/LayoutShiftManager.js +44 -0
- package/front_end/third_party/web-vitals/package/dist/modules/lib/bindReporter.js +1 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/generateUniqueID.js +1 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getActivationStart.js +1 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getNavigationEntry.js +5 -7
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getSelector.d.ts +1 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getSelector.js +9 -12
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getVisibilityWatcher.d.ts +1 -0
- package/front_end/third_party/web-vitals/package/dist/modules/lib/getVisibilityWatcher.js +52 -33
- package/front_end/third_party/web-vitals/package/dist/modules/lib/initMetric.d.ts +0 -2
- package/front_end/third_party/web-vitals/package/dist/modules/lib/initMetric.js +2 -2
- package/front_end/third_party/web-vitals/package/dist/modules/lib/initUnique.d.ts +6 -0
- package/front_end/third_party/web-vitals/package/dist/modules/{deprecated.js → lib/initUnique.js} +11 -4
- package/front_end/third_party/web-vitals/package/dist/modules/lib/observe.js +3 -6
- package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/interactionCountPolyfill.js +6 -6
- package/front_end/third_party/web-vitals/package/dist/modules/lib/{whenIdle.d.ts → whenIdleOrHidden.d.ts} +1 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/{whenIdle.js → whenIdleOrHidden.js} +10 -8
- package/front_end/third_party/web-vitals/package/dist/modules/onCLS.js +17 -35
- package/front_end/third_party/web-vitals/package/dist/modules/onFCP.js +3 -5
- package/front_end/third_party/web-vitals/package/dist/modules/onINP.d.ts +9 -7
- package/front_end/third_party/web-vitals/package/dist/modules/onINP.js +27 -19
- package/front_end/third_party/web-vitals/package/dist/modules/onLCP.js +33 -26
- package/front_end/third_party/web-vitals/package/dist/modules/onTTFB.js +2 -4
- package/front_end/third_party/web-vitals/package/dist/modules/types/base.d.ts +6 -5
- package/front_end/third_party/web-vitals/package/dist/modules/types/cls.d.ts +5 -3
- package/front_end/third_party/web-vitals/package/dist/modules/types/inp.d.ts +80 -33
- package/front_end/third_party/web-vitals/package/dist/modules/types/lcp.d.ts +6 -2
- package/front_end/third_party/web-vitals/package/dist/modules/types.d.ts +28 -4
- package/front_end/third_party/web-vitals/package/dist/modules/types.js +0 -1
- package/front_end/third_party/web-vitals/package/package.json +4 -10
- package/front_end/third_party/web-vitals/package/src/attribution/index.ts +0 -1
- package/front_end/third_party/web-vitals/package/src/attribution/onCLS.ts +58 -33
- package/front_end/third_party/web-vitals/package/src/attribution/onFCP.ts +4 -4
- package/front_end/third_party/web-vitals/package/src/attribution/onINP.ts +382 -258
- package/front_end/third_party/web-vitals/package/src/attribution/onLCP.ts +96 -69
- package/front_end/third_party/web-vitals/package/src/attribution/onTTFB.ts +3 -3
- package/front_end/third_party/web-vitals/package/src/index.ts +0 -1
- package/front_end/third_party/web-vitals/package/src/lib/InteractionManager.ts +146 -0
- package/front_end/third_party/web-vitals/package/src/{attribution/deprecated.ts → lib/LCPEntryManager.ts} +6 -9
- package/front_end/third_party/web-vitals/package/src/lib/LayoutShiftManager.ts +50 -0
- package/front_end/third_party/web-vitals/package/src/lib/bindReporter.ts +1 -1
- package/front_end/third_party/web-vitals/package/src/lib/generateUniqueID.ts +1 -1
- package/front_end/third_party/web-vitals/package/src/lib/getActivationStart.ts +1 -1
- package/front_end/third_party/web-vitals/package/src/lib/getNavigationEntry.ts +5 -8
- package/front_end/third_party/web-vitals/package/src/lib/getSelector.ts +12 -12
- package/front_end/third_party/web-vitals/package/src/lib/getVisibilityWatcher.ts +57 -35
- package/front_end/third_party/web-vitals/package/src/lib/initMetric.ts +2 -2
- package/front_end/third_party/web-vitals/package/src/{deprecated.ts → lib/initUnique.ts} +14 -8
- package/front_end/third_party/web-vitals/package/src/lib/observe.ts +3 -11
- package/front_end/third_party/web-vitals/package/src/lib/polyfills/interactionCountPolyfill.ts +12 -6
- package/front_end/third_party/web-vitals/package/src/lib/{whenIdle.ts → whenIdleOrHidden.ts} +10 -8
- package/front_end/third_party/web-vitals/package/src/onCLS.ts +17 -38
- package/front_end/third_party/web-vitals/package/src/onFCP.ts +3 -6
- package/front_end/third_party/web-vitals/package/src/onINP.ts +33 -28
- package/front_end/third_party/web-vitals/package/src/onLCP.ts +36 -29
- package/front_end/third_party/web-vitals/package/src/onTTFB.ts +2 -5
- package/front_end/third_party/web-vitals/package/src/types/base.ts +5 -5
- package/front_end/third_party/web-vitals/package/src/types/cls.ts +5 -3
- package/front_end/third_party/web-vitals/package/src/types/inp.ts +88 -33
- package/front_end/third_party/web-vitals/package/src/types/lcp.ts +6 -2
- package/front_end/third_party/web-vitals/package/src/types.ts +47 -4
- package/front_end/third_party/web-vitals/patches/0001-Add-onEachInteraction-to-onINP-options.patch +75 -0
- package/front_end/third_party/web-vitals/rebuild.sh +32 -18
- package/front_end/third_party/web-vitals/web-vitals-tsconfig.json +5 -10
- package/front_end/third_party/web-vitals/web-vitals.ts +0 -2
- package/front_end/ui/components/buttons/Button.ts +1 -1
- package/front_end/ui/components/docs/console_insight/basic.ts +3 -2
- package/front_end/ui/components/legacy_wrapper/LegacyWrapper.ts +2 -0
- package/front_end/ui/components/text_editor/TextEditor.ts +0 -2
- package/front_end/ui/legacy/EmptyWidget.ts +11 -1
- package/front_end/ui/legacy/InspectorView.ts +2 -0
- package/front_end/ui/legacy/SplitWidget.ts +2 -0
- package/front_end/ui/legacy/TabbedPane.ts +1 -0
- package/front_end/ui/legacy/TargetCrashedScreen.ts +1 -0
- package/front_end/ui/legacy/Toolbar.ts +25 -4
- package/front_end/ui/legacy/UIUtils.ts +28 -13
- package/front_end/ui/legacy/ViewManager.ts +1 -0
- package/front_end/ui/legacy/Widget.ts +5 -0
- package/front_end/ui/legacy/components/color_picker/FormatPickerContextMenu.ts +7 -20
- package/front_end/ui/legacy/components/color_picker/Spectrum.ts +2 -0
- package/front_end/ui/legacy/components/cookie_table/CookiesTable.ts +1 -0
- package/front_end/ui/legacy/components/data_grid/DataGridElement.ts +1 -1
- package/front_end/ui/legacy/components/inline_editor/BezierEditor.ts +1 -0
- package/front_end/ui/legacy/components/perf_ui/ChartViewport.ts +1 -0
- package/front_end/ui/legacy/components/quick_open/FilteredListWidget.ts +1 -0
- package/front_end/ui/legacy/components/source_frame/FontView.ts +1 -0
- package/front_end/ui/legacy/components/source_frame/ImageView.ts +1 -0
- package/front_end/ui/legacy/components/source_frame/JSONView.ts +1 -0
- package/front_end/ui/legacy/components/source_frame/SourceFrame.ts +1 -0
- package/front_end/ui/legacy/components/source_frame/StreamingContentHexView.ts +9 -8
- package/front_end/ui/visual_logging/KnownContextValues.ts +17 -0
- package/mcp/README.md +7 -0
- package/mcp/mcp.ts +8 -0
- package/package.json +1 -1
- package/front_end/models/live-metrics/web-vitals-injected/OnEachInteraction.ts +0 -34
- package/front_end/third_party/web-vitals/package/attribution.d.ts +0 -16
- package/front_end/third_party/web-vitals/package/attribution.js +0 -18
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/deprecated.d.ts +0 -7
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onFID.d.ts +0 -11
- package/front_end/third_party/web-vitals/package/dist/modules/attribution/onFID.js +0 -46
- package/front_end/third_party/web-vitals/package/dist/modules/deprecated.d.ts +0 -5
- package/front_end/third_party/web-vitals/package/dist/modules/lib/interactions.d.ts +0 -31
- package/front_end/third_party/web-vitals/package/dist/modules/lib/interactions.js +0 -107
- package/front_end/third_party/web-vitals/package/dist/modules/lib/onHidden.d.ts +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/onHidden.js +0 -22
- package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/firstInputPolyfill.d.ts +0 -7
- package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/firstInputPolyfill.js +0 -147
- package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/getFirstHiddenTimePolyfill.d.ts +0 -1
- package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/getFirstHiddenTimePolyfill.js +0 -25
- package/front_end/third_party/web-vitals/package/dist/modules/onFID.d.ts +0 -13
- package/front_end/third_party/web-vitals/package/dist/modules/onFID.js +0 -70
- package/front_end/third_party/web-vitals/package/dist/modules/types/fid.d.ts +0 -46
- package/front_end/third_party/web-vitals/package/dist/modules/types/fid.js +0 -16
- package/front_end/third_party/web-vitals/package/src/attribution/onFID.ts +0 -62
- package/front_end/third_party/web-vitals/package/src/lib/interactions.ts +0 -139
- package/front_end/third_party/web-vitals/package/src/lib/onHidden.ts +0 -23
- package/front_end/third_party/web-vitals/package/src/lib/polyfills/firstInputPolyfill.ts +0 -174
- package/front_end/third_party/web-vitals/package/src/onFID.ts +0 -105
- package/front_end/third_party/web-vitals/package/src/types/fid.ts +0 -65
- package/front_end/ui/components/text_editor/textEditor.css +0 -18
- package/front_end/ui/legacy/inlineButton.css +0 -22
- /package/front_end/entrypoints/{rehydrated_devtools_app/rehydrated_devtools_app.ts → trace_app/trace_app.ts} +0 -0
|
@@ -1,107 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2024 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { getInteractionCount } from './polyfills/interactionCountPolyfill.js';
|
|
17
|
-
// A list of longest interactions on the page (by latency) sorted so the
|
|
18
|
-
// longest one is first. The list is at most MAX_INTERACTIONS_TO_CONSIDER long.
|
|
19
|
-
export const longestInteractionList = [];
|
|
20
|
-
// A mapping of longest interactions by their interaction ID.
|
|
21
|
-
// This is used for faster lookup.
|
|
22
|
-
export const longestInteractionMap = new Map();
|
|
23
|
-
// The default `durationThreshold` used across this library for observing
|
|
24
|
-
// `event` entries via PerformanceObserver.
|
|
25
|
-
export const DEFAULT_DURATION_THRESHOLD = 40;
|
|
26
|
-
// Used to store the interaction count after a bfcache restore, since p98
|
|
27
|
-
// interaction latencies should only consider the current navigation.
|
|
28
|
-
let prevInteractionCount = 0;
|
|
29
|
-
/**
|
|
30
|
-
* Returns the interaction count since the last bfcache restore (or for the
|
|
31
|
-
* full page lifecycle if there were no bfcache restores).
|
|
32
|
-
*/
|
|
33
|
-
const getInteractionCountForNavigation = () => {
|
|
34
|
-
return getInteractionCount() - prevInteractionCount;
|
|
35
|
-
};
|
|
36
|
-
export const resetInteractions = () => {
|
|
37
|
-
prevInteractionCount = getInteractionCount();
|
|
38
|
-
longestInteractionList.length = 0;
|
|
39
|
-
longestInteractionMap.clear();
|
|
40
|
-
};
|
|
41
|
-
/**
|
|
42
|
-
* Returns the estimated p98 longest interaction based on the stored
|
|
43
|
-
* interaction candidates and the interaction count for the current page.
|
|
44
|
-
*/
|
|
45
|
-
export const estimateP98LongestInteraction = () => {
|
|
46
|
-
const candidateInteractionIndex = Math.min(longestInteractionList.length - 1, Math.floor(getInteractionCountForNavigation() / 50));
|
|
47
|
-
return longestInteractionList[candidateInteractionIndex];
|
|
48
|
-
};
|
|
49
|
-
// To prevent unnecessary memory usage on pages with lots of interactions,
|
|
50
|
-
// store at most 10 of the longest interactions to consider as INP candidates.
|
|
51
|
-
const MAX_INTERACTIONS_TO_CONSIDER = 10;
|
|
52
|
-
/**
|
|
53
|
-
* A list of callback functions to run before each entry is processed.
|
|
54
|
-
* Exposing this list allows the attribution build to hook into the
|
|
55
|
-
* entry processing pipeline.
|
|
56
|
-
*/
|
|
57
|
-
export const entryPreProcessingCallbacks = [];
|
|
58
|
-
/**
|
|
59
|
-
* Takes a performance entry and adds it to the list of worst interactions
|
|
60
|
-
* if its duration is long enough to make it among the worst. If the
|
|
61
|
-
* entry is part of an existing interaction, it is merged and the latency
|
|
62
|
-
* and entries list is updated as needed.
|
|
63
|
-
*/
|
|
64
|
-
export const processInteractionEntry = (entry) => {
|
|
65
|
-
entryPreProcessingCallbacks.forEach((cb) => cb(entry));
|
|
66
|
-
// Skip further processing for entries that cannot be INP candidates.
|
|
67
|
-
if (!(entry.interactionId || entry.entryType === 'first-input'))
|
|
68
|
-
return;
|
|
69
|
-
// The least-long of the 10 longest interactions.
|
|
70
|
-
const minLongestInteraction = longestInteractionList[longestInteractionList.length - 1];
|
|
71
|
-
const existingInteraction = longestInteractionMap.get(entry.interactionId);
|
|
72
|
-
// Only process the entry if it's possibly one of the ten longest,
|
|
73
|
-
// or if it's part of an existing interaction.
|
|
74
|
-
if (existingInteraction ||
|
|
75
|
-
longestInteractionList.length < MAX_INTERACTIONS_TO_CONSIDER ||
|
|
76
|
-
entry.duration > minLongestInteraction.latency) {
|
|
77
|
-
// If the interaction already exists, update it. Otherwise create one.
|
|
78
|
-
if (existingInteraction) {
|
|
79
|
-
// If the new entry has a longer duration, replace the old entries,
|
|
80
|
-
// otherwise add to the array.
|
|
81
|
-
if (entry.duration > existingInteraction.latency) {
|
|
82
|
-
existingInteraction.entries = [entry];
|
|
83
|
-
existingInteraction.latency = entry.duration;
|
|
84
|
-
}
|
|
85
|
-
else if (entry.duration === existingInteraction.latency &&
|
|
86
|
-
entry.startTime === existingInteraction.entries[0].startTime) {
|
|
87
|
-
existingInteraction.entries.push(entry);
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
else {
|
|
91
|
-
const interaction = {
|
|
92
|
-
id: entry.interactionId,
|
|
93
|
-
latency: entry.duration,
|
|
94
|
-
entries: [entry],
|
|
95
|
-
};
|
|
96
|
-
longestInteractionMap.set(interaction.id, interaction);
|
|
97
|
-
longestInteractionList.push(interaction);
|
|
98
|
-
}
|
|
99
|
-
// Sort the entries by latency (descending) and keep only the top ten.
|
|
100
|
-
longestInteractionList.sort((a, b) => b.latency - a.latency);
|
|
101
|
-
if (longestInteractionList.length > MAX_INTERACTIONS_TO_CONSIDER) {
|
|
102
|
-
longestInteractionList
|
|
103
|
-
.splice(MAX_INTERACTIONS_TO_CONSIDER)
|
|
104
|
-
.forEach((i) => longestInteractionMap.delete(i.id));
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const onHidden: (cb: () => void) => void;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2020 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
export const onHidden = (cb) => {
|
|
17
|
-
document.addEventListener('visibilitychange', () => {
|
|
18
|
-
if (document.visibilityState === 'hidden') {
|
|
19
|
-
cb();
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
};
|
package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/firstInputPolyfill.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { FirstInputPolyfillCallback } from '../../types.js';
|
|
2
|
-
/**
|
|
3
|
-
* Accepts a callback to be invoked once the first input delay and event
|
|
4
|
-
* are known.
|
|
5
|
-
*/
|
|
6
|
-
export declare const firstInputPolyfill: (onFirstInput: FirstInputPolyfillCallback) => void;
|
|
7
|
-
export declare const resetFirstInputPolyfill: () => void;
|
package/front_end/third_party/web-vitals/package/dist/modules/lib/polyfills/firstInputPolyfill.js
DELETED
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2020 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
let firstInputEvent;
|
|
17
|
-
let firstInputDelay;
|
|
18
|
-
let firstInputTimeStamp;
|
|
19
|
-
let callbacks;
|
|
20
|
-
const listenerOpts = { passive: true, capture: true };
|
|
21
|
-
const startTimeStamp = new Date();
|
|
22
|
-
/**
|
|
23
|
-
* Accepts a callback to be invoked once the first input delay and event
|
|
24
|
-
* are known.
|
|
25
|
-
*/
|
|
26
|
-
export const firstInputPolyfill = (onFirstInput) => {
|
|
27
|
-
callbacks.push(onFirstInput);
|
|
28
|
-
reportFirstInputDelayIfRecordedAndValid();
|
|
29
|
-
};
|
|
30
|
-
export const resetFirstInputPolyfill = () => {
|
|
31
|
-
callbacks = [];
|
|
32
|
-
firstInputDelay = -1;
|
|
33
|
-
firstInputEvent = null;
|
|
34
|
-
eachEventType(addEventListener);
|
|
35
|
-
};
|
|
36
|
-
/**
|
|
37
|
-
* Records the first input delay and event, so subsequent events can be
|
|
38
|
-
* ignored. All added event listeners are then removed.
|
|
39
|
-
*/
|
|
40
|
-
const recordFirstInputDelay = (delay, event) => {
|
|
41
|
-
if (!firstInputEvent) {
|
|
42
|
-
firstInputEvent = event;
|
|
43
|
-
firstInputDelay = delay;
|
|
44
|
-
firstInputTimeStamp = new Date();
|
|
45
|
-
eachEventType(removeEventListener);
|
|
46
|
-
reportFirstInputDelayIfRecordedAndValid();
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
/**
|
|
50
|
-
* Reports the first input delay and event (if they're recorded and valid)
|
|
51
|
-
* by running the array of callback functions.
|
|
52
|
-
*/
|
|
53
|
-
const reportFirstInputDelayIfRecordedAndValid = () => {
|
|
54
|
-
// In some cases the recorded delay is clearly wrong, e.g. it's negative
|
|
55
|
-
// or it's larger than the delta between now and initialization.
|
|
56
|
-
// - https://github.com/GoogleChromeLabs/first-input-delay/issues/4
|
|
57
|
-
// - https://github.com/GoogleChromeLabs/first-input-delay/issues/6
|
|
58
|
-
// - https://github.com/GoogleChromeLabs/first-input-delay/issues/7
|
|
59
|
-
if (firstInputDelay >= 0 &&
|
|
60
|
-
// @ts-ignore (subtracting two dates always returns a number)
|
|
61
|
-
firstInputDelay < firstInputTimeStamp - startTimeStamp) {
|
|
62
|
-
const entry = {
|
|
63
|
-
entryType: 'first-input',
|
|
64
|
-
name: firstInputEvent.type,
|
|
65
|
-
target: firstInputEvent.target,
|
|
66
|
-
cancelable: firstInputEvent.cancelable,
|
|
67
|
-
startTime: firstInputEvent.timeStamp,
|
|
68
|
-
processingStart: firstInputEvent.timeStamp + firstInputDelay,
|
|
69
|
-
};
|
|
70
|
-
callbacks.forEach(function (callback) {
|
|
71
|
-
callback(entry);
|
|
72
|
-
});
|
|
73
|
-
callbacks = [];
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
/**
|
|
77
|
-
* Handles pointer down events, which are a special case.
|
|
78
|
-
* Pointer events can trigger main or compositor thread behavior.
|
|
79
|
-
* We differentiate these cases based on whether or not we see a
|
|
80
|
-
* 'pointercancel' event, which are fired when we scroll. If we're scrolling
|
|
81
|
-
* we don't need to report input delay since FID excludes scrolling and
|
|
82
|
-
* pinch/zooming.
|
|
83
|
-
*/
|
|
84
|
-
const onPointerDown = (delay, event) => {
|
|
85
|
-
/**
|
|
86
|
-
* Responds to 'pointerup' events and records a delay. If a pointer up event
|
|
87
|
-
* is the next event after a pointerdown event, then it's not a scroll or
|
|
88
|
-
* a pinch/zoom.
|
|
89
|
-
*/
|
|
90
|
-
const onPointerUp = () => {
|
|
91
|
-
recordFirstInputDelay(delay, event);
|
|
92
|
-
removePointerEventListeners();
|
|
93
|
-
};
|
|
94
|
-
/**
|
|
95
|
-
* Responds to 'pointercancel' events and removes pointer listeners.
|
|
96
|
-
* If a 'pointercancel' is the next event to fire after a pointerdown event,
|
|
97
|
-
* it means this is a scroll or pinch/zoom interaction.
|
|
98
|
-
*/
|
|
99
|
-
const onPointerCancel = () => {
|
|
100
|
-
removePointerEventListeners();
|
|
101
|
-
};
|
|
102
|
-
/**
|
|
103
|
-
* Removes added pointer event listeners.
|
|
104
|
-
*/
|
|
105
|
-
const removePointerEventListeners = () => {
|
|
106
|
-
removeEventListener('pointerup', onPointerUp, listenerOpts);
|
|
107
|
-
removeEventListener('pointercancel', onPointerCancel, listenerOpts);
|
|
108
|
-
};
|
|
109
|
-
addEventListener('pointerup', onPointerUp, listenerOpts);
|
|
110
|
-
addEventListener('pointercancel', onPointerCancel, listenerOpts);
|
|
111
|
-
};
|
|
112
|
-
/**
|
|
113
|
-
* Handles all input events and records the time between when the event
|
|
114
|
-
* was received by the operating system and when it's JavaScript listeners
|
|
115
|
-
* were able to run.
|
|
116
|
-
*/
|
|
117
|
-
const onInput = (event) => {
|
|
118
|
-
// Only count cancelable events, which should trigger behavior
|
|
119
|
-
// important to the user.
|
|
120
|
-
if (event.cancelable) {
|
|
121
|
-
// In some browsers `event.timeStamp` returns a `DOMTimeStamp` value
|
|
122
|
-
// (epoch time) instead of the newer `DOMHighResTimeStamp`
|
|
123
|
-
// (document-origin time). To check for that we assume any timestamp
|
|
124
|
-
// greater than 1 trillion is a `DOMTimeStamp`, and compare it using
|
|
125
|
-
// the `Date` object rather than `performance.now()`.
|
|
126
|
-
// - https://github.com/GoogleChromeLabs/first-input-delay/issues/4
|
|
127
|
-
const isEpochTime = event.timeStamp > 1e12;
|
|
128
|
-
const now = isEpochTime ? new Date() : performance.now();
|
|
129
|
-
// Input delay is the delta between when the system received the event
|
|
130
|
-
// (e.g. event.timeStamp) and when it could run the callback (e.g. `now`).
|
|
131
|
-
const delay = now - event.timeStamp;
|
|
132
|
-
if (event.type == 'pointerdown') {
|
|
133
|
-
onPointerDown(delay, event);
|
|
134
|
-
}
|
|
135
|
-
else {
|
|
136
|
-
recordFirstInputDelay(delay, event);
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
};
|
|
140
|
-
/**
|
|
141
|
-
* Invokes the passed callback const for = each event type with t =>he
|
|
142
|
-
* `onInput` const and = `listenerOpts =>`.
|
|
143
|
-
*/
|
|
144
|
-
const eachEventType = (callback) => {
|
|
145
|
-
const eventTypes = ['mousedown', 'keydown', 'touchstart', 'pointerdown'];
|
|
146
|
-
eventTypes.forEach((type) => callback(type, onInput, listenerOpts));
|
|
147
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const getFirstHiddenTime: () => number;
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2020 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
let firstHiddenTime = document.visibilityState === 'hidden' ? 0 : Infinity;
|
|
17
|
-
const onVisibilityChange = (event) => {
|
|
18
|
-
if (document.visibilityState === 'hidden') {
|
|
19
|
-
firstHiddenTime = event.timeStamp;
|
|
20
|
-
removeEventListener('visibilitychange', onVisibilityChange, true);
|
|
21
|
-
}
|
|
22
|
-
};
|
|
23
|
-
// Note: do not add event listeners unconditionally (outside of polyfills).
|
|
24
|
-
addEventListener('visibilitychange', onVisibilityChange, true);
|
|
25
|
-
export const getFirstHiddenTime = () => firstHiddenTime;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { FIDMetric, MetricRatingThresholds, ReportOpts } from './types.js';
|
|
2
|
-
/** Thresholds for FID. See https://web.dev/articles/fid#what_is_a_good_fid_score */
|
|
3
|
-
export declare const FIDThresholds: MetricRatingThresholds;
|
|
4
|
-
/**
|
|
5
|
-
* Calculates the [FID](https://web.dev/articles/fid) value for the current page and
|
|
6
|
-
* calls the `callback` function once the value is ready, along with the
|
|
7
|
-
* relevant `first-input` performance entry used to determine the value. The
|
|
8
|
-
* reported value is a `DOMHighResTimeStamp`.
|
|
9
|
-
*
|
|
10
|
-
* _**Important:** since FID is only reported after the user interacts with the
|
|
11
|
-
* page, it's possible that it will not be reported for some page loads._
|
|
12
|
-
*/
|
|
13
|
-
export declare const onFID: (onReport: (metric: FIDMetric) => void, opts?: ReportOpts) => void;
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2020 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { onBFCacheRestore } from './lib/bfcache.js';
|
|
17
|
-
import { bindReporter } from './lib/bindReporter.js';
|
|
18
|
-
import { getVisibilityWatcher } from './lib/getVisibilityWatcher.js';
|
|
19
|
-
import { initMetric } from './lib/initMetric.js';
|
|
20
|
-
import { observe } from './lib/observe.js';
|
|
21
|
-
import { onHidden } from './lib/onHidden.js';
|
|
22
|
-
import { firstInputPolyfill, resetFirstInputPolyfill, } from './lib/polyfills/firstInputPolyfill.js';
|
|
23
|
-
import { runOnce } from './lib/runOnce.js';
|
|
24
|
-
import { whenActivated } from './lib/whenActivated.js';
|
|
25
|
-
/** Thresholds for FID. See https://web.dev/articles/fid#what_is_a_good_fid_score */
|
|
26
|
-
export const FIDThresholds = [100, 300];
|
|
27
|
-
/**
|
|
28
|
-
* Calculates the [FID](https://web.dev/articles/fid) value for the current page and
|
|
29
|
-
* calls the `callback` function once the value is ready, along with the
|
|
30
|
-
* relevant `first-input` performance entry used to determine the value. The
|
|
31
|
-
* reported value is a `DOMHighResTimeStamp`.
|
|
32
|
-
*
|
|
33
|
-
* _**Important:** since FID is only reported after the user interacts with the
|
|
34
|
-
* page, it's possible that it will not be reported for some page loads._
|
|
35
|
-
*/
|
|
36
|
-
export const onFID = (onReport, opts) => {
|
|
37
|
-
// Set defaults
|
|
38
|
-
opts = opts || {};
|
|
39
|
-
whenActivated(() => {
|
|
40
|
-
const visibilityWatcher = getVisibilityWatcher();
|
|
41
|
-
let metric = initMetric('FID');
|
|
42
|
-
let report;
|
|
43
|
-
const handleEntry = (entry) => {
|
|
44
|
-
// Only report if the page wasn't hidden prior to the first input.
|
|
45
|
-
if (entry.startTime < visibilityWatcher.firstHiddenTime) {
|
|
46
|
-
metric.value = entry.processingStart - entry.startTime;
|
|
47
|
-
metric.entries.push(entry);
|
|
48
|
-
report(true);
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
const handleEntries = (entries) => {
|
|
52
|
-
entries.forEach(handleEntry);
|
|
53
|
-
};
|
|
54
|
-
const po = observe('first-input', handleEntries);
|
|
55
|
-
report = bindReporter(onReport, metric, FIDThresholds, opts.reportAllChanges);
|
|
56
|
-
if (po) {
|
|
57
|
-
onHidden(runOnce(() => {
|
|
58
|
-
handleEntries(po.takeRecords());
|
|
59
|
-
po.disconnect();
|
|
60
|
-
}));
|
|
61
|
-
onBFCacheRestore(() => {
|
|
62
|
-
metric = initMetric('FID');
|
|
63
|
-
report = bindReporter(onReport, metric, FIDThresholds, opts.reportAllChanges);
|
|
64
|
-
// Browsers don't re-emit FID on bfcache restore so fake it until you make it
|
|
65
|
-
resetFirstInputPolyfill();
|
|
66
|
-
firstInputPolyfill(handleEntry);
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
};
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import type { LoadState, Metric } from './base.js';
|
|
2
|
-
/**
|
|
3
|
-
* An FID-specific version of the Metric object.
|
|
4
|
-
*/
|
|
5
|
-
export interface FIDMetric extends Metric {
|
|
6
|
-
name: 'FID';
|
|
7
|
-
entries: PerformanceEventTiming[];
|
|
8
|
-
}
|
|
9
|
-
/**
|
|
10
|
-
* An object containing potentially-helpful debugging information that
|
|
11
|
-
* can be sent along with the FID value for the current page visit in order
|
|
12
|
-
* to help identify issues happening to real-users in the field.
|
|
13
|
-
*/
|
|
14
|
-
export interface FIDAttribution {
|
|
15
|
-
/**
|
|
16
|
-
* A selector identifying the element that the user interacted with. This
|
|
17
|
-
* element will be the `target` of the `event` dispatched.
|
|
18
|
-
*/
|
|
19
|
-
eventTarget: string;
|
|
20
|
-
/**
|
|
21
|
-
* The time when the user interacted. This time will match the `timeStamp`
|
|
22
|
-
* value of the `event` dispatched.
|
|
23
|
-
*/
|
|
24
|
-
eventTime: number;
|
|
25
|
-
/**
|
|
26
|
-
* The `type` of the `event` dispatched from the user interaction.
|
|
27
|
-
*/
|
|
28
|
-
eventType: string;
|
|
29
|
-
/**
|
|
30
|
-
* The `PerformanceEventTiming` entry corresponding to FID.
|
|
31
|
-
*/
|
|
32
|
-
eventEntry: PerformanceEventTiming;
|
|
33
|
-
/**
|
|
34
|
-
* The loading state of the document at the time when the first interaction
|
|
35
|
-
* occurred (see `LoadState` for details). If the first interaction occurred
|
|
36
|
-
* while the document was loading and executing script (e.g. usually in the
|
|
37
|
-
* `dom-interactive` phase) it can result in long input delays.
|
|
38
|
-
*/
|
|
39
|
-
loadState: LoadState;
|
|
40
|
-
}
|
|
41
|
-
/**
|
|
42
|
-
* An FID-specific version of the Metric object with attribution.
|
|
43
|
-
*/
|
|
44
|
-
export interface FIDMetricWithAttribution extends FIDMetric {
|
|
45
|
-
attribution: FIDAttribution;
|
|
46
|
-
}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2022 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
export {};
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2022 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
import {getLoadState} from '../lib/getLoadState.js';
|
|
18
|
-
import {getSelector} from '../lib/getSelector.js';
|
|
19
|
-
import {onFID as unattributedOnFID} from '../onFID.js';
|
|
20
|
-
import {
|
|
21
|
-
FIDAttribution,
|
|
22
|
-
FIDMetric,
|
|
23
|
-
FIDMetricWithAttribution,
|
|
24
|
-
ReportOpts,
|
|
25
|
-
} from '../types.js';
|
|
26
|
-
|
|
27
|
-
const attributeFID = (metric: FIDMetric): FIDMetricWithAttribution => {
|
|
28
|
-
const fidEntry = metric.entries[0];
|
|
29
|
-
const attribution: FIDAttribution = {
|
|
30
|
-
eventTarget: getSelector(fidEntry.target),
|
|
31
|
-
eventType: fidEntry.name,
|
|
32
|
-
eventTime: fidEntry.startTime,
|
|
33
|
-
eventEntry: fidEntry,
|
|
34
|
-
loadState: getLoadState(fidEntry.startTime),
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
// Use Object.assign to set property to keep tsc happy.
|
|
38
|
-
const metricWithAttribution: FIDMetricWithAttribution = Object.assign(
|
|
39
|
-
metric,
|
|
40
|
-
{attribution},
|
|
41
|
-
);
|
|
42
|
-
return metricWithAttribution;
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* Calculates the [FID](https://web.dev/articles/fid) value for the current page and
|
|
47
|
-
* calls the `callback` function once the value is ready, along with the
|
|
48
|
-
* relevant `first-input` performance entry used to determine the value. The
|
|
49
|
-
* reported value is a `DOMHighResTimeStamp`.
|
|
50
|
-
*
|
|
51
|
-
* _**Important:** since FID is only reported after the user interacts with the
|
|
52
|
-
* page, it's possible that it will not be reported for some page loads._
|
|
53
|
-
*/
|
|
54
|
-
export const onFID = (
|
|
55
|
-
onReport: (metric: FIDMetricWithAttribution) => void,
|
|
56
|
-
opts?: ReportOpts,
|
|
57
|
-
) => {
|
|
58
|
-
unattributedOnFID((metric: FIDMetric) => {
|
|
59
|
-
const metricWithAttribution = attributeFID(metric);
|
|
60
|
-
onReport(metricWithAttribution);
|
|
61
|
-
}, opts);
|
|
62
|
-
};
|
|
@@ -1,139 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright 2024 Google LLC
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* https://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
import {getInteractionCount} from './polyfills/interactionCountPolyfill.js';
|
|
18
|
-
|
|
19
|
-
interface Interaction {
|
|
20
|
-
id: number;
|
|
21
|
-
latency: number;
|
|
22
|
-
entries: PerformanceEventTiming[];
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
interface EntryPreProcessingHook {
|
|
26
|
-
(entry: PerformanceEventTiming): void;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// A list of longest interactions on the page (by latency) sorted so the
|
|
30
|
-
// longest one is first. The list is at most MAX_INTERACTIONS_TO_CONSIDER long.
|
|
31
|
-
export const longestInteractionList: Interaction[] = [];
|
|
32
|
-
|
|
33
|
-
// A mapping of longest interactions by their interaction ID.
|
|
34
|
-
// This is used for faster lookup.
|
|
35
|
-
export const longestInteractionMap: Map<number, Interaction> = new Map();
|
|
36
|
-
|
|
37
|
-
// The default `durationThreshold` used across this library for observing
|
|
38
|
-
// `event` entries via PerformanceObserver.
|
|
39
|
-
export const DEFAULT_DURATION_THRESHOLD = 40;
|
|
40
|
-
|
|
41
|
-
// Used to store the interaction count after a bfcache restore, since p98
|
|
42
|
-
// interaction latencies should only consider the current navigation.
|
|
43
|
-
let prevInteractionCount = 0;
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* Returns the interaction count since the last bfcache restore (or for the
|
|
47
|
-
* full page lifecycle if there were no bfcache restores).
|
|
48
|
-
*/
|
|
49
|
-
const getInteractionCountForNavigation = () => {
|
|
50
|
-
return getInteractionCount() - prevInteractionCount;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
export const resetInteractions = () => {
|
|
54
|
-
prevInteractionCount = getInteractionCount();
|
|
55
|
-
longestInteractionList.length = 0;
|
|
56
|
-
longestInteractionMap.clear();
|
|
57
|
-
};
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Returns the estimated p98 longest interaction based on the stored
|
|
61
|
-
* interaction candidates and the interaction count for the current page.
|
|
62
|
-
*/
|
|
63
|
-
export const estimateP98LongestInteraction = () => {
|
|
64
|
-
const candidateInteractionIndex = Math.min(
|
|
65
|
-
longestInteractionList.length - 1,
|
|
66
|
-
Math.floor(getInteractionCountForNavigation() / 50),
|
|
67
|
-
);
|
|
68
|
-
|
|
69
|
-
return longestInteractionList[candidateInteractionIndex];
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
// To prevent unnecessary memory usage on pages with lots of interactions,
|
|
73
|
-
// store at most 10 of the longest interactions to consider as INP candidates.
|
|
74
|
-
const MAX_INTERACTIONS_TO_CONSIDER = 10;
|
|
75
|
-
|
|
76
|
-
/**
|
|
77
|
-
* A list of callback functions to run before each entry is processed.
|
|
78
|
-
* Exposing this list allows the attribution build to hook into the
|
|
79
|
-
* entry processing pipeline.
|
|
80
|
-
*/
|
|
81
|
-
export const entryPreProcessingCallbacks: EntryPreProcessingHook[] = [];
|
|
82
|
-
|
|
83
|
-
/**
|
|
84
|
-
* Takes a performance entry and adds it to the list of worst interactions
|
|
85
|
-
* if its duration is long enough to make it among the worst. If the
|
|
86
|
-
* entry is part of an existing interaction, it is merged and the latency
|
|
87
|
-
* and entries list is updated as needed.
|
|
88
|
-
*/
|
|
89
|
-
export const processInteractionEntry = (entry: PerformanceEventTiming) => {
|
|
90
|
-
entryPreProcessingCallbacks.forEach((cb) => cb(entry));
|
|
91
|
-
|
|
92
|
-
// Skip further processing for entries that cannot be INP candidates.
|
|
93
|
-
if (!(entry.interactionId || entry.entryType === 'first-input')) return;
|
|
94
|
-
|
|
95
|
-
// The least-long of the 10 longest interactions.
|
|
96
|
-
const minLongestInteraction =
|
|
97
|
-
longestInteractionList[longestInteractionList.length - 1];
|
|
98
|
-
|
|
99
|
-
const existingInteraction = longestInteractionMap.get(entry.interactionId!);
|
|
100
|
-
|
|
101
|
-
// Only process the entry if it's possibly one of the ten longest,
|
|
102
|
-
// or if it's part of an existing interaction.
|
|
103
|
-
if (
|
|
104
|
-
existingInteraction ||
|
|
105
|
-
longestInteractionList.length < MAX_INTERACTIONS_TO_CONSIDER ||
|
|
106
|
-
entry.duration > minLongestInteraction.latency
|
|
107
|
-
) {
|
|
108
|
-
// If the interaction already exists, update it. Otherwise create one.
|
|
109
|
-
if (existingInteraction) {
|
|
110
|
-
// If the new entry has a longer duration, replace the old entries,
|
|
111
|
-
// otherwise add to the array.
|
|
112
|
-
if (entry.duration > existingInteraction.latency) {
|
|
113
|
-
existingInteraction.entries = [entry];
|
|
114
|
-
existingInteraction.latency = entry.duration;
|
|
115
|
-
} else if (
|
|
116
|
-
entry.duration === existingInteraction.latency &&
|
|
117
|
-
entry.startTime === existingInteraction.entries[0].startTime
|
|
118
|
-
) {
|
|
119
|
-
existingInteraction.entries.push(entry);
|
|
120
|
-
}
|
|
121
|
-
} else {
|
|
122
|
-
const interaction = {
|
|
123
|
-
id: entry.interactionId!,
|
|
124
|
-
latency: entry.duration,
|
|
125
|
-
entries: [entry],
|
|
126
|
-
};
|
|
127
|
-
longestInteractionMap.set(interaction.id, interaction);
|
|
128
|
-
longestInteractionList.push(interaction);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
// Sort the entries by latency (descending) and keep only the top ten.
|
|
132
|
-
longestInteractionList.sort((a, b) => b.latency - a.latency);
|
|
133
|
-
if (longestInteractionList.length > MAX_INTERACTIONS_TO_CONSIDER) {
|
|
134
|
-
longestInteractionList
|
|
135
|
-
.splice(MAX_INTERACTIONS_TO_CONSIDER)
|
|
136
|
-
.forEach((i) => longestInteractionMap.delete(i.id));
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
};
|