chrome-devtools-frontend 1.0.1512349 → 1.0.1513662
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/cookbook/release_management.md +15 -13
- package/docs/get_the_code.md +114 -35
- package/front_end/core/common/Color.ts +40 -44
- package/front_end/core/common/Console.ts +4 -4
- package/front_end/core/common/ParsedURL.ts +14 -14
- package/front_end/core/common/ResourceType.ts +20 -20
- package/front_end/core/common/SegmentedRange.ts +13 -14
- package/front_end/core/common/Settings.ts +4 -4
- package/front_end/core/common/StringOutputStream.ts +4 -4
- package/front_end/core/host/GdpClient.ts +38 -0
- package/front_end/core/host/InspectorFrontendHost.ts +4 -1
- package/front_end/core/host/InspectorFrontendHostAPI.ts +2 -0
- package/front_end/core/host/ResourceLoader.ts +2 -2
- package/front_end/core/host/UserMetrics.ts +0 -2
- package/front_end/core/protocol_client/InspectorBackend.ts +9 -9
- package/front_end/core/root/Runtime.ts +5 -2
- package/front_end/core/sdk/AccessibilityModel.ts +48 -48
- package/front_end/core/sdk/AnimationModel.ts +78 -79
- package/front_end/core/sdk/CPUProfilerModel.ts +5 -5
- package/front_end/core/sdk/CPUThrottlingManager.ts +17 -17
- package/front_end/core/sdk/CSSMatchedStyles.ts +44 -44
- package/front_end/core/sdk/CSSMedia.ts +22 -22
- package/front_end/core/sdk/CSSModel.ts +4 -4
- package/front_end/core/sdk/CSSProperty.ts +9 -9
- package/front_end/core/sdk/CSSPropertyParser.ts +1 -2
- package/front_end/core/sdk/CSSRule.ts +3 -3
- package/front_end/core/sdk/CSSStyleDeclaration.ts +27 -28
- package/front_end/core/sdk/CSSStyleSheetHeader.ts +13 -13
- package/front_end/core/sdk/CategorizedBreakpoint.ts +4 -4
- package/front_end/core/sdk/ChildTargetManager.ts +6 -6
- package/front_end/core/sdk/CompilerSourceMappingContentProvider.ts +4 -4
- package/front_end/core/sdk/ConsoleModel.ts +24 -24
- package/front_end/core/sdk/Cookie.ts +16 -16
- package/front_end/core/sdk/CookieParser.ts +6 -6
- package/front_end/core/sdk/DOMDebuggerModel.ts +88 -89
- package/front_end/core/sdk/DOMModel.ts +113 -113
- package/front_end/core/sdk/DebuggerModel.ts +102 -103
- package/front_end/core/sdk/EmulationModel.ts +6 -6
- package/front_end/core/sdk/EventBreakpointsModel.ts +5 -5
- package/front_end/core/sdk/HeapProfilerModel.ts +5 -5
- package/front_end/core/sdk/IsolateManager.ts +26 -26
- package/front_end/core/sdk/LayerTreeBase.ts +29 -30
- package/front_end/core/sdk/OverlayModel.ts +6 -6
- package/front_end/core/sdk/Resource.ts +43 -43
- package/front_end/core/sdk/ResourceTreeModel.ts +58 -61
- package/front_end/core/sdk/RuntimeModel.ts +12 -13
- package/front_end/core/sdk/SDKModel.ts +3 -3
- package/front_end/core/sdk/Script.ts +17 -17
- package/front_end/core/sdk/SecurityOriginManager.ts +14 -14
- package/front_end/core/sdk/ServerTiming.ts +2 -2
- package/front_end/core/sdk/ServiceWorkerCacheModel.ts +15 -15
- package/front_end/core/sdk/ServiceWorkerManager.ts +19 -24
- package/front_end/core/sdk/SourceMap.ts +10 -10
- package/front_end/core/sdk/StorageKeyManager.ts +12 -12
- package/front_end/core/sdk/Target.ts +33 -34
- package/front_end/core/sdk/TargetManager.ts +20 -20
- package/front_end/entrypoints/formatter_worker/AcornTokenizer.ts +8 -8
- package/front_end/entrypoints/formatter_worker/HTMLFormatter.ts +7 -7
- package/front_end/entrypoints/heap_snapshot_worker/AllocationProfile.ts +7 -7
- package/front_end/entrypoints/heap_snapshot_worker/HeapSnapshot.ts +24 -24
- package/front_end/entrypoints/main/GlobalAiButton.ts +3 -3
- package/front_end/entrypoints/main/MainImpl.ts +16 -14
- package/front_end/entrypoints/main/main-meta.ts +1 -2
- package/front_end/generated/InspectorBackendCommands.js +3 -2
- package/front_end/generated/SupportedCSSProperties.js +20 -0
- package/front_end/generated/protocol-mapping.d.ts +4 -0
- package/front_end/generated/protocol-proxy-api.d.ts +5 -0
- package/front_end/generated/protocol.ts +20 -0
- package/front_end/models/ai_assistance/agents/PerformanceAgent.ts +15 -16
- package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.snapshot.txt +127 -0
- package/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.ts +149 -26
- package/front_end/models/ai_assistance/data_formatters/PerformanceTraceFormatter.snapshot.txt +6 -0
- package/front_end/models/ai_assistance/data_formatters/PerformanceTraceFormatter.ts +9 -10
- package/front_end/models/badges/AiExplorerBadge.ts +21 -0
- package/front_end/models/badges/Badge.ts +3 -5
- package/front_end/models/badges/CodeWhispererBadge.ts +21 -0
- package/front_end/models/badges/DOMDetectiveBadge.ts +4 -3
- package/front_end/models/badges/SpeedsterBadge.ts +6 -4
- package/front_end/models/badges/StarterBadge.ts +4 -3
- package/front_end/models/badges/UserBadges.ts +29 -3
- package/front_end/models/bindings/CSSWorkspaceBinding.ts +6 -6
- package/front_end/models/bindings/DebuggerLanguagePlugins.ts +18 -18
- package/front_end/models/bindings/FileUtils.ts +15 -15
- package/front_end/models/bindings/ResourceScriptMapping.ts +14 -14
- package/front_end/models/elements/ElementUpdateRecord.ts +11 -11
- package/front_end/models/emulation/DeviceModeModel.ts +123 -131
- package/front_end/models/emulation/EmulatedDevices.ts +22 -22
- package/front_end/models/extensions/ExtensionPanel.ts +24 -24
- package/front_end/models/extensions/ExtensionServer.ts +4 -4
- package/front_end/models/javascript_metadata/NativeFunctions.js +14 -2
- package/front_end/models/persistence/IsolatedFileSystem.ts +18 -19
- package/front_end/models/persistence/IsolatedFileSystemManager.ts +13 -13
- package/front_end/models/trace/EventsSerializer.ts +5 -5
- package/front_end/models/trace/LanternComputationData.ts +10 -10
- package/front_end/models/trace/ModelImpl.ts +32 -41
- package/front_end/models/trace/Processor.ts +28 -30
- package/front_end/models/trace/extras/FilmStrip.ts +6 -6
- package/front_end/models/trace/extras/StackTraceForEvent.ts +22 -25
- package/front_end/models/trace/extras/ThirdParties.ts +16 -17
- package/front_end/models/trace/extras/TraceFilter.ts +1 -1
- package/front_end/models/trace/handlers/Threads.ts +10 -10
- package/front_end/models/trace/handlers/helpers.ts +9 -9
- package/front_end/models/trace/handlers/types.ts +3 -3
- package/front_end/models/trace/insights/CLSCulprits.ts +12 -14
- package/front_end/models/trace/insights/Cache.ts +8 -4
- package/front_end/models/trace/insights/DOMSize.ts +8 -5
- package/front_end/models/trace/insights/DocumentLatency.ts +2 -2
- package/front_end/models/trace/insights/DuplicatedJavaScript.ts +3 -3
- package/front_end/models/trace/insights/FontDisplay.ts +3 -4
- package/front_end/models/trace/insights/ForcedReflow.ts +3 -3
- package/front_end/models/trace/insights/INPBreakdown.ts +2 -2
- package/front_end/models/trace/insights/ImageDelivery.ts +11 -11
- package/front_end/models/trace/insights/LCPBreakdown.ts +4 -4
- package/front_end/models/trace/insights/LCPDiscovery.ts +4 -4
- package/front_end/models/trace/insights/LegacyJavaScript.ts +2 -2
- package/front_end/models/trace/insights/ModernHTTP.ts +4 -5
- package/front_end/models/trace/insights/NetworkDependencyTree.ts +12 -12
- package/front_end/models/trace/insights/RenderBlocking.ts +9 -10
- package/front_end/models/trace/insights/SlowCSSSelector.ts +2 -2
- package/front_end/models/trace/insights/ThirdParties.ts +4 -5
- package/front_end/models/trace/insights/Viewport.ts +8 -5
- package/front_end/models/trace/insights/types.ts +1 -0
- package/front_end/models/trace/lantern/testing/MetricTestUtils.ts +10 -10
- package/front_end/panels/accessibility/AXBreadcrumbsPane.ts +52 -52
- package/front_end/panels/accessibility/AccessibilitySidebarView.ts +8 -8
- package/front_end/panels/animation/AnimationTimeline.ts +5 -5
- package/front_end/panels/animation/AnimationUI.ts +22 -23
- package/front_end/panels/application/ApplicationPanelSidebar.ts +12 -12
- package/front_end/panels/application/DOMStorageModel.ts +23 -23
- package/front_end/panels/application/ExtensionStorageModel.ts +31 -31
- package/front_end/panels/application/IndexedDBModel.ts +1 -0
- package/front_end/panels/application/PreloadingTreeElement.ts +8 -8
- package/front_end/panels/application/ServiceWorkersView.ts +0 -53
- package/front_end/panels/application/preloading/components/PreloadingDisabledInfobar.ts +2 -2
- package/front_end/panels/application/preloading/components/UsedPreloadingView.ts +2 -2
- package/front_end/panels/common/BadgeNotification.ts +24 -4
- package/front_end/panels/common/GdpSignUpDialog.ts +5 -0
- package/front_end/panels/common/badgeNotification.css +26 -9
- package/front_end/panels/console/ConsoleContextSelector.ts +9 -9
- package/front_end/panels/console/ConsolePrompt.ts +8 -5
- package/front_end/panels/console/ConsoleView.ts +13 -13
- package/front_end/panels/console/ConsoleViewport.ts +29 -29
- package/front_end/panels/coverage/CoverageModel.ts +22 -22
- package/front_end/panels/elements/ClassesPaneWidget.ts +1 -1
- package/front_end/panels/elements/ComputedStyleModel.ts +17 -18
- package/front_end/panels/elements/DOMPath.ts +2 -2
- package/front_end/panels/elements/ElementsPanel.ts +13 -13
- package/front_end/panels/elements/ElementsTreeElement.ts +18 -18
- package/front_end/panels/elements/ElementsTreeOutline.ts +41 -48
- package/front_end/panels/elements/ShortcutTreeElement.ts +4 -4
- package/front_end/panels/elements/StylePropertiesSection.ts +4 -4
- package/front_end/panels/elements/StylePropertyTreeElement.ts +49 -50
- package/front_end/panels/elements/StylesSidebarPane.ts +19 -19
- package/front_end/panels/emulation/DeviceModeToolbar.ts +7 -7
- package/front_end/panels/emulation/DeviceModeView.ts +6 -6
- package/front_end/panels/emulation/MediaQueryInspector.ts +18 -18
- package/front_end/panels/event_listeners/EventListenersView.ts +13 -14
- package/front_end/panels/layer_viewer/LayerTreeOutline.ts +3 -3
- package/front_end/panels/layer_viewer/LayerViewHost.ts +13 -13
- package/front_end/panels/layer_viewer/PaintProfilerView.ts +9 -10
- package/front_end/panels/layer_viewer/TransformController.ts +34 -36
- package/front_end/panels/layers/LayerTreeModel.ts +41 -40
- package/front_end/panels/lighthouse/LighthouseReportSelector.ts +13 -13
- package/front_end/panels/lighthouse/LighthouseStartView.ts +7 -7
- package/front_end/panels/media/PlayerMessagesView.ts +5 -5
- package/front_end/panels/media/TickingFlameChart.ts +24 -24
- package/front_end/panels/media/TickingFlameChartHelpers.ts +32 -32
- package/front_end/panels/network/NetworkItemView.ts +4 -4
- package/front_end/panels/network/NetworkLogViewColumns.ts +29 -29
- package/front_end/panels/network/NetworkPanel.ts +8 -5
- package/front_end/panels/network/ResourceWebSocketFrameView.ts +10 -10
- package/front_end/panels/profiler/HeapDetachedElementsView.ts +3 -3
- package/front_end/panels/profiler/HeapProfileView.ts +1 -1
- package/front_end/panels/profiler/ProfileFlameChartDataProvider.ts +3 -4
- package/front_end/panels/profiler/ProfileHeader.ts +25 -25
- package/front_end/panels/profiler/ProfileLauncherView.ts +5 -6
- package/front_end/panels/recorder/components/ReplaySection.ts +3 -1
- package/front_end/panels/security/OriginTreeElement.ts +8 -8
- package/front_end/panels/security/SecurityPanel.ts +5 -5
- package/front_end/panels/settings/SettingsScreen.ts +18 -12
- package/front_end/panels/settings/components/SyncSection.ts +20 -6
- package/front_end/panels/sources/AiCodeCompletionPlugin.ts +3 -0
- package/front_end/panels/sources/DebuggerPausedMessage.ts +8 -9
- package/front_end/panels/sources/NavigatorView.ts +43 -46
- package/front_end/panels/sources/SourcesPanel.ts +35 -35
- package/front_end/panels/sources/SourcesView.ts +13 -13
- package/front_end/panels/sources/TabbedEditorContainer.ts +19 -22
- package/front_end/panels/sources/UISourceCodeFrame.ts +4 -4
- package/front_end/panels/sources/WatchExpressionsSidebarPane.ts +34 -36
- package/front_end/panels/timeline/AnimationsTrackAppender.ts +3 -3
- package/front_end/panels/timeline/CompatibilityTracksAppender.ts +8 -8
- package/front_end/panels/timeline/CountersGraph.ts +16 -16
- package/front_end/panels/timeline/EntriesFilter.ts +4 -3
- package/front_end/panels/timeline/EventsTimelineTreeView.ts +3 -3
- package/front_end/panels/timeline/GPUTrackAppender.ts +3 -3
- package/front_end/panels/timeline/Initiators.ts +10 -10
- package/front_end/panels/timeline/InteractionsTrackAppender.ts +5 -5
- package/front_end/panels/timeline/LayoutShiftsTrackAppender.ts +7 -7
- package/front_end/panels/timeline/ModificationsManager.ts +8 -15
- package/front_end/panels/timeline/TargetForEvent.ts +2 -2
- package/front_end/panels/timeline/ThirdPartyTreeView.ts +1 -1
- package/front_end/panels/timeline/ThreadAppender.ts +13 -13
- package/front_end/panels/timeline/TimelineDetailsView.ts +6 -14
- package/front_end/panels/timeline/TimelineEventOverview.ts +27 -26
- package/front_end/panels/timeline/TimelineFilters.ts +5 -5
- package/front_end/panels/timeline/TimelineFlameChartDataProvider.ts +54 -53
- package/front_end/panels/timeline/TimelineFlameChartNetworkDataProvider.ts +34 -34
- package/front_end/panels/timeline/TimelineFlameChartView.ts +18 -31
- package/front_end/panels/timeline/TimelineHistoryManager.ts +17 -18
- package/front_end/panels/timeline/TimelineMiniMap.ts +6 -6
- package/front_end/panels/timeline/TimelinePaintProfilerView.ts +6 -6
- package/front_end/panels/timeline/TimelinePanel.ts +52 -59
- package/front_end/panels/timeline/TimelineSelectorStatsView.ts +7 -5
- package/front_end/panels/timeline/TimelineTreeView.ts +10 -10
- package/front_end/panels/timeline/TimelineUIUtils.ts +43 -43
- package/front_end/panels/timeline/TimingsTrackAppender.ts +12 -12
- package/front_end/panels/timeline/TracingLayerTree.ts +43 -43
- package/front_end/panels/timeline/TrackConfigBanner.ts +6 -6
- package/front_end/panels/timeline/TrackConfiguration.ts +1 -1
- package/front_end/panels/timeline/components/DetailsView.ts +4 -4
- package/front_end/panels/timeline/components/LayoutShiftDetails.ts +12 -21
- package/front_end/panels/timeline/components/LiveMetricsView.ts +2 -1
- package/front_end/panels/timeline/components/NetworkRequestDetails.ts +5 -5
- package/front_end/panels/timeline/components/Sidebar.ts +4 -14
- package/front_end/panels/timeline/components/SidebarInsightsTab.ts +13 -36
- package/front_end/panels/timeline/components/SidebarSingleInsightSet.ts +21 -19
- package/front_end/panels/timeline/components/insights/BaseInsightComponent.ts +1 -1
- package/front_end/panels/timeline/components/insights/Cache.ts +4 -0
- package/front_end/panels/timeline/components/insights/DOMSize.ts +5 -1
- package/front_end/panels/timeline/components/insights/Helpers.ts +19 -0
- package/front_end/panels/timeline/components/insights/NetworkDependencyTree.ts +1 -1
- package/front_end/panels/timeline/components/insights/Viewport.ts +4 -0
- package/front_end/panels/timeline/overlays/OverlaysImpl.ts +1 -1
- package/front_end/panels/timeline/utils/AICallTree.ts +11 -11
- package/front_end/panels/timeline/utils/AIContext.ts +17 -19
- package/front_end/panels/timeline/utils/EntityMapper.ts +6 -5
- package/front_end/panels/timeline/utils/EntryName.ts +2 -2
- package/front_end/panels/timeline/utils/EntryNodes.ts +5 -5
- package/front_end/panels/timeline/utils/EntryStyles.ts +4 -4
- package/front_end/panels/timeline/utils/FreshRecording.ts +3 -3
- package/front_end/panels/timeline/utils/Helpers.ts +0 -18
- package/front_end/panels/timeline/utils/InsightAIContext.ts +6 -6
- package/front_end/panels/timeline/utils/SourceMapsResolver.ts +7 -7
- package/front_end/panels/webauthn/WebauthnPane.ts +1 -0
- package/front_end/third_party/chromium/README.chromium +1 -1
- package/front_end/third_party/codemirror.next/chunk/angular.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/angular.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/codemirror.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/codemirror.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/cpp.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/cpp.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/java.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/java.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/legacy.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/legacy.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/less.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/less.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/markdown.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/markdown.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/php.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/php.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/python.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/python.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/sass.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/sass.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/svelte.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/svelte.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/vue.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/vue.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/wast.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/wast.js.map +1 -1
- package/front_end/third_party/codemirror.next/chunk/xml.js +1 -1
- package/front_end/third_party/codemirror.next/chunk/xml.js.map +1 -1
- package/front_end/third_party/codemirror.next/codemirror.next.js +1 -1
- package/front_end/third_party/codemirror.next/package.json +1 -1
- package/front_end/third_party/codemirror.next/rebuild.sh +1 -1
- package/front_end/third_party/json5/rebuild.sh +1 -1
- package/front_end/third_party/legacy-javascript/{update.sh → rebuild.sh} +1 -1
- package/front_end/third_party/lit/lib/decorators.d.ts +26 -9
- package/front_end/third_party/lit/lib/decorators.js +5 -5
- package/front_end/third_party/lit/lib/decorators.js.map +1 -1
- package/front_end/third_party/lit/lib/directive.js.map +1 -1
- package/front_end/third_party/lit/lib/directives.js +8 -13
- package/front_end/third_party/lit/lib/directives.js.map +1 -1
- package/front_end/third_party/lit/lib/lit.d.ts +26 -9
- package/front_end/third_party/lit/lib/lit.js +5 -5
- package/front_end/third_party/lit/lib/lit.js.map +1 -1
- package/front_end/third_party/lit/lib/static-html.js +2 -2
- package/front_end/third_party/lit/lib/static-html.js.map +1 -1
- package/front_end/third_party/lit/rebuild.sh +1 -1
- package/front_end/third_party/third-party-web/rebuild.sh +1 -1
- package/front_end/ui/components/dialogs/Dialog.ts +6 -7
- package/front_end/ui/legacy/ActionRegistration.ts +9 -9
- package/front_end/ui/legacy/DockController.ts +18 -18
- package/front_end/ui/legacy/FilterBar.ts +7 -7
- package/front_end/ui/legacy/Fragment.ts +4 -4
- package/front_end/ui/legacy/GlassPane.ts +12 -12
- package/front_end/ui/legacy/InspectorView.ts +5 -15
- package/front_end/ui/legacy/ListControl.ts +27 -27
- package/front_end/ui/legacy/ListWidget.ts +4 -4
- package/front_end/ui/legacy/PopoverHelper.ts +4 -4
- package/front_end/ui/legacy/ShortcutRegistry.ts +17 -17
- package/front_end/ui/legacy/TabbedPane.ts +74 -75
- package/front_end/ui/legacy/TextPrompt.ts +31 -31
- package/front_end/ui/legacy/Toolbar.ts +13 -14
- package/front_end/ui/legacy/ViewManager.ts +30 -31
- package/front_end/ui/legacy/Widget.ts +6 -6
- package/front_end/ui/legacy/XLink.ts +9 -9
- package/front_end/ui/legacy/ZoomManager.ts +9 -9
- package/front_end/ui/legacy/components/color_picker/ContrastDetails.ts +27 -27
- package/front_end/ui/legacy/components/color_picker/ContrastInfo.ts +30 -32
- package/front_end/ui/legacy/components/color_picker/Spectrum.ts +15 -15
- package/front_end/ui/legacy/components/data_grid/DataGrid.ts +64 -64
- package/front_end/ui/legacy/components/data_grid/ShowMoreDataGridNode.ts +2 -2
- package/front_end/ui/legacy/components/object_ui/ObjectPropertiesSection.ts +10 -11
- package/front_end/ui/legacy/components/perf_ui/ChartViewport.ts +12 -12
- package/front_end/ui/legacy/components/perf_ui/FlameChart.ts +3 -3
- package/front_end/ui/legacy/components/perf_ui/TimelineGrid.ts +14 -14
- package/front_end/ui/legacy/components/perf_ui/TimelineOverviewPane.ts +8 -8
- package/front_end/ui/legacy/components/quick_open/CommandMenu.ts +5 -5
- package/front_end/ui/legacy/components/source_frame/ResourceSourceFrame.ts +4 -4
- package/front_end/ui/legacy/theme_support/ThemeSupport.ts +4 -4
- package/front_end/ui/visual_logging/KnownContextValues.ts +2 -2
- package/package.json +1 -1
@@ -91,11 +91,11 @@ const UIStrings = {
|
|
91
91
|
const str_ = i18n.i18n.registerUIStrings('ui/legacy/TabbedPane.ts', UIStrings);
|
92
92
|
const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
|
93
93
|
export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, typeof VBox>(VBox) {
|
94
|
-
|
94
|
+
readonly #headerElement: HTMLElement;
|
95
95
|
private readonly headerContentsElement: HTMLElement;
|
96
96
|
tabSlider: HTMLDivElement;
|
97
97
|
readonly tabsElement: HTMLElement;
|
98
|
-
|
98
|
+
readonly #contentElement: HTMLElement;
|
99
99
|
private tabs: TabbedPaneTab[];
|
100
100
|
private readonly tabsHistory: TabbedPaneTab[];
|
101
101
|
tabsById: Map<string, TabbedPaneTab>;
|
@@ -115,8 +115,8 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
115
115
|
private placeholderContainerElement?: HTMLElement;
|
116
116
|
private lastSelectedOverflowTab?: TabbedPaneTab;
|
117
117
|
private measuredDropDownButtonWidth?: number;
|
118
|
-
|
119
|
-
|
118
|
+
#leftToolbar?: Toolbar;
|
119
|
+
#rightToolbar?: Toolbar;
|
120
120
|
allowTabReorder?: boolean;
|
121
121
|
private automaticReorder?: boolean;
|
122
122
|
|
@@ -127,15 +127,15 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
127
127
|
this.contentElement.classList.add('tabbed-pane-shadow');
|
128
128
|
this.contentElement.tabIndex = -1;
|
129
129
|
this.setDefaultFocusedElement(this.contentElement);
|
130
|
-
this
|
131
|
-
this.headerContentsElement = this.
|
130
|
+
this.#headerElement = this.contentElement.createChild('div', 'tabbed-pane-header');
|
131
|
+
this.headerContentsElement = this.#headerElement.createChild('div', 'tabbed-pane-header-contents');
|
132
132
|
this.tabSlider = document.createElement('div');
|
133
133
|
this.tabSlider.classList.add('tabbed-pane-tab-slider');
|
134
134
|
this.tabsElement = this.headerContentsElement.createChild('div', 'tabbed-pane-header-tabs');
|
135
135
|
this.tabsElement.setAttribute('role', 'tablist');
|
136
136
|
this.tabsElement.addEventListener('keydown', this.keyDown.bind(this), false);
|
137
|
-
this
|
138
|
-
this.
|
137
|
+
this.#contentElement = this.contentElement.createChild('div', 'tabbed-pane-content');
|
138
|
+
this.#contentElement.createChild('slot');
|
139
139
|
this.tabs = [];
|
140
140
|
this.tabsHistory = [];
|
141
141
|
this.tabsById = new Map();
|
@@ -155,7 +155,7 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
155
155
|
|
156
156
|
setCurrentTabLocked(locked: boolean): void {
|
157
157
|
this.currentTabLocked = locked;
|
158
|
-
this.
|
158
|
+
this.#headerElement.classList.toggle('locked', this.currentTabLocked);
|
159
159
|
}
|
160
160
|
|
161
161
|
setAutoSelectFirstItemOnShow(autoSelect: boolean): void {
|
@@ -218,11 +218,11 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
218
218
|
}
|
219
219
|
|
220
220
|
headerElement(): Element {
|
221
|
-
return this
|
221
|
+
return this.#headerElement;
|
222
222
|
}
|
223
223
|
|
224
224
|
tabbedPaneContentElement(): Element {
|
225
|
-
return this
|
225
|
+
return this.#contentElement;
|
226
226
|
}
|
227
227
|
|
228
228
|
setTabDelegate(delegate: TabbedPaneTabDelegate): void {
|
@@ -588,17 +588,16 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
588
588
|
}
|
589
589
|
|
590
590
|
if (!this.tabs.length) {
|
591
|
-
this.
|
591
|
+
this.#contentElement.classList.add('has-no-tabs');
|
592
592
|
if (this.placeholderElement && !this.placeholderContainerElement) {
|
593
|
-
this.placeholderContainerElement =
|
594
|
-
this.contentElementInternal.createChild('div', 'tabbed-pane-placeholder fill');
|
593
|
+
this.placeholderContainerElement = this.#contentElement.createChild('div', 'tabbed-pane-placeholder fill');
|
595
594
|
this.placeholderContainerElement.appendChild(this.placeholderElement);
|
596
595
|
if (this.focusedPlaceholderElement) {
|
597
596
|
this.setDefaultFocusedElement(this.focusedPlaceholderElement);
|
598
597
|
}
|
599
598
|
}
|
600
599
|
} else {
|
601
|
-
this.
|
600
|
+
this.#contentElement.classList.remove('has-no-tabs');
|
602
601
|
if (this.placeholderContainerElement) {
|
603
602
|
this.placeholderContainerElement.remove();
|
604
603
|
this.setDefaultFocusedElement(this.contentElement);
|
@@ -614,20 +613,20 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
614
613
|
}
|
615
614
|
|
616
615
|
private adjustToolbarWidth(): void {
|
617
|
-
if (!this
|
616
|
+
if (!this.#rightToolbar || !this.measuredDropDownButtonWidth) {
|
618
617
|
return;
|
619
618
|
}
|
620
|
-
const leftToolbarWidth = this
|
621
|
-
const rightToolbarWidth = this.
|
622
|
-
const totalWidth = this.
|
623
|
-
if (!this.
|
619
|
+
const leftToolbarWidth = this.#leftToolbar?.getBoundingClientRect().width ?? 0;
|
620
|
+
const rightToolbarWidth = this.#rightToolbar.getBoundingClientRect().width;
|
621
|
+
const totalWidth = this.#headerElement.getBoundingClientRect().width;
|
622
|
+
if (!this.#rightToolbar.hasCompactLayout() &&
|
624
623
|
totalWidth - rightToolbarWidth - leftToolbarWidth < this.measuredDropDownButtonWidth + 10) {
|
625
|
-
this.
|
624
|
+
this.#rightToolbar.setCompactLayout(true);
|
626
625
|
} else if (
|
627
|
-
this.
|
626
|
+
this.#rightToolbar.hasCompactLayout() &&
|
628
627
|
// Estimate the right toolbar size in non-compact mode as 2 times its compact size.
|
629
628
|
totalWidth - 2 * rightToolbarWidth - leftToolbarWidth > this.measuredDropDownButtonWidth + 10) {
|
630
|
-
this.
|
629
|
+
this.#rightToolbar.setCompactLayout(false);
|
631
630
|
}
|
632
631
|
}
|
633
632
|
|
@@ -929,7 +928,7 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
929
928
|
}
|
930
929
|
|
931
930
|
override elementsToRestoreScrollPositionsFor(): Element[] {
|
932
|
-
return [this
|
931
|
+
return [this.#contentElement];
|
933
932
|
}
|
934
933
|
|
935
934
|
insertBefore(tab: TabbedPaneTab, index: number): void {
|
@@ -946,21 +945,21 @@ export class TabbedPane extends Common.ObjectWrapper.eventMixin<EventTypes, type
|
|
946
945
|
}
|
947
946
|
|
948
947
|
leftToolbar(): Toolbar {
|
949
|
-
if (!this
|
950
|
-
this
|
951
|
-
this.
|
952
|
-
this.
|
948
|
+
if (!this.#leftToolbar) {
|
949
|
+
this.#leftToolbar = document.createElement('devtools-toolbar');
|
950
|
+
this.#leftToolbar.classList.add('tabbed-pane-left-toolbar');
|
951
|
+
this.#headerElement.insertBefore(this.#leftToolbar, this.#headerElement.firstChild);
|
953
952
|
}
|
954
|
-
return this
|
953
|
+
return this.#leftToolbar;
|
955
954
|
}
|
956
955
|
|
957
956
|
rightToolbar(): Toolbar {
|
958
|
-
if (!this
|
959
|
-
this
|
960
|
-
this.
|
961
|
-
this.
|
957
|
+
if (!this.#rightToolbar) {
|
958
|
+
this.#rightToolbar = document.createElement('devtools-toolbar');
|
959
|
+
this.#rightToolbar.classList.add('tabbed-pane-right-toolbar');
|
960
|
+
this.#headerElement.appendChild(this.#rightToolbar);
|
962
961
|
}
|
963
|
-
return this
|
962
|
+
return this.#rightToolbar;
|
964
963
|
}
|
965
964
|
|
966
965
|
setAllowTabReorder(allow: boolean, automatic?: boolean): void {
|
@@ -1039,50 +1038,50 @@ export class TabbedPaneTab {
|
|
1039
1038
|
closeable: boolean;
|
1040
1039
|
previewFeature = false;
|
1041
1040
|
private readonly tabbedPane: TabbedPane;
|
1042
|
-
|
1043
|
-
|
1044
|
-
|
1045
|
-
|
1041
|
+
#id: string;
|
1042
|
+
#title: string;
|
1043
|
+
#tooltip: string|undefined;
|
1044
|
+
#view: Widget;
|
1046
1045
|
shown: boolean;
|
1047
1046
|
measuredWidth!: number|undefined;
|
1048
|
-
|
1047
|
+
#tabElement!: HTMLElement|undefined;
|
1049
1048
|
private icon: IconButton.Icon.Icon|null = null;
|
1050
1049
|
private suffixElement: HTMLElement|null = null;
|
1051
|
-
|
1050
|
+
#width?: number;
|
1052
1051
|
private delegate?: TabbedPaneTabDelegate;
|
1053
1052
|
private titleElement?: HTMLElement;
|
1054
1053
|
private dragStartX?: number;
|
1055
|
-
|
1054
|
+
#jslogContext?: string;
|
1056
1055
|
constructor(
|
1057
1056
|
tabbedPane: TabbedPane, id: string, title: string, closeable: boolean, previewFeature: boolean, view: Widget,
|
1058
1057
|
tooltip?: string, jslogContext?: string) {
|
1059
1058
|
this.closeable = closeable;
|
1060
1059
|
this.previewFeature = previewFeature;
|
1061
1060
|
this.tabbedPane = tabbedPane;
|
1062
|
-
this
|
1063
|
-
this
|
1064
|
-
this
|
1065
|
-
this
|
1061
|
+
this.#id = id;
|
1062
|
+
this.#title = title;
|
1063
|
+
this.#tooltip = tooltip;
|
1064
|
+
this.#view = view;
|
1066
1065
|
this.shown = false;
|
1067
|
-
this
|
1066
|
+
this.#jslogContext = jslogContext;
|
1068
1067
|
}
|
1069
1068
|
|
1070
1069
|
get id(): string {
|
1071
|
-
return this
|
1070
|
+
return this.#id;
|
1072
1071
|
}
|
1073
1072
|
|
1074
1073
|
get title(): string {
|
1075
|
-
return this
|
1074
|
+
return this.#title;
|
1076
1075
|
}
|
1077
1076
|
|
1078
1077
|
set title(title: string) {
|
1079
|
-
if (title === this
|
1078
|
+
if (title === this.#title) {
|
1080
1079
|
return;
|
1081
1080
|
}
|
1082
|
-
this
|
1081
|
+
this.#title = title;
|
1083
1082
|
if (this.titleElement) {
|
1084
1083
|
this.titleElement.textContent = title;
|
1085
|
-
const closeIconContainer = this
|
1084
|
+
const closeIconContainer = this.#tabElement?.querySelector('.close-button');
|
1086
1085
|
closeIconContainer?.setAttribute('title', i18nString(UIStrings.closeS, {PH1: title}));
|
1087
1086
|
closeIconContainer?.setAttribute('aria-label', i18nString(UIStrings.closeS, {PH1: title}));
|
1088
1087
|
}
|
@@ -1090,7 +1089,7 @@ export class TabbedPaneTab {
|
|
1090
1089
|
}
|
1091
1090
|
|
1092
1091
|
get jslogContext(): string {
|
1093
|
-
return this
|
1092
|
+
return this.#jslogContext ?? (this.#id === 'console-view' ? 'console' : this.#id);
|
1094
1093
|
}
|
1095
1094
|
|
1096
1095
|
isCloseable(): boolean {
|
@@ -1099,16 +1098,16 @@ export class TabbedPaneTab {
|
|
1099
1098
|
|
1100
1099
|
setIcon(icon: IconButton.Icon.Icon|null): void {
|
1101
1100
|
this.icon = icon;
|
1102
|
-
if (this
|
1103
|
-
this.createIconElement(this
|
1101
|
+
if (this.#tabElement && this.titleElement) {
|
1102
|
+
this.createIconElement(this.#tabElement, this.titleElement, false);
|
1104
1103
|
}
|
1105
1104
|
delete this.measuredWidth;
|
1106
1105
|
}
|
1107
1106
|
|
1108
1107
|
setSuffixElement(suffixElement: HTMLElement|null): void {
|
1109
1108
|
this.suffixElement = suffixElement;
|
1110
|
-
if (this
|
1111
|
-
this.createSuffixElement(this
|
1109
|
+
if (this.#tabElement && this.titleElement) {
|
1110
|
+
this.createSuffixElement(this.#tabElement, this.titleElement, false);
|
1112
1111
|
}
|
1113
1112
|
delete this.measuredWidth;
|
1114
1113
|
}
|
@@ -1125,39 +1124,39 @@ export class TabbedPaneTab {
|
|
1125
1124
|
}
|
1126
1125
|
|
1127
1126
|
get view(): Widget {
|
1128
|
-
return this
|
1127
|
+
return this.#view;
|
1129
1128
|
}
|
1130
1129
|
|
1131
1130
|
set view(view: Widget) {
|
1132
|
-
this
|
1131
|
+
this.#view = view;
|
1133
1132
|
}
|
1134
1133
|
|
1135
1134
|
get tooltip(): string|undefined {
|
1136
|
-
return this
|
1135
|
+
return this.#tooltip;
|
1137
1136
|
}
|
1138
1137
|
|
1139
1138
|
set tooltip(tooltip: string|undefined) {
|
1140
|
-
this
|
1139
|
+
this.#tooltip = tooltip;
|
1141
1140
|
if (this.titleElement) {
|
1142
1141
|
Tooltip.install(this.titleElement, tooltip || '');
|
1143
1142
|
}
|
1144
1143
|
}
|
1145
1144
|
|
1146
1145
|
get tabElement(): HTMLElement {
|
1147
|
-
if (!this
|
1148
|
-
this
|
1146
|
+
if (!this.#tabElement) {
|
1147
|
+
this.#tabElement = this.createTabElement(false);
|
1149
1148
|
}
|
1150
1149
|
|
1151
|
-
return this
|
1150
|
+
return this.#tabElement;
|
1152
1151
|
}
|
1153
1152
|
|
1154
1153
|
width(): number {
|
1155
|
-
return this
|
1154
|
+
return this.#width || 0;
|
1156
1155
|
}
|
1157
1156
|
|
1158
1157
|
setWidth(width: number): void {
|
1159
1158
|
this.tabElement.style.width = width === -1 ? '' : (width + 'px');
|
1160
|
-
this
|
1159
|
+
this.#width = width;
|
1161
1160
|
}
|
1162
1161
|
|
1163
1162
|
setDelegate(delegate: TabbedPaneTabDelegate): void {
|
@@ -1213,7 +1212,7 @@ export class TabbedPaneTab {
|
|
1213
1212
|
createTabElement(measuring: boolean): HTMLElement {
|
1214
1213
|
const tabElement = document.createElement('div');
|
1215
1214
|
tabElement.classList.add('tabbed-pane-header-tab');
|
1216
|
-
tabElement.id = 'tab-' + this
|
1215
|
+
tabElement.id = 'tab-' + this.#id;
|
1217
1216
|
ARIAUtils.markAsTab(tabElement);
|
1218
1217
|
ARIAUtils.setSelected(tabElement, false);
|
1219
1218
|
ARIAUtils.setLabel(tabElement, this.title);
|
@@ -1393,8 +1392,8 @@ export class TabbedPaneTab {
|
|
1393
1392
|
return false;
|
1394
1393
|
}
|
1395
1394
|
this.dragStartX = event.pageX;
|
1396
|
-
if (this
|
1397
|
-
this.
|
1395
|
+
if (this.#tabElement) {
|
1396
|
+
this.#tabElement.classList.add('dragging');
|
1398
1397
|
}
|
1399
1398
|
this.tabbedPane.tabSlider.remove();
|
1400
1399
|
return true;
|
@@ -1404,12 +1403,12 @@ export class TabbedPaneTab {
|
|
1404
1403
|
const tabElements = this.tabbedPane.tabsElement.childNodes;
|
1405
1404
|
for (let i = 0; i < tabElements.length; ++i) {
|
1406
1405
|
let tabElement: HTMLElement = (tabElements[i] as HTMLElement);
|
1407
|
-
if (!this
|
1406
|
+
if (!this.#tabElement || tabElement === this.#tabElement) {
|
1408
1407
|
continue;
|
1409
1408
|
}
|
1410
1409
|
|
1411
|
-
const intersects = tabElement.offsetLeft + tabElement.clientWidth > this.
|
1412
|
-
this.
|
1410
|
+
const intersects = tabElement.offsetLeft + tabElement.clientWidth > this.#tabElement.offsetLeft &&
|
1411
|
+
this.#tabElement.offsetLeft + this.#tabElement.clientWidth > tabElement.offsetLeft;
|
1413
1412
|
if (!intersects) {
|
1414
1413
|
continue;
|
1415
1414
|
}
|
@@ -1424,14 +1423,14 @@ export class TabbedPaneTab {
|
|
1424
1423
|
++i;
|
1425
1424
|
}
|
1426
1425
|
|
1427
|
-
const oldOffsetLeft = this.
|
1426
|
+
const oldOffsetLeft = this.#tabElement.offsetLeft;
|
1428
1427
|
this.tabbedPane.insertBefore(this, i);
|
1429
|
-
this.dragStartX = dragStartX + this.
|
1428
|
+
this.dragStartX = dragStartX + this.#tabElement.offsetLeft - oldOffsetLeft;
|
1430
1429
|
break;
|
1431
1430
|
}
|
1432
1431
|
|
1433
1432
|
const dragStartX = (this.dragStartX as number);
|
1434
|
-
const tabElement = (this
|
1433
|
+
const tabElement = (this.#tabElement as HTMLElement);
|
1435
1434
|
if (!tabElement.previousSibling && event.pageX - dragStartX < 0) {
|
1436
1435
|
tabElement.style.setProperty('left', '0px');
|
1437
1436
|
return;
|
@@ -1445,7 +1444,7 @@ export class TabbedPaneTab {
|
|
1445
1444
|
}
|
1446
1445
|
|
1447
1446
|
private endTabDragging(_event: Event): void {
|
1448
|
-
const tabElement = (this
|
1447
|
+
const tabElement = (this.#tabElement as HTMLElement);
|
1449
1448
|
tabElement.classList.remove('dragging');
|
1450
1449
|
tabElement.style.removeProperty('left');
|
1451
1450
|
delete this.dragStartX;
|
@@ -47,7 +47,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
47
47
|
private proxyElement!: HTMLElement|undefined;
|
48
48
|
private proxyElementDisplay: string;
|
49
49
|
private autocompletionTimeout: number;
|
50
|
-
|
50
|
+
#title: string;
|
51
51
|
private queryRange: TextUtils.TextRange.TextRange|null;
|
52
52
|
private previousText: string;
|
53
53
|
private currentSuggestion: Suggestion|null;
|
@@ -57,7 +57,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
57
57
|
private loadCompletions!: (this: null, arg1: string, arg2: string, arg3?: boolean|undefined) => Promise<Suggestion[]>;
|
58
58
|
private completionStopCharacters!: string;
|
59
59
|
private usesSuggestionBuilder!: boolean;
|
60
|
-
|
60
|
+
#element?: Element;
|
61
61
|
private boundOnKeyDown?: ((ev: KeyboardEvent) => void);
|
62
62
|
private boundOnInput?: ((ev: Event) => void);
|
63
63
|
private boundOnMouseWheel?: ((event: Event) => void);
|
@@ -70,14 +70,14 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
70
70
|
private blurListener?: ((arg0: Event) => void);
|
71
71
|
private oldTabIndex?: number;
|
72
72
|
private completeTimeout?: number;
|
73
|
-
|
73
|
+
#disableDefaultSuggestionForEmptyInput?: boolean;
|
74
74
|
jslogContext: string|undefined = undefined;
|
75
75
|
|
76
76
|
constructor() {
|
77
77
|
super();
|
78
78
|
this.proxyElementDisplay = 'inline-block';
|
79
79
|
this.autocompletionTimeout = DefaultAutocompletionTimeout;
|
80
|
-
this
|
80
|
+
this.#title = '';
|
81
81
|
this.queryRange = null;
|
82
82
|
this.previousText = '';
|
83
83
|
this.currentSuggestion = null;
|
@@ -110,7 +110,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
110
110
|
* they should use the result of this method to attach listeners for bubbling events.
|
111
111
|
*/
|
112
112
|
attach(element: Element): Element {
|
113
|
-
return this
|
113
|
+
return this.#attach(element);
|
114
114
|
}
|
115
115
|
|
116
116
|
/**
|
@@ -120,16 +120,16 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
120
120
|
* (since the "blur" event does not bubble.)
|
121
121
|
*/
|
122
122
|
attachAndStartEditing(element: Element, blurListener: (arg0: Event) => void): Element {
|
123
|
-
const proxyElement = this
|
123
|
+
const proxyElement = this.#attach(element);
|
124
124
|
this.startEditing(blurListener);
|
125
125
|
return proxyElement;
|
126
126
|
}
|
127
127
|
|
128
|
-
|
128
|
+
#attach(element: Element): Element {
|
129
129
|
if (this.proxyElement) {
|
130
130
|
throw new Error('Cannot attach an attached TextPrompt');
|
131
131
|
}
|
132
|
-
this
|
132
|
+
this.#element = element;
|
133
133
|
|
134
134
|
this.boundOnKeyDown = this.onKeyDown.bind(this);
|
135
135
|
this.boundOnInput = this.onInput.bind(this);
|
@@ -152,34 +152,34 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
152
152
|
if (this.jslogContext) {
|
153
153
|
jslog = jslog.context(this.jslogContext);
|
154
154
|
}
|
155
|
-
if (!this.
|
156
|
-
this.
|
155
|
+
if (!this.#element.hasAttribute('jslog')) {
|
156
|
+
this.#element.setAttribute('jslog', `${jslog}`);
|
157
157
|
}
|
158
|
-
this.
|
159
|
-
ARIAUtils.markAsTextBox(this
|
160
|
-
ARIAUtils.setAutocomplete(this
|
161
|
-
ARIAUtils.setHasPopup(this
|
162
|
-
this.
|
158
|
+
this.#element.classList.add('text-prompt');
|
159
|
+
ARIAUtils.markAsTextBox(this.#element);
|
160
|
+
ARIAUtils.setAutocomplete(this.#element, ARIAUtils.AutocompleteInteractionModel.BOTH);
|
161
|
+
ARIAUtils.setHasPopup(this.#element, ARIAUtils.PopupRole.LIST_BOX);
|
162
|
+
this.#element.setAttribute('contenteditable', 'plaintext-only');
|
163
163
|
this.element().addEventListener('keydown', this.boundOnKeyDown, false);
|
164
|
-
this.
|
165
|
-
this.
|
166
|
-
this.
|
167
|
-
this.
|
164
|
+
this.#element.addEventListener('input', this.boundOnInput, false);
|
165
|
+
this.#element.addEventListener('wheel', this.boundOnMouseWheel, false);
|
166
|
+
this.#element.addEventListener('selectstart', this.boundClearAutocomplete, false);
|
167
|
+
this.#element.addEventListener('blur', this.boundOnBlur, false);
|
168
168
|
|
169
169
|
this.suggestBox = new SuggestBox(this, 20);
|
170
170
|
|
171
|
-
if (this
|
172
|
-
Tooltip.install(this.proxyElement, this
|
171
|
+
if (this.#title) {
|
172
|
+
Tooltip.install(this.proxyElement, this.#title);
|
173
173
|
}
|
174
174
|
|
175
175
|
return this.proxyElement;
|
176
176
|
}
|
177
177
|
|
178
178
|
element(): HTMLElement {
|
179
|
-
if (!this
|
179
|
+
if (!this.#element) {
|
180
180
|
throw new Error('Expected an already attached element!');
|
181
181
|
}
|
182
|
-
return this
|
182
|
+
return this.#element as HTMLElement;
|
183
183
|
}
|
184
184
|
|
185
185
|
detach(): void {
|
@@ -256,11 +256,11 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
256
256
|
}
|
257
257
|
|
258
258
|
title(): string {
|
259
|
-
return this
|
259
|
+
return this.#title;
|
260
260
|
}
|
261
261
|
|
262
262
|
setTitle(title: string): void {
|
263
|
-
this
|
263
|
+
this.#title = title;
|
264
264
|
if (this.proxyElement) {
|
265
265
|
Tooltip.install(this.proxyElement, title);
|
266
266
|
}
|
@@ -448,7 +448,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
448
448
|
result = this.suggestBox.acceptSuggestion();
|
449
449
|
}
|
450
450
|
if (!result) {
|
451
|
-
result = this
|
451
|
+
result = this.#acceptSuggestion();
|
452
452
|
}
|
453
453
|
if (this.usesSuggestionBuilder && result) {
|
454
454
|
// Trigger autocompletions for text prompts using suggestion builders
|
@@ -543,7 +543,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
543
543
|
}
|
544
544
|
|
545
545
|
disableDefaultSuggestionForEmptyInput(): void {
|
546
|
-
this
|
546
|
+
this.#disableDefaultSuggestionForEmptyInput = true;
|
547
547
|
}
|
548
548
|
|
549
549
|
private boxForAnchorAtStart(selection: Selection, textRange: Range): AnchorBox {
|
@@ -604,7 +604,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
604
604
|
this.queryRange = new TextUtils.TextRange.TextRange(
|
605
605
|
0, beforeRange.toString().length, 0, beforeRange.toString().length + fullWordRange.toString().length);
|
606
606
|
|
607
|
-
const shouldSelect = !this
|
607
|
+
const shouldSelect = !this.#disableDefaultSuggestionForEmptyInput || Boolean(this.text());
|
608
608
|
if (this.suggestBox) {
|
609
609
|
this.suggestBox.updateSuggestions(
|
610
610
|
this.boxForAnchorAtStart(selection, fullWordRange), completions, shouldSelect, !this.isCaretAtEndOfPrompt(),
|
@@ -621,10 +621,10 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
621
621
|
}
|
622
622
|
|
623
623
|
acceptSuggestion(): void {
|
624
|
-
this
|
624
|
+
this.#acceptSuggestion();
|
625
625
|
}
|
626
626
|
|
627
|
-
|
627
|
+
#acceptSuggestion(): boolean {
|
628
628
|
if (!this.queryRange) {
|
629
629
|
return false;
|
630
630
|
}
|
@@ -696,7 +696,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
|
|
696
696
|
foundNextText = true;
|
697
697
|
}
|
698
698
|
|
699
|
-
node = node.traverseNextNode(this
|
699
|
+
node = node.traverseNextNode(this.#element);
|
700
700
|
}
|
701
701
|
|
702
702
|
return true;
|
@@ -492,7 +492,7 @@ export interface ToolbarButtonOptions {
|
|
492
492
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
493
493
|
export class ToolbarItem<T = any, E extends HTMLElement = HTMLElement> extends Common.ObjectWrapper.ObjectWrapper<T> {
|
494
494
|
element: E;
|
495
|
-
|
495
|
+
#visible: boolean;
|
496
496
|
enabled: boolean;
|
497
497
|
toolbar: Toolbar|null;
|
498
498
|
protected title?: string;
|
@@ -500,7 +500,7 @@ export class ToolbarItem<T = any, E extends HTMLElement = HTMLElement> extends C
|
|
500
500
|
constructor(element: E) {
|
501
501
|
super();
|
502
502
|
this.element = element;
|
503
|
-
this
|
503
|
+
this.#visible = true;
|
504
504
|
this.enabled = true;
|
505
505
|
|
506
506
|
/**
|
@@ -537,15 +537,15 @@ export class ToolbarItem<T = any, E extends HTMLElement = HTMLElement> extends C
|
|
537
537
|
}
|
538
538
|
|
539
539
|
visible(): boolean {
|
540
|
-
return this
|
540
|
+
return this.#visible;
|
541
541
|
}
|
542
542
|
|
543
543
|
setVisible(x: boolean): void {
|
544
|
-
if (this
|
544
|
+
if (this.#visible === x) {
|
545
545
|
return;
|
546
546
|
}
|
547
547
|
this.element.classList.toggle('hidden', !x);
|
548
|
-
this
|
548
|
+
this.#visible = x;
|
549
549
|
if (this.toolbar && !(this instanceof ToolbarSeparator)) {
|
550
550
|
this.toolbar.hideSeparatorDupes();
|
551
551
|
}
|
@@ -1225,7 +1225,6 @@ export class ToolbarComboBox extends ToolbarItem<void, HTMLSelectElement> {
|
|
1225
1225
|
selectedIndex(): number {
|
1226
1226
|
return this.element.selectedIndex;
|
1227
1227
|
}
|
1228
|
-
|
1229
1228
|
}
|
1230
1229
|
|
1231
1230
|
export interface Option {
|
@@ -1234,12 +1233,12 @@ export interface Option {
|
|
1234
1233
|
}
|
1235
1234
|
|
1236
1235
|
export class ToolbarSettingComboBox extends ToolbarComboBox {
|
1237
|
-
|
1236
|
+
#options: Option[];
|
1238
1237
|
private readonly setting: Common.Settings.Setting<string>;
|
1239
1238
|
private muteSettingListener?: boolean;
|
1240
1239
|
constructor(options: Option[], setting: Common.Settings.Setting<string>, accessibleName: string) {
|
1241
1240
|
super(null, accessibleName, undefined, setting.name);
|
1242
|
-
this
|
1241
|
+
this.#options = options;
|
1243
1242
|
this.setting = setting;
|
1244
1243
|
this.element.addEventListener('change', this.onSelectValueChange.bind(this), false);
|
1245
1244
|
this.setOptions(options);
|
@@ -1247,7 +1246,7 @@ export class ToolbarSettingComboBox extends ToolbarComboBox {
|
|
1247
1246
|
}
|
1248
1247
|
|
1249
1248
|
setOptions(options: Option[]): void {
|
1250
|
-
this
|
1249
|
+
this.#options = options;
|
1251
1250
|
this.element.removeChildren();
|
1252
1251
|
for (let i = 0; i < options.length; ++i) {
|
1253
1252
|
const dataOption = options[i];
|
@@ -1260,7 +1259,7 @@ export class ToolbarSettingComboBox extends ToolbarComboBox {
|
|
1260
1259
|
}
|
1261
1260
|
|
1262
1261
|
value(): string {
|
1263
|
-
return this
|
1262
|
+
return this.#options[this.selectedIndex()].value;
|
1264
1263
|
}
|
1265
1264
|
|
1266
1265
|
override select(option: Element): void {
|
@@ -1270,7 +1269,7 @@ export class ToolbarSettingComboBox extends ToolbarComboBox {
|
|
1270
1269
|
|
1271
1270
|
override setSelectedIndex(index: number): void {
|
1272
1271
|
super.setSelectedIndex(index);
|
1273
|
-
const option = this.
|
1272
|
+
const option = this.#options.at(index);
|
1274
1273
|
if (option) {
|
1275
1274
|
this.setTitle(option.label);
|
1276
1275
|
}
|
@@ -1294,8 +1293,8 @@ export class ToolbarSettingComboBox extends ToolbarComboBox {
|
|
1294
1293
|
}
|
1295
1294
|
|
1296
1295
|
const value = this.setting.get();
|
1297
|
-
for (let i = 0; i < this.
|
1298
|
-
if (value === this
|
1296
|
+
for (let i = 0; i < this.#options.length; ++i) {
|
1297
|
+
if (value === this.#options[i].value) {
|
1299
1298
|
this.setSelectedIndex(i);
|
1300
1299
|
break;
|
1301
1300
|
}
|
@@ -1306,7 +1305,7 @@ export class ToolbarSettingComboBox extends ToolbarComboBox {
|
|
1306
1305
|
* Run when the user interacts with the <select> element.
|
1307
1306
|
*/
|
1308
1307
|
private onSelectValueChange(_event: Event): void {
|
1309
|
-
const option = this
|
1308
|
+
const option = this.#options[this.selectedIndex()];
|
1310
1309
|
this.muteSettingListener = true;
|
1311
1310
|
this.setting.set(option.value);
|
1312
1311
|
this.muteSettingListener = false;
|