chrome-devtools-frontend 1.0.1376716 → 1.0.1386602

package/.stylelintrc.json

@@ -16,7 +16,8 @@
       true,
       {
         "ignoreTypes": [
-          "/^devtools-/"
+          "/^devtools-/",
+          "/^dt-/"
         ]
       }
     ],

package/config/gni/devtools_grd_files.gni

@@ -36,6 +36,7 @@ grd_files_release_sources = [
   "front_end/Images/align-self-end.svg",
   "front_end/Images/align-self-start.svg",
   "front_end/Images/align-self-stretch.svg",
+  "front_end/Images/animation.svg",
   "front_end/Images/arrow-back.svg",
   "front_end/Images/arrow-down.svg",
   "front_end/Images/arrow-drop-down-dark.svg",
@@ -54,6 +55,7 @@ grd_files_release_sources = [
   "front_end/Images/breakpoint-circle.svg",
   "front_end/Images/breakpoint-crossed-filled.svg",
   "front_end/Images/breakpoint-crossed.svg",
+  "front_end/Images/brush-2.svg",
   "front_end/Images/brush-filled.svg",
   "front_end/Images/brush.svg",
   "front_end/Images/bug.svg",
@@ -86,6 +88,7 @@ grd_files_release_sources = [
   "front_end/Images/console-conditional-breakpoint.svg",
   "front_end/Images/console-logpoint.svg",
   "front_end/Images/cookie.svg",
+  "front_end/Images/cookie_off.svg",
   "front_end/Images/copy.svg",
   "front_end/Images/corporate-fare.svg",
   "front_end/Images/credit-card.svg",
@@ -105,6 +108,7 @@ grd_files_release_sources = [
   "front_end/Images/dock-window.svg",
   "front_end/Images/document.svg",
   "front_end/Images/dog-paw.svg",
+  "front_end/Images/domain.svg",
   "front_end/Images/dots-horizontal.svg",
   "front_end/Images/dots-vertical.svg",
   "front_end/Images/download.svg",
@@ -411,6 +415,8 @@ grd_files_release_sources = [
   "front_end/models/issues_manager/descriptions/cookieCrossSiteRedirectDowngrade.md",
   "front_end/models/issues_manager/descriptions/cookieExcludeBlockedWithinRelatedWebsiteSet.md",
   "front_end/models/issues_manager/descriptions/cookieExcludeDomainNonAscii.md",
+  "front_end/models/issues_manager/descriptions/cookieExcludePortMismatch.md",
+  "front_end/models/issues_manager/descriptions/cookieExcludeSchemeMismatch.md",
   "front_end/models/issues_manager/descriptions/cookieExcludeThirdPartyPhaseoutRead.md",
   "front_end/models/issues_manager/descriptions/cookieExcludeThirdPartyPhaseoutSet.md",
   "front_end/models/issues_manager/descriptions/cookieWarnDomainNonAscii.md",
@@ -646,6 +652,10 @@ grd_files_release_sources = [
   "front_end/panels/web_audio/web_audio.js",
   "front_end/panels/webauthn/webauthn-meta.js",
   "front_end/panels/webauthn/webauthn.js",
+  "front_end/panels/whats_new/resources/WNDT.md",
+  "front_end/panels/whats_new/resources/whatsnew.avif",
+  "front_end/panels/whats_new/whats_new-meta.js",
+  "front_end/panels/whats_new/whats_new.js",
   "front_end/rehydrated_devtools_app.html",
   "front_end/services/puppeteer/puppeteer.js",
   "front_end/services/trace_bounds/trace_bounds.js",
@@ -717,7 +727,6 @@ grd_files_release_sources = [
   "front_end/ui/components/text_editor/text_editor.js",
   "front_end/ui/components/text_prompt/text_prompt.js",
   "front_end/ui/components/tree_outline/tree_outline.js",
-  "front_end/ui/components/two_states_counter/two_states_counter.js",
   "front_end/ui/legacy/components/color_picker/color_picker.js",
   "front_end/ui/legacy/components/cookie_table/cookie_table.js",
   "front_end/ui/legacy/components/data_grid/data_grid.js",
@@ -777,7 +786,9 @@ grd_files_debug_sources = [
   "front_end/core/host/Platform.js",
   "front_end/core/host/ResourceLoader.js",
   "front_end/core/host/UserMetrics.js",
+  "front_end/core/i18n/ByteUtilities.js",
   "front_end/core/i18n/DevToolsLocale.js",
+  "front_end/core/i18n/NumberFormatter.js",
   "front_end/core/i18n/i18nImpl.js",
   "front_end/core/i18n/i18nTypes.js",
   "front_end/core/i18n/locales.js",
@@ -1025,9 +1036,6 @@ grd_files_debug_sources = [
   "front_end/models/text_utils/TextRange.js",
   "front_end/models/text_utils/TextUtils.js",
   "front_end/models/text_utils/WasmDisassembly.js",
-  "front_end/models/timeline_model/TimelineJSProfile.js",
-  "front_end/models/timeline_model/TimelineModelFilter.js",
-  "front_end/models/timeline_model/TimelineProfileTree.js",
   "front_end/models/timeline_model/TracingLayerTree.js",
   "front_end/models/trace/LanternComputationData.js",
   "front_end/models/trace/ModelImpl.js",
@@ -1038,6 +1046,9 @@ grd_files_debug_sources = [
   "front_end/models/trace/extras/MainThreadActivity.js",
   "front_end/models/trace/extras/Metadata.js",
   "front_end/models/trace/extras/ThirdParties.js",
+  "front_end/models/trace/extras/TimelineJSProfile.js",
+  "front_end/models/trace/extras/TraceFilter.js",
+  "front_end/models/trace/extras/TraceTree.js",
   "front_end/models/trace/extras/URLForEntry.js",
   "front_end/models/trace/handlers/AnimationHandler.js",
   "front_end/models/trace/handlers/AuctionWorkletsHandler.js",
@@ -1075,16 +1086,18 @@ grd_files_debug_sources = [
   "front_end/models/trace/helpers/Timing.js",
   "front_end/models/trace/helpers/Trace.js",
   "front_end/models/trace/helpers/TreeHelpers.js",
+  "front_end/models/trace/insights/CLSCulprits.js",
   "front_end/models/trace/insights/Common.js",
-  "front_end/models/trace/insights/CumulativeLayoutShift.js",
   "front_end/models/trace/insights/DocumentLatency.js",
   "front_end/models/trace/insights/FontDisplay.js",
-  "front_end/models/trace/insights/InsightRunners.js",
+  "front_end/models/trace/insights/ImageDelivery.js",
   "front_end/models/trace/insights/InteractionToNextPaint.js",
-  "front_end/models/trace/insights/LargestContentfulPaint.js",
+  "front_end/models/trace/insights/LCPDiscovery.js",
+  "front_end/models/trace/insights/LCPPhases.js",
+  "front_end/models/trace/insights/Models.js",
   "front_end/models/trace/insights/RenderBlocking.js",
   "front_end/models/trace/insights/SlowCSSSelector.js",
-  "front_end/models/trace/insights/ThirdPartyWeb.js",
+  "front_end/models/trace/insights/ThirdParties.js",
   "front_end/models/trace/insights/Viewport.js",
   "front_end/models/trace/insights/types.js",
   "front_end/models/trace/lantern/core/LanternError.js",
@@ -1396,6 +1409,7 @@ grd_files_debug_sources = [
   "front_end/panels/explain/components/consoleInsight.css.js",
   "front_end/panels/explain/components/consoleInsightSourcesList.css.js",
   "front_end/panels/freestyler/AiAgent.js",
+  "front_end/panels/freestyler/AiHistoryStorage.js",
   "front_end/panels/freestyler/ChangeManager.js",
   "front_end/panels/freestyler/DrJonesFileAgent.js",
   "front_end/panels/freestyler/DrJonesNetworkAgent.js",
@@ -1669,12 +1683,17 @@ grd_files_debug_sources = [
   "front_end/panels/search/SearchView.js",
   "front_end/panels/search/searchResultsPane.css.js",
   "front_end/panels/search/searchView.css.js",
+  "front_end/panels/security/CookieControlsTreeElement.js",
+  "front_end/panels/security/CookieControlsView.js",
   "front_end/panels/security/CookieReportTreeElement.js",
+  "front_end/panels/security/CookieReportView.js",
   "front_end/panels/security/OriginTreeElement.js",
   "front_end/panels/security/SecurityModel.js",
   "front_end/panels/security/SecurityPanel.js",
   "front_end/panels/security/SecurityPanelSidebar.js",
   "front_end/panels/security/SecurityPanelSidebarTreeElement.js",
+  "front_end/panels/security/cookieControlsView.css.js",
+  "front_end/panels/security/cookieReportView.css.js",
   "front_end/panels/security/lockIcon.css.js",
   "front_end/panels/security/mainView.css.js",
   "front_end/panels/security/originView.css.js",
@@ -1813,15 +1832,18 @@ grd_files_debug_sources = [
   "front_end/panels/timeline/components/SidebarAnnotationsTab.js",
   "front_end/panels/timeline/components/SidebarInsightsTab.js",
   "front_end/panels/timeline/components/SidebarSingleInsightSet.js",
+  "front_end/panels/timeline/components/TimelineSummary.js",
   "front_end/panels/timeline/components/Utils.js",
   "front_end/panels/timeline/components/breadcrumbsUI.css.js",
   "front_end/panels/timeline/components/cpuThrottlingSelector.css.js",
   "front_end/panels/timeline/components/fieldSettingsDialog.css.js",
+  "front_end/panels/timeline/components/insights/BaseInsightComponent.js",
   "front_end/panels/timeline/components/insights/CLSCulprits.js",
   "front_end/panels/timeline/components/insights/DocumentLatency.js",
   "front_end/panels/timeline/components/insights/EventRef.js",
   "front_end/panels/timeline/components/insights/FontDisplay.js",
   "front_end/panels/timeline/components/insights/Helpers.js",
+  "front_end/panels/timeline/components/insights/ImageDelivery.js",
   "front_end/panels/timeline/components/insights/InteractionToNextPaint.js",
   "front_end/panels/timeline/components/insights/LCPDiscovery.js",
   "front_end/panels/timeline/components/insights/LCPPhases.js",
@@ -1832,7 +1854,7 @@ grd_files_debug_sources = [
   "front_end/panels/timeline/components/insights/Table.js",
   "front_end/panels/timeline/components/insights/ThirdParties.js",
   "front_end/panels/timeline/components/insights/Viewport.js",
-  "front_end/panels/timeline/components/insights/sidebarInsight.css.js",
+  "front_end/panels/timeline/components/insights/baseInsightComponent.css.js",
   "front_end/panels/timeline/components/insights/table.css.js",
   "front_end/panels/timeline/components/insights/types.js",
   "front_end/panels/timeline/components/interactionBreakdown.css.js",
@@ -1847,6 +1869,7 @@ grd_files_debug_sources = [
   "front_end/panels/timeline/components/sidebarAnnotationsTab.css.js",
   "front_end/panels/timeline/components/sidebarInsightsTab.css.js",
   "front_end/panels/timeline/components/sidebarSingleInsightSet.css.js",
+  "front_end/panels/timeline/components/timelineSummary.css.js",
   "front_end/panels/timeline/extensions/ExtensionUI.js",
   "front_end/panels/timeline/historyToolbarButton.css.js",
   "front_end/panels/timeline/overlays/OverlaysImpl.js",
@@ -1887,6 +1910,10 @@ grd_files_debug_sources = [
   "front_end/panels/web_audio/webAudio.css.js",
   "front_end/panels/webauthn/WebauthnPane.js",
   "front_end/panels/webauthn/webauthnPane.css.js",
+  "front_end/panels/whats_new/ReleaseNoteText.js",
+  "front_end/panels/whats_new/ReleaseNoteView.js",
+  "front_end/panels/whats_new/WhatsNewImpl.js",
+  "front_end/panels/whats_new/releaseNoteView.css.js",
   "front_end/services/puppeteer/PuppeteerConnection.js",
   "front_end/services/trace_bounds/TraceBounds.js",
   "front_end/services/tracing/PerformanceTracing.js",
@@ -2025,6 +2052,7 @@ grd_files_debug_sources = [
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/CustomQueryHandler.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/Debug.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/Device.js",
+  "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/DownloadBehavior.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/Errors.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/EventEmitter.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/common/FileChooser.js",
@@ -2089,6 +2117,7 @@ grd_files_debug_sources = [
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/util/decorators.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/util/disposable.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/util/encoding.js",
+  "front_end/third_party/puppeteer/package/lib/esm/puppeteer/util/incremental-id-generator.js",
   "front_end/third_party/puppeteer/package/lib/esm/puppeteer/util/util.js",
   "front_end/third_party/puppeteer/package/lib/esm/third_party/mitt/mitt.js",
   "front_end/third_party/puppeteer/package/lib/esm/third_party/parsel-js/parsel-js.js",
@@ -2159,9 +2188,11 @@ grd_files_debug_sources = [
   "front_end/ui/components/data_grid/DataGridUtils.js",
   "front_end/ui/components/data_grid/dataGrid.css.js",
   "front_end/ui/components/data_grid/dataGridController.css.js",
+  "front_end/ui/components/dialogs/ButtonDialog.js",
   "front_end/ui/components/dialogs/Dialog.js",
   "front_end/ui/components/dialogs/IconDialog.js",
   "front_end/ui/components/dialogs/ShortcutDialog.js",
+  "front_end/ui/components/dialogs/buttonDialog.css.js",
   "front_end/ui/components/dialogs/dialog.css.js",
   "front_end/ui/components/dialogs/iconDialog.css.js",
   "front_end/ui/components/dialogs/shortcutDialog.css.js",
@@ -2258,8 +2289,6 @@ grd_files_debug_sources = [
   "front_end/ui/components/tree_outline/TreeOutline.js",
   "front_end/ui/components/tree_outline/TreeOutlineUtils.js",
   "front_end/ui/components/tree_outline/treeOutline.css.js",
-  "front_end/ui/components/two_states_counter/TwoStatesCounter.js",
-  "front_end/ui/components/two_states_counter/twoStatesCounter.css.js",
   "front_end/ui/legacy/ARIAUtils.js",
   "front_end/ui/legacy/ActionRegistration.js",
   "front_end/ui/legacy/ActionRegistry.js",

package/config/gni/devtools_image_files.gni

@@ -43,6 +43,7 @@ devtools_svg_sources = [
   "align-self-end.svg",
   "align-self-start.svg",
   "align-self-stretch.svg",
+  "animation.svg",
   "arrow-back.svg",
   "arrow-down.svg",
   "arrow-drop-down-dark.svg",
@@ -61,6 +62,7 @@ devtools_svg_sources = [
   "breakpoint-circle.svg",
   "breakpoint-crossed-filled.svg",
   "breakpoint-crossed.svg",
+  "brush-2.svg",
   "brush-filled.svg",
   "brush.svg",
   "bug.svg",
@@ -90,6 +92,7 @@ devtools_svg_sources = [
   "console-conditional-breakpoint.svg",
   "console-logpoint.svg",
   "cookie.svg",
+  "cookie_off.svg",
   "copy.svg",
   "corporate-fare.svg",
   "credit-card.svg",
@@ -108,6 +111,7 @@ devtools_svg_sources = [
   "dock-window.svg",
   "document.svg",
   "dog-paw.svg",
+  "domain.svg",
   "dots-horizontal.svg",
   "dots-vertical.svg",
   "download.svg",

package/docs/README.md

@@ -49,6 +49,10 @@ below.**
 *   [DevTools support checklist for JavaScript features](./checklist/javascript.md)
 *   [DevTools support checklist for WebAssembly features](./checklist/webassembly.md)
 
+### Policies
+
+*   [Chromium DevTools Slow-Close Policy](./policy/slow-close.md)
+
 ### Useful Commands
 
 `git cl format --js`

package/docs/contributing/issues.md

@@ -1,5 +1,7 @@
 # Chromium DevTools Issues Guidelines
 
+[goo.gle/chromium-devtools-issues](https://goo.gle/chromium-devtools-issues)
+
 This document explains how Chromium DevTools (related) issues are tracked in the
 `Chromium>Platform>DevTools` component tree of [crbug], how we define and manage
 priorities and Service Level Objectives (SLOs), as well as the overall bug life
@@ -133,12 +135,13 @@ The following components in [crbug] are owned by the Chrome DevTools team.
 | `Chromium>Platform>DevTools>Application`   | Application panel                                             |
 | `Chromium>Platform>DevTools>Console`       | Console panel                                                 |
 | `Chromium>Platform>DevTools>Elements`      | Elements panel                                                |
+| `Chromium>Platform>DevTools>Infra`         | Issues related to DevTools' infrastructure                    |
 | `Chromium>Platform>DevTools>Issues`        | Issues panel                                                  |
 | `Chromium>Platform>DevTools>Memory`        | Heap/Memory Profiling, Memory Analysis                        |
 | `Chromium>Platform>DevTools>Mobile`        | Mobile Emulation / Debugging                                  |
 | `Chromium>Platform>DevTools>Network`       | Network, Network conditions,  Network request blocking panels |
 | `Chromium>Platform>DevTools>Performance`   | Performance, Performance Monitor, Performance Insights panels |
-| `Chromium>Platform>DevTools>Platform`      | Protocol, Backend, DevTools Extensions                        |
+| `Chromium>Platform>DevTools>Extensions`    | Issues related to DevTools extensions and extensibility       |
 | `Chromium>Platform>DevTools>Recorder`      | Recorder panel                                                |
 | `Chromium>Platform>DevTools>Security`      | Security panel                                                |
 | `Chromium>Platform>DevTools>Sources`       | Sources panel                                                 |
@@ -176,15 +179,15 @@ untriaged issues due to this fact.
 We use the T-Shirt sizes approach to estimate effort for the `Chromium>Platform>DevTools`
 component tree, based on the following guidelines:
 
-| Size | Description                              | Examples                                                                                                                                                      |
-| :--- | :--------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| XXS  | Trivial CSS or logic change              | [Styles bar loses focus in Chrome OS DevTools](http://crbug.com/338348417), [Add 20x CPU throttling preset](https://crbug.com/324978881) |
-| XS   | One CL change                            | [Remove 'Consistent source map variable experiment'](http://crbug.com/40944633), [Autofill tab breaks with phone numbers starting with '+'](https://b.corp.google.com/issues/335409093) |
-| S    | series of CLs or a large CL              | [Local overrides for New Tab Page misses one "/" in folder name](http://crbug.com/328210785), [Memory tool should highlight common problems and opportunities](http://crbug.com/337094903), [Improve the developer experience of using compression dictionaries](http://crbug.com/333756098) |
-| M    | quarter-long single-person project       | [Exceptions in promise constructor should be treated as promise rejection](http://crbug.com/40283985) |
-| L    | multi-quarter or -person project         | [Replace regex-matching in the StylesSidebarPane](http://crbug.com/40945390) |
-| XL   | multi-quarter and -person project        | [MPArch migration](http://crbug.com/40238399), [GM3 adoption](http://crbug.com/40273199) |
-| XXL  | multi-year project with a dedicated team | [Performance Insights](http://crbug.com/40810111) |
+| Size | Description                                 | Examples                                                                                                                                                      |
+| :--- | :------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| XXS  | Small CL                                    | [Styles bar loses focus in Chrome OS DevTools](http://crbug.com/338348417), [Add 20x CPU throttling preset](https://crbug.com/324978881), [Remove 'Consistent source map variable experiment'](http://crbug.com/40944633), [Autofill tab breaks with phone numbers starting with '+'](https://b.corp.google.com/issues/335409093) |
+| XS   | Medium-sized CL or series of trivial CLs    | [Local overrides for New Tab Page misses one "/" in folder name](http://crbug.com/328210785), [Memory tool should highlight common problems and opportunities](http://crbug.com/337094903), [Improve the developer experience of using compression dictionaries](http://crbug.com/333756098) |
+| S    | Large-sized CL or series of non-trivial CLs | [Excluding sensitive data from HARs (HTTP Archives) by default](https://crbug.com/361717594) |
+| M    | quarter-long single-person project          | [Exceptions in promise constructor should be treated as promise rejection](http://crbug.com/40283985) |
+| L    | multi-quarter or -person project            | [Replace regex-matching in the StylesSidebarPane](http://crbug.com/40945390) |
+| XL   | multi-quarter and -person project           | [MPArch migration](http://crbug.com/40238399), [GM3 adoption](http://crbug.com/40273199) |
+| XXL  | multi-year project with a dedicated team    | [Performance Insights](http://crbug.com/40810111) |
 
 ## SLOs
 

package/docs/get_the_code.md

@@ -87,7 +87,10 @@ and a separate CL with a proper roll.
 
 ### Run in a pre-built Chromium
 
-You can run a [build](#Build) of DevTools frontend in a pre-built Chromium in order to avoid the expensive Chromium build. For example, you can use the latest version of Chrome Canary, or the downloaded binary in `third_party/chrome`.
+You can run a [build](#Build) of DevTools frontend in a pre-built Chrome or Chromium in order to avoid the expensive build. Options:
+
+- Use the downloaded Chrome for Testing binary in `third_party/chrome`.
+- Use the latest Chrome Canary. This includes any DevTools features that are only available in regular Chrome builds (`is_official_build` + `is_chrome_branded`), such as GenAI-related features.
 
 #### Running from file system
 

package/docs/policy/README.md

@@ -0,0 +1,6 @@
+# Chromium DevTools Policies
+
+This folder contains the policies relevant to the development of the Chromium
+DevTools.
+
+1. [Chromium DevTools Slow-Close Policy](./slow-close.md)

package/docs/policy/slow-close.md

@@ -0,0 +1,52 @@
+# Chromium DevTools Slow-Close Policy
+
+[goo.gle/devtools-slow-close]
+<small>([go/chrome-devtools:slow-close-policy])</small>
+
+In November 2024, we instituted a slow close policy for Chrome DevTools to
+automatically maintain hygiene of our bug database. We ended up with a list
+of over 1650 open bugs and over 750 open feature requests, some of them going
+back over 10 years, which was not only challenging to maintain, but also made
+it difficult to determine what's relevant and where we should invest our
+resources best.
+
+By automatically nudging and closing stale bugs and feature requests, we can
+reduce this burden, and better communicate to our users what will actually be
+actioned, and hear from them what remains relevant.
+
+[TOC]
+
+## Rules
+
+The criteria for slow close:
+
+- Status: unassigned
+- Type: Bug or Feature Request
+- Created: over 3 years ago
+- Last updated: over 90 days ago
+- Popularity: (cc count + vote count) < 10
+- No open descendants
+
+Googlers can mark issues as exempt from slow close by adding them to the
+[`DevTools-Blintz-Close-Exempt` hotlist](https://issues.chromium.org/hotlists/6459983).
+
+## Process
+
+The automation runs on a daily basis, and performs the following steps:
+
+- Issues that meet the criteria outlined above are added to the
+  [`DevTools-Blintz-Close-Candidate` hotlist](https://issues.chromium.org/hotlists/6459982)
+  for closure.
+- If 14 days have passed and no updates have occurred, the issue will be closed
+  and moved to the
+  [`DevTools-Blintz-Close` hotlist](https://issues.chromium.org/hotlists/6460812)
+  for recording purposes.
+- No more than 25 issues will be updated in a single run.
+
+## Implementation
+
+**(Googlers only)**: This is implemented in [go/chrome-devtools:blintz].
+
+[goo.gle/devtools-slow-close]: http://goo.gle/devtools-slow-close
+[go/chrome-devtools:slow-close-policy]: http://go/chrome-devtools:slow-close-policy
+[go/chrome-devtools:blintz]: http://go/chrome-devtools:blintz

package/docs/styleguide/ux/README.md

@@ -10,6 +10,7 @@ user interface.
 1. [How to organize UI](organizing.md)
 1. [How to style UI](styleguide.md)
 1. [How to write UI text](writing.md)
+1. [How to format numbers](numbers.md)
 1. [Glossary](glossary.md)
 
 ## UI reviews

package/docs/styleguide/ux/numbers.md

@@ -0,0 +1,106 @@
+# How to format numbers
+
+[TOC]
+
+## Checklist
+
+### General
+
+Use [Intl.NumberFormat] consistently for all number formatting within Chrome
+DevTools' UI, including - but not limited to - formatting bytes and times. This
+way we ensure that numbers are formatted the same way throughout the whole UI
+and we don't put the burden of ensuring this level of consistency on the
+translators for the various languages.
+
+### Text length
+
+Pay attention to text length, because the unit portion can be longer in different
+locales, sometimes even longer than 4 characters. Try to alleviate the worse UX
+of strings being too long.
+
+Concretely these locales produces the longest unit strings, so make sure to
+explicitly test for them:
+
+*  `th` (Thai)
+*  `vi` (Vietnamese)
+*  `hi` (Hindi)
+*  `kn` (Kannada)
+*  `ur` (Urdu)
+
+We also suggest to explicitly check `en-US` (English) and `de` (German) locales.
+
+## Examples
+
+### Formatting percentages
+
+Consider the following snippet for formatting percentage values:
+
+```js
+const {locale} = i18n.DevToolsLocale.DevToolsLocale.instance();
+const formatter = new Intl.NumberFormat(locale, {
+  style: 'percent',
+  maximumFractionDigits: 1,
+});
+const formattedValue = formatter.format(percentageValue);
+```
+
+Note that this code will only work after the `DevToolsLocale` has been
+initialized.
+
+### Formatting bytes
+
+Prefer the helper exported by [ByteUtilities.ts] when formatting byte values.
+For example:
+
+```js
+// Formatting bytes
+i18n.ByteUtilities.bytesToString(99);
+
+// Formatting kilobytes
+i18n.ByteUtilities.bytesToString(1234);
+
+// Formatting megabytes
+i18n.ByteUtilities.bytesToString(1500 * 1000);
+```
+
+### Formatting times
+
+Prefer the helpers exported by [time-utilities.ts] when formatting time values.
+For example:
+
+```js
+// Formatting precise milliseconds
+i18n.TimeUtilities.preciseMillisToString(6.12345);
+
+// Formatting milliseconds (lossy)
+i18n.TimeUtilities.millisToString(26500);
+
+// Formatting seconds
+i18n.TimeUtilities.secondsToString(7849);
+```
+
+## Tips
+
+### Defining formatters upfront
+
+Use `defineFormatter()` from the [NumberFormatter.ts] file in order to define
+a formatter upfront. The function has some magic built into such that it defers
+the creation of the underlying `Intl.NumberFormat` instance until the first
+invocation of `format()` or `formatToParts()` methods, and therefore it's safe
+to define the formatters this way without running into the issue that the
+`DevToolsLocale` isn't initialized yet:
+
+```js
+import * as i18n from 'path/to/i18n/i18n.js';
+
+const percentageFormatter = i18n.NumberFormatter.defineFormatter({
+  style: 'percent',
+  maximumFractionDigits: 1,
+});
+```
+
+
+[Intl.NumberFormat]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
+[ByteUtilities.ts]: ../../../front_end/core/i18n/ByteUtilities.ts
+[NumberFormatter.ts]: ../../../front_end/core/i18n/NumberFormatter.ts
+[time-utilities.ts]: ../../../front_end/core/i18n/time-utilities.ts

package/front_end/Images/src/animation.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5 18C6.75 18 6.04514 17.8646 5.38542 17.5938C4.72569 17.3229 4.13194 16.9236 3.60417 16.3958C3.07639 15.8681 2.67708 15.2743 2.40625 14.6146C2.13542 13.9549 2 13.25 2 12.5C2 11.4444 2.27083 10.4757 2.8125 9.59375C3.35417 8.71181 4.10417 8.03472 5.0625 7.5625C5.29861 7.04861 5.63542 6.57292 6.07292 6.13542C6.51042 5.69792 7.00694 5.34028 7.5625 5.0625C8.03472 4.11806 8.71181 3.37153 9.59375 2.82292C10.4757 2.27431 11.4444 2 12.5 2C13.25 2 13.9549 2.13542 14.6146 2.40625C15.2743 2.67708 15.8681 3.07639 16.3958 3.60417C16.9236 4.13194 17.3229 4.72569 17.5938 5.38542C17.8646 6.04514 18 6.75 18 7.5C18 8.56944 17.7326 9.53819 17.1979 10.4063C16.6632 11.2743 15.9097 11.9514 14.9375 12.4375C14.6736 12.9931 14.3229 13.4861 13.8854 13.9167C13.4479 14.3472 12.9653 14.6875 12.4375 14.9375C11.9514 15.8819 11.2674 16.6285 10.3854 17.1771C9.50347 17.7257 8.54167 18 7.5 18ZM7.5 16.5C7.95833 16.5 8.42014 16.4132 8.88542 16.2396C9.35069 16.066 9.76389 15.8194 10.125 15.5C9.36111 15.5278 8.63542 15.3993 7.94792 15.1146C7.26042 14.8299 6.64583 14.4167 6.10417 13.875C5.5625 13.3333 5.15278 12.7222 4.875 12.0417C4.59722 11.3611 4.47222 10.6389 4.5 9.875C4.18056 10.2361 3.93403 10.6493 3.76042 11.1146C3.58681 11.5799 3.5 12.0417 3.5 12.5C3.5 13.0417 3.59722 13.5486 3.79167 14.0208C3.98611 14.4931 4.27778 14.9236 4.66667 15.3125C5.05556 15.7014 5.48958 15.9965 5.96875 16.1979C6.44792 16.3993 6.95833 16.5 7.5 16.5ZM10 14C10.4722 14 10.9375 13.9132 11.3958 13.7396C11.8542 13.566 12.2708 13.3194 12.6458 13C11.8958 13.0278 11.1736 12.9028 10.4792 12.625C9.78472 12.3472 9.15972 11.9306 8.60417 11.375C8.04861 10.8194 7.63542 10.2049 7.36458 9.53125C7.09375 8.85764 6.97222 8.13889 7 7.375C6.68056 7.73611 6.43403 8.14236 6.26042 8.59375C6.08681 9.04514 6 9.51389 6 10C6 10.5417 6.09722 11.0486 6.29167 11.5208C6.48611 11.9931 6.77778 12.4236 7.16667 12.8125C7.55556 13.2014 7.98958 13.4965 8.46875 13.6979C8.94792 13.8993 9.45833 14 10 14ZM12.4375 11.4792C12.6736 11.4792 12.9063 11.4618 13.1354 11.4271C13.3646 11.3924 13.5764 11.3403 13.7708 11.2708C14.0208 10.5347 14.0625 9.80208 13.8958 9.07292C13.7292 8.34375 13.375 7.70833 12.8333 7.16667C12.2917 6.625 11.6563 6.27083 10.9271 6.10417C10.1979 5.9375 9.46528 5.97917 8.72917 6.22917C8.65972 6.42361 8.60764 6.63542 8.57292 6.86458C8.53819 7.09375 8.52083 7.32639 8.52083 7.5625C8.52083 8.07639 8.62153 8.56944 8.82292 9.04167C9.02431 9.51389 9.30556 9.93056 9.66667 10.2917C10.0417 10.6667 10.4722 10.9583 10.9583 11.1667C11.4444 11.375 11.9375 11.4792 12.4375 11.4792ZM15.5 10.125C15.8194 9.77778 16.066 9.375 16.2396 8.91667C16.4132 8.45833 16.5 7.98611 16.5 7.5C16.5 6.97222 16.3993 6.46528 16.1979 5.97917C15.9965 5.49306 15.7014 5.05556 15.3125 4.66667C14.9236 4.27778 14.4931 3.98611 14.0208 3.79167C13.5486 3.59722 13.0417 3.5 12.5 3.5C12.0278 3.5 11.566 3.58681 11.1146 3.76042C10.6632 3.93403 10.25 4.18056 9.875 4.5C10.6667 4.47222 11.3958 4.59375 12.0625 4.86458C12.7292 5.13542 13.3403 5.54861 13.8958 6.10417C14.4514 6.65972 14.8646 7.27083 15.1354 7.9375C15.4063 8.60417 15.5278 9.33333 15.5 10.125Z" fill="black"/>
+</svg>

package/front_end/Images/src/brush-2.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.14583 17.1042C4.52083 17.1042 3.93403 16.9618 3.38542 16.6771C2.83681 16.3924 2.375 16.0069 2 15.5208C2.43056 15.4931 2.79861 15.3333 3.10417 15.0417C3.40972 14.75 3.5625 14.3889 3.5625 13.9583C3.5625 13.2917 3.79271 12.7326 4.25312 12.2812C4.7134 11.8299 5.27243 11.6042 5.93021 11.6042C6.58785 11.6042 7.14236 11.8331 7.59375 12.2908C8.04514 12.7486 8.27083 13.3044 8.27083 13.9583C8.27083 14.8333 7.96875 15.5764 7.36458 16.1875C6.76042 16.7986 6.02083 17.1042 5.14583 17.1042ZM5.14583 15.7083C5.62708 15.7083 6.0391 15.5369 6.38187 15.1942C6.72451 14.8515 6.89583 14.4396 6.89583 13.9583C6.89583 13.6944 6.80208 13.4687 6.61458 13.2812C6.42708 13.0937 6.20139 13 5.9375 13C5.67361 13 5.44792 13.0937 5.26042 13.2812C5.07292 13.4687 4.97917 13.6944 4.97917 13.9583C4.97917 14.2639 4.94444 14.559 4.875 14.8437C4.80556 15.1285 4.67361 15.3819 4.47917 15.6042C4.59028 15.6319 4.70139 15.6562 4.8125 15.6771C4.92361 15.6979 5.03472 15.7083 5.14583 15.7083ZM10.0625 12.1667L7.9375 10.0417L14.5833 3.39583C14.7778 3.20139 15.0139 3.10416 15.2917 3.10416C15.5694 3.10416 15.8056 3.20139 16 3.39583L16.7083 4.10416C16.9028 4.30486 17 4.53909 17 4.80687C17 5.07451 16.9028 5.30555 16.7083 5.5L10.0625 12.1667Z" fill="black"/>
+</svg>

package/front_end/Images/src/cookie_off.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.625 14.5L15.5208 13.3959C15.7958 12.9527 16.0174 12.4773 16.1854 11.9696C16.3535 11.4621 16.4583 10.9306 16.5 10.375C15.875 10.125 15.3542 9.73962 14.9375 9.21879C14.5208 8.69795 14.2569 8.1042 14.1458 7.43754C13.0903 7.28476 12.1944 6.84726 11.4583 6.12504C10.7222 5.40282 10.2847 4.52782 10.1458 3.50004C9.49306 3.45837 8.86458 3.52087 8.26042 3.68754C7.65625 3.8542 7.09028 4.1042 6.5625 4.43754L5.45833 3.33337C6.34722 2.69448 7.32986 2.26045 8.40625 2.03129C9.48264 1.80212 10.5694 1.84726 11.6667 2.1667C11.5556 2.77782 11.5903 3.34031 11.7708 3.8542C11.9514 4.36809 12.2361 4.79518 12.625 5.13545C13.0139 5.47573 13.4861 5.71184 14.0417 5.84379C14.5972 5.97573 15.1875 5.96532 15.8125 5.81254C15.4653 6.6042 15.5174 7.35768 15.9688 8.07295C16.4201 8.78823 17.0833 9.15955 17.9583 9.18691C18.0694 10.1723 18.0035 11.1167 17.7604 12.02C17.5174 12.9234 17.1389 13.75 16.625 14.5ZM6.75 12.5C6.40278 12.5 6.10764 12.3785 5.86458 12.1355C5.62153 11.8924 5.5 11.5973 5.5 11.25C5.5 10.9028 5.62153 10.6077 5.86458 10.3646C6.10764 10.1216 6.40278 10 6.75 10C7.09722 10 7.39236 10.1216 7.63542 10.3646C7.87847 10.6077 8 10.9028 8 11.25C8 11.5973 7.87847 11.8924 7.63542 12.1355C7.39236 12.3785 7.09722 12.5 6.75 12.5ZM15.875 18L14.5 16.625C13.8194 17.0695 13.1007 17.4098 12.3438 17.6459C11.5868 17.882 10.8056 18 10 18C8.8975 18 7.86146 17.7917 6.89188 17.375C5.92229 16.9584 5.07292 16.3855 4.34375 15.6563C3.61458 14.9271 3.04167 14.0777 2.625 13.1082C2.20833 12.1386 2 11.1025 2 10C2 9.19448 2.11806 8.41323 2.35417 7.65629C2.59028 6.89934 2.93056 6.18059 3.375 5.50004L2 4.12504L3.0625 3.06254L16.9375 16.9375L15.875 18ZM10.0023 16.5C10.6119 16.5 11.2014 16.4098 11.7708 16.2292C12.3403 16.0486 12.8889 15.8125 13.4167 15.5209L4.47917 6.58337C4.1875 7.11115 3.95139 7.65976 3.77083 8.2292C3.59028 8.79865 3.5 9.38816 3.5 9.99775C3.5 11.7994 4.13326 13.3336 5.39979 14.6002C6.66646 15.8668 8.20062 16.5 10.0023 16.5Z" fill="black"/>
+</svg>

package/front_end/Images/src/domain.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 17V3H10V6H18V17H2ZM3.5 15.5H5V14H3.5V15.5ZM3.5 12.3333H5V10.8333H3.5V12.3333ZM3.5 9.16667H5V7.66667H3.5V9.16667ZM3.5 6H5V4.5H3.5V6ZM7 15.5H8.5V14H7V15.5ZM7 12.3333H8.5V10.8333H7V12.3333ZM7 9.16667H8.5V7.66667H7V9.16667ZM7 6H8.5V4.5H7V6ZM10 15.5H16.5V7.5H10V9.16667H11.5V10.6667H10V12.3333H11.5V13.8333H10V15.5ZM13.5 10.6667V9.16667H15V10.6667H13.5ZM13.5 13.8333V12.3333H15V13.8333H13.5Z" fill="black"/>
+</svg>

package/front_end/core/common/Color.ts

@@ -2154,12 +2154,12 @@ export class Legacy implements Color {
 
   /**
    * Returns a new color using the NTSC formula for making a RGB color grayscale.
-   * Note: this is ill-defined for colors with alpha, and alpha is not modified.
+   * Note: We override with an alpha of 50% to enhance the dimming effect.
    */
   grayscale(): Legacy {
-    const [r, g, b, a] = this.#rgbaInternal;
+    const [r, g, b] = this.#rgbaInternal;
     const gray = r * 0.299 + g * 0.587 + b * 0.114;
-    return new Legacy([gray, gray, gray, a], Format.RGBA);
+    return new Legacy([gray, gray, gray, 0.5], Format.RGBA);
   }
 
   setAlpha(alpha: number): Legacy {

package/front_end/core/common/SettingRegistration.ts

@@ -74,6 +74,10 @@ const UIStrings = {
    * section allows users to configure which DevTools data is synced via Chrome Sync.
    */
   sync: 'Sync',
+  /**
+   * @description Text for the privacy section of the page.
+   */
+  privacy: 'Privacy',
 };
 const str_ = i18n.i18n.registerUIStrings('core/common/SettingRegistration.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -142,6 +146,7 @@ export const enum SettingCategory {
   EXTENSIONS = 'EXTENSIONS',
   ADORNER = 'ADORNER',
   SYNC = 'SYNC',
+  PRIVACY = 'PRIVACY',
 }
 
 export function getLocalizedSettingsCategory(category: SettingCategory): Platform.UIString.LocalizedString {
@@ -182,6 +187,8 @@ export function getLocalizedSettingsCategory(category: SettingCategory): Platfor
       return i18n.i18n.lockedString('');
     case SettingCategory.SYNC:
       return i18nString(UIStrings.sync);
+    case SettingCategory.PRIVACY:
+      return i18nString(UIStrings.privacy);
   }
 }
 
@@ -302,7 +309,7 @@ export interface SettingRegistration {
  */
 export interface LearnMore {
   tooltip: () => Platform.UIString.LocalizedString;
-  url: Platform.DevToolsPath.UrlString;
+  url?: Platform.DevToolsPath.UrlString;
 }
 
 interface LocalizedSettingExtensionOption {

package/front_end/core/host/AidaClient.ts

@@ -16,11 +16,12 @@ export enum Entity {
 }
 
 export const enum Rating {
+  SENTIMENT_UNSPECIFIED = 'SENTIMENT_UNSPECIFIED',
   POSITIVE = 'POSITIVE',
   NEGATIVE = 'NEGATIVE',
 }
 
-export interface Chunk {
+export interface HistoryChunk {
   text: string;
   entity: Entity;
 }
@@ -64,10 +65,10 @@ export interface AidaRequest {
   input: string;
   preamble?: string;
   // eslint-disable-next-line @typescript-eslint/naming-convention
-  chat_history?: Chunk[];
+  chat_history?: HistoryChunk[];
   client: string;
   options?: {
-    temperature?: Number,
+    temperature?: number,
     // eslint-disable-next-line @typescript-eslint/naming-convention
     model_id?: string,
   };

package/front_end/core/host/InspectorFrontendHost.ts

@@ -429,6 +429,10 @@ export class InspectorFrontendHostStub implements InspectorFrontendHostAPI {
       devToolsPrivacyUI: {
         enabled: false,
       },
+      devToolsEnableOriginBoundCookies: {
+        portBindingEnabled: false,
+        schemeBindingEnabled: false,
+      },
       isOffTheRecord: false,
     };
     if ('hostConfigForTesting' in globalThis) {