chrome-devtools-frontend 1.0.1367881 → 1.0.1376716

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -16,6 +16,15 @@ export const knownContextValues = new Set([
   '-epub-text-transform',
   '-epub-word-break',
   '-epub-writing-mode',
+  '-moz-box-direction',
+  '-moz-box-orient',
+  '-moz-box-sizing',
+  '-moz-osx-font-smoothing',
+  '-moz-text-decoration',
+  '-moz-text-size-adjust',
+  '-ms-flex-direction',
+  '-ms-text-size-adjust',
+  '-ms-touch-action',
   '-webkit-FONT-smoothing',
   '-webkit-align-content',
   '-webkit-align-items',
@@ -143,6 +152,7 @@ export const knownContextValues = new Set([
   '-webkit-shape-outside',
   '-webkit-tap-highlight-color',
   '-webkit-text-combine',
+  '-webkit-text-decoration',
   '-webkit-text-decorations-in-effect',
   '-webkit-text-emphasis',
   '-webkit-text-emphasis-color',
@@ -409,6 +419,7 @@ export const knownContextValues = new Set([
   'auto',
   'auto-adjust-zoom',
   'auto-attach-to-created-pages',
+  'auto-attach-to-created-pages-true',
   'auto-focus-on-debugger-paused-enabled',
   'auto-focus-on-debugger-paused-enabled-false',
   'auto-open-autofill-view-on-event',
@@ -452,6 +463,7 @@ export const knownContextValues = new Set([
   'background-sync',
   'badproperty',
   'bars',
+  'base-64',
   'base-palette',
   'baseline-shift',
   'baseline-source',
@@ -874,6 +886,7 @@ export const knownContextValues = new Set([
   'create-recording-view',
   'credential-id',
   'credentialId',
+  'critical',
   'cs',
   'css',
   'css-angle',
@@ -1084,8 +1097,10 @@ export const knownContextValues = new Set([
   'dragstart',
   'drawer',
   'drawer-view-closeableTabs',
+  'drjones.network-floating-button',
   'drjones.network-panel-context',
   'drjones.performance-panel-context',
+  'drjones.sources-floating-button',
   'drjones.sources-panel-context',
   'drop',
   'duration',
@@ -1179,6 +1194,7 @@ export const knownContextValues = new Set([
   'emulation.capture-full-height-screenshot',
   'emulation.capture-node-screenshot',
   'emulation.capture-screenshot',
+  'emulation.cpu-pressure',
   'emulation.device-height',
   'emulation.device-mode-value',
   'emulation.device-orientation-override',
@@ -1265,6 +1281,7 @@ export const knownContextValues = new Set([
   'extension-view',
   'extremely-slow',
   'fa',
+  'fair',
   'fallback',
   'fallback-font-family',
   'fangsong',
@@ -1381,12 +1398,13 @@ export const knownContextValues = new Set([
   'frames-per-issue',
   'freestyler',
   'freestyler.accordion',
-  'freestyler.clear',
+  'freestyler.delete',
   'freestyler.dogfood-info',
   'freestyler.element-panel-context',
   'freestyler.elements-floating-button',
   'freestyler.feedback',
   'freestyler.help',
+  'freestyler.history',
   'freestyler.new-chat',
   'freestyler.send-feedback',
   'freestyler.settings',
@@ -1678,54 +1696,88 @@ export const knownContextValues = new Set([
   'landscape-right',
   'language',
   'language-af',
+  'language-am',
+  'language-ar',
+  'language-as',
   'language-az',
   'language-be',
   'language-bg',
   'language-bn',
+  'language-bs',
   'language-ca',
   'language-cs',
+  'language-cy',
   'language-da',
   'language-de',
   'language-el',
   'language-en-gb',
+  'language-en-us',
   'language-en-xl',
   'language-es',
   'language-es-419',
+  'language-et',
+  'language-eu',
+  'language-fa',
   'language-fi',
+  'language-fil',
   'language-fr',
   'language-fr-ca',
   'language-gl',
   'language-gu',
   'language-he',
   'language-hi',
+  'language-hr',
+  'language-hu',
+  'language-hy',
   'language-id',
   'language-is',
   'language-it',
   'language-ja',
+  'language-ka',
+  'language-kk',
+  'language-km',
   'language-kn',
   'language-ko',
+  'language-ky',
   'language-lo',
   'language-lt',
   'language-lv',
   'language-mk',
   'language-ml',
   'language-mn',
+  'language-mr',
   'language-ms',
+  'language-my',
+  'language-ne',
   'language-nl',
+  'language-no',
   'language-or',
   'language-pa',
   'language-pl',
+  'language-pt',
   'language-pt-pt',
+  'language-ro',
+  'language-ru',
   'language-si',
   'language-sk',
   'language-sl',
   'language-sq',
+  'language-sr',
+  'language-sr-latn',
   'language-sv',
   'language-sw',
+  'language-ta',
+  'language-te',
+  'language-th',
   'language-tr',
+  'language-uk',
+  'language-ur',
+  'language-uz',
+  'language-vi',
   'language-zh',
   'language-zh-hk',
   'language-zh-tw',
+  'language-zu',
   'large',
   'large-blob',
   'larger',
@@ -2048,6 +2100,7 @@ export const knownContextValues = new Set([
   'network.enable-request-blocking',
   'network.group-by-frame',
   'network.group-by-frame-false',
+  'network.group-by-frame-true',
   'network.hide-request-details',
   'network.initiator-stacktrace',
   'network.remove-all-network-request-blocking-patterns',
@@ -2071,6 +2124,7 @@ export const knownContextValues = new Set([
   'nfc',
   'nl',
   'no',
+  'no-agent-entrypoint',
   'no-override',
   'no-throttling',
   'node',
@@ -2078,6 +2132,7 @@ export const knownContextValues = new Set([
   'node-id',
   'node-removed',
   'nodes',
+  'nominal',
   'none',
   'normal',
   'not-logged-in',
@@ -2102,6 +2157,7 @@ export const knownContextValues = new Set([
   'offset-rotate',
   'offset-x',
   'offset-y',
+  'on',
   'on-shown-without-set-expression',
   'only-3rd-party-requests',
   'only-blocked-requests',
@@ -2113,6 +2169,7 @@ export const knownContextValues = new Set([
   'opacity',
   'open-ai-settings',
   'open-folder',
+  'open-in-animations-panel',
   'open-in-containing-folder',
   'open-in-new-tab',
   'open-link-handler',
@@ -2622,6 +2679,7 @@ export const knownContextValues = new Set([
   'sensors.manage-locations',
   'sensors.reset-device-orientiation',
   'serif',
+  'serious',
   'server',
   'server-timing-api',
   'service-worker-update-on-reload',
@@ -2666,6 +2724,7 @@ export const knownContextValues = new Set([
   'shortcut-panel-switch',
   'shortcuts',
   'show-ad-highlights',
+  'show-ad-highlights-true',
   'show-adorner-settings',
   'show-all-properties',
   'show-as-javascript-object',
@@ -2687,6 +2746,7 @@ export const knownContextValues = new Set([
   'show-grid-areas',
   'show-grid-areas-true',
   'show-grid-line-labels',
+  'show-grid-line-labels-line-names',
   'show-grid-track-sizes',
   'show-grid-track-sizes-true',
   'show-html-comments',
@@ -2965,6 +3025,7 @@ export const knownContextValues = new Set([
   'thumbs-up',
   'time',
   'timeline',
+  'timeline-alternative-navigation',
   'timeline-capture-layers-and-pictures',
   'timeline-capture-selector-stats',
   'timeline-compiled-sources',
@@ -2974,6 +3035,7 @@ export const knownContextValues = new Set([
   'timeline-counters-graph-js-heap-size-used',
   'timeline-counters-graph-nodes',
   'timeline-debug-mode',
+  'timeline-dim-unrelated-events',
   'timeline-disable-js-sampling',
   'timeline-enhanced-traces',
   'timeline-experimental-insights',
@@ -2997,6 +3059,7 @@ export const knownContextValues = new Set([
   'timeline-status',
   'timeline-tree-current-thread',
   'timeline-tree-group-by',
+  'timeline-user-has-opened-sidebar-once',
   'timeline-user-has-opened-siderbar-once',
   'timeline-v8-runtime-call-stats',
   'timeline.animations',
@@ -3013,6 +3076,7 @@ export const knownContextValues = new Set([
   'timeline.annotations.entry-annotation-create',
   'timeline.annotations.entry-label-input',
   'timeline.annotations.time-range-label-input',
+  'timeline.back-to-live-metrics',
   'timeline.breadcrumb-select',
   'timeline.clear',
   'timeline.configure',
@@ -3200,6 +3264,7 @@ export const knownContextValues = new Set([
   'user-valid',
   'user-verification',
   'userHandle',
+  'utf-8',
   'uz',
   'valid',
   'value',
@@ -3225,6 +3290,7 @@ export const knownContextValues = new Set([
   'view-timeline-axis',
   'view-timeline-inset',
   'view-timeline-name',
+  'view-transition-capture-mode',
   'view-transition-class',
   'view-transition-group',
   'view-transition-name',

package/front_end/ui/visual_logging/LoggingDriver.test.ts

@@ -506,6 +506,54 @@ describe('LoggingDriver', () => {
     assert.isFalse(recordChange.calledOnce);
   });
 
+  it('logs state with change of a checkbox', async () => {
+    const recordChange = sinon.stub(
+        Host.InspectorFrontendHost.InspectorFrontendHostInstance,
+        'recordChange',
+    );
+
+    const element = document.createElement('input');
+    element.setAttribute('jslog', 'TreeItem; track: change');
+    element.type = 'checkbox';
+    element.checked = true;
+    renderElementIntoDOM(element);
+    await VisualLoggingTesting.LoggingDriver.startLogging();
+    let logging = expectCall(recordChange);
+    element.dispatchEvent(new Event('change'));
+    let [event] = await logging;
+    assert.strictEqual(event.context, 1530936795);
+
+    element.checked = false;
+    logging = expectCall(recordChange);
+    element.dispatchEvent(new Event('change'));
+    [event] = await logging;
+    assert.strictEqual(event.context, 1936227034);
+  });
+
+  it('logs state with change of a radio', async () => {
+    const recordChange = sinon.stub(
+        Host.InspectorFrontendHost.InspectorFrontendHostInstance,
+        'recordChange',
+    );
+
+    const element = document.createElement('input');
+    element.setAttribute('jslog', 'TreeItem; track: change');
+    element.type = 'radio';
+    element.checked = true;
+    renderElementIntoDOM(element);
+    await VisualLoggingTesting.LoggingDriver.startLogging();
+    let logging = expectCall(recordChange);
+    element.dispatchEvent(new Event('change'));
+    let [event] = await logging;
+    assert.strictEqual(event.context, 1530936795);
+
+    element.checked = false;
+    logging = expectCall(recordChange);
+    element.dispatchEvent(new Event('change'));
+    [event] = await logging;
+    assert.strictEqual(event.context, 1936227034);
+  });
+
   it('logs hover', async () => {
     addLoggableElements();
     await VisualLoggingTesting.LoggingDriver.startLogging({hoverLogThrottler: throttler});
@@ -678,8 +726,7 @@ describe('LoggingDriver', () => {
     assert.deepStrictEqual(recordResize.firstCall.firstArg, {veid: getVeId(element), width: 300, height: 300});
   });
 
-  // Flaky, to be rewritten
-  it.skip('[crbug.com/347520196] throttles resize per element', async () => {
+  it('throttles resize per element', async () => {
     addLoggableElements();
     const element1 = document.getElementById('element') as HTMLElement;
     const element2 = element1.cloneNode() as HTMLElement;
@@ -694,16 +741,16 @@ describe('LoggingDriver', () => {
     await expectCall(throttle, {callCount: 2});
     element2.style.height = '200px';
     await expectCall(throttle, {callCount: 2});
-    element1.style.height = '100px';
+    element1.style.height = '10px';
     await expectCall(throttle, {callCount: 2});
-    element2.style.height = '100px';
+    element2.style.height = '10px';
     const [work] = await expectCall(throttle, {callCount: 2});
 
     assert.isFalse(recordResize.called);
     await work();
     assert.isTrue(recordResize.calledTwice);
-    assert.strictEqual(recordResize.firstCall.firstArg.height, 100);
-    assert.strictEqual(recordResize.lastCall.firstArg.height, 100);
+    assert.strictEqual(recordResize.firstCall.firstArg.height, 10);
+    assert.strictEqual(recordResize.lastCall.firstArg.height, 10);
     assert.notStrictEqual(recordResize.firstCall.firstArg.veid, recordResize.lastCall.firstArg.veid);
   });
 

package/front_end/ui/visual_logging/LoggingDriver.ts

@@ -83,7 +83,7 @@ export async function addDocument(document: Document): Promise<void> {
 }
 
 export async function stopLogging(): Promise<void> {
-  await keyboardLogThrottler.process?.();
+  await keyboardLogThrottler.schedule(async () => {}, Common.Throttler.Scheduling.AS_SOON_AS_POSSIBLE);
   logging = false;
   unregisterAllLoggables();
   for (const document of documents) {
@@ -215,15 +215,15 @@ async function process(): Promise<void> {
           if (!(event instanceof InputEvent)) {
             return;
           }
-          if (loggingState.lastInputEventType && loggingState.lastInputEventType !== event.inputType) {
+          if (loggingState.pendingChangeContext && loggingState.pendingChangeContext !== event.inputType) {
             void logPendingChange(element);
           }
-          loggingState.lastInputEventType = event.inputType;
+          loggingState.pendingChangeContext = event.inputType;
           pendingChange.add(element);
         }, {capture: true});
         element.addEventListener('change', () => logPendingChange(element), {capture: true});
         element.addEventListener('focusout', () => {
-          if (loggingState.lastInputEventType) {
+          if (loggingState.pendingChangeContext) {
             void logPendingChange(element);
           }
         }, {capture: true});
@@ -301,8 +301,11 @@ function logPendingChange(element: Element): void {
   if (!loggingState) {
     return;
   }
+  if (['checkbox', 'radio'].includes((element as HTMLInputElement).type)) {
+    loggingState.pendingChangeContext = (element as HTMLInputElement).checked ? 'on' : 'off';
+  }
   void logChange(element);
-  delete loggingState.lastInputEventType;
+  delete loggingState.pendingChangeContext;
   pendingChange.delete(element);
 }
 

package/front_end/ui/visual_logging/LoggingEvents.test.ts

@@ -24,6 +24,10 @@ describe('LoggingEvents', () => {
     throttler = new Common.Throttler.Throttler(1000000);
   });
 
+  afterEach(async () => {
+    await throttler.schedule(async () => {}, Common.Throttler.Scheduling.AS_SOON_AS_POSSIBLE);
+  });
+
   async function assertThrottled(stub: sinon.SinonStub) {
     await new Promise(resolve => setTimeout(resolve, 0));
     assert.isFalse(stub.called);
@@ -93,7 +97,7 @@ describe('LoggingEvents', () => {
         Host.InspectorFrontendHost.InspectorFrontendHostInstance,
         'recordChange',
     );
-    VisualLogging.LoggingState.getLoggingState(element)!.lastInputEventType = 'instertText';
+    VisualLogging.LoggingState.getLoggingState(element)!.pendingChangeContext = 'instertText';
     await VisualLogging.LoggingEvents.logChange(element);
     assert.isTrue(recordChange.calledOnce);
     assert.deepStrictEqual(recordChange.firstCall.firstArg, {veid, context: 296063892});

package/front_end/ui/visual_logging/LoggingEvents.ts

@@ -88,7 +88,7 @@ export async function logChange(loggable: Loggable): Promise<void> {
   const loggingState = getLoggingState(loggable);
   assertNotNullOrUndefined(loggingState);
   const changeEvent: Host.InspectorFrontendHostAPI.ChangeEvent = {veid: loggingState.veid};
-  const context = loggingState.lastInputEventType;
+  const context = loggingState.pendingChangeContext;
   if (context) {
     changeEvent.context = await contextAsNumber(context);
   }

package/front_end/ui/visual_logging/LoggingState.ts

@@ -13,7 +13,7 @@ export interface LoggingState {
   processedForDebugging?: boolean;
   size: DOMRect;
   selectOpen?: boolean;
-  lastInputEventType?: string;
+  pendingChangeContext?: string;
 }
 
 const state = new WeakMap<Loggable, LoggingState>();

package/package.json

@@ -1,8 +1,6 @@
 {
   "author": "The Chromium Authors",
-  "bugs": {
-    "url": "https://bugs.chromium.org/p/chromium/issues/list?can=2&q=component:Platform%3EDevTools%20&sort=-opened&colspec=ID%20Stars%20Owner%20Summary%20Modified%20Opened"
-  },
+  "bugs": "https://issues.chromium.org/issues?q=status:open componentid:1457055+",
   "description": "Chrome DevTools UI",
   "homepage": "https://devtools.chrome.com",
   "keywords": [
@@ -64,7 +62,7 @@
     "chokidar": "3.5.2",
     "cssnano": "5.1.14",
     "cssnano-preset-lite": "2.1.3",
-    "esbuild": "0.14.13",
+    "esbuild": "0.24.0",
     "escodegen": "2.0.0",
     "eslint": "8.19.0",
     "eslint-plugin-import": "2.25.4",
@@ -89,7 +87,7 @@
     "puppeteer-core": "23.0.2",
     "recast": "0.20.5",
     "rimraf": "3.0.2",
-    "rollup": "2.63.0",
+    "rollup": "2.79.2",
     "rollup-plugin-sourcemaps": "0.6.2",
     "rollup-plugin-terser": "7.0.2",
     "sinon": "18.0.0",
@@ -98,6 +96,7 @@
     "stylelint-config-standard": "24.0.0",
     "svgo": "2.8.0",
     "terser": "5.19.1",
+    "ts-lit-plugin": "2.0.2",
     "typescript": "5.6.2",
     "webidl2": "24.2.2",
     "ws": "8.18.0",
@@ -106,5 +105,5 @@
   "overrides": {
     "ws": "$ws"
   },
-  "version": "1.0.1367881"
+  "version": "1.0.1376716"
 }

package/scripts/build/esbuild.js

@@ -5,12 +5,14 @@
 // @ts-check
 
 const path = require('path');
+const os = require('os');
 
 const devtools_paths = require('../devtools_paths.js');
 const devtools_plugin = require('./devtools_plugin.js');
 
 // esbuild module uses binary in this path.
-process.env.ESBUILD_BINARY_PATH = path.join(devtools_paths.devtoolsRootPath(), 'third_party', 'esbuild', 'esbuild');
+const binaryName = os.type() === 'Windows_NT' ? 'esbuild.exe' : 'esbuild';
+process.env.ESBUILD_BINARY_PATH = path.join(devtools_paths.devtoolsRootPath(), 'third_party', 'esbuild', binaryName);
 
 const entryPoints = [process.argv[2]];
 const outfile = process.argv[3];

package/scripts/devtools_paths.js

@@ -129,6 +129,15 @@ function litAnalyzerExecutablePath() {
   return path.join(nodeModulesPath(), 'lit-analyzer', 'cli.js');
 }
 
+/**
+ * Computes the path to the toplevel `tsconfig.json`.
+ *
+ * @returns the path to the toplevel `tsconfig.json`.
+ */
+function tsconfigJsonPath() {
+  return path.join(devtoolsRootPath(), 'tsconfig.json');
+}
+
 function downloadedChromeBinaryPath() {
   const paths = {
     linux: path.join('chrome-linux', 'chrome'),
@@ -146,5 +155,6 @@ module.exports = {
   mochaExecutablePath,
   stylelintExecutablePath,
   downloadedChromeBinaryPath,
-  litAnalyzerExecutablePath
+  litAnalyzerExecutablePath,
+  tsconfigJsonPath,
 };

package/scripts/eslint_rules/lib/check_test_definitions.js

@@ -47,7 +47,7 @@ module.exports = {
   create: function(context) {
     return {
       MemberExpression(node) {
-        if ((node.object.name === 'it' || node.object.name === 'describe') &&
+        if ((node.object.name === 'it' || node.object.name === 'describe' || node.object.name === 'itScreenshot') &&
             (node.property.name === 'skip' || node.property.name === 'skipOnPlatforms') &&
             node.parent.type === 'CallExpression') {
           const testNameNode = node.property.name === 'skip' ? node.parent.arguments[0] : node.parent.arguments[1];

package/scripts/eslint_rules/tests/check_test_definitions_test.js

@@ -121,6 +121,16 @@ ruleTester.run('check_e2e_tests', rule, {
       filename: 'test/e2e/folder/file.ts',
       errors: [{message: rule.meta.messages.missingBugId}],
     },
+    {
+      code: `describe('e2e-test', async () => {
+        // Explaining comment
+        itScreenshot.skip(\`normal test \${withVariable}\`, async () => {
+        });
+      });
+      `,
+      filename: 'test/e2e/folder/file.ts',
+      errors: [{message: rule.meta.messages.missingBugId}],
+    },
     {
       code: `import {describe, it} from '../../shared/mocha-extensions.js';
 

package/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "./config/typescript/tsconfig.base.json",
   "compilerOptions": {
+    "allowUmdGlobalAccess": true,
     "lib": [
       "esnext",
       "dom",
@@ -9,7 +10,16 @@
       "webworker.iterable"
     ],
     "outDir": "ignored-for-vscode",
-    "allowUmdGlobalAccess": true
+    "plugins": [
+      {
+        "name": "ts-lit-plugin",
+        "rules": {
+          "no-complex-attribute-binding": "off",
+          "no-missing-import": "error",
+          "no-unknown-tag-name": "error"
+        }
+      }
+    ]
   },
   "include": [
     "front_end/",

package/docs/add_uma_metrics.md

@@ -1,41 +0,0 @@
-# How to add UMA metrics in DevTools frontend
-
-Decide on the metric (an [enumerated histogram](https://chromium.googlesource.com/chromium/src/tools/+/HEAD/metrics/histograms/README.md#enum-histograms) or an [action](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/core/host/UserMetrics.ts;l=380) to be logged to generic `DevTools.ActionTaken` histogram)
-
-1. For enumerated histogram (We use this when there are multiple related states that should be analyzed jointly. For example, we might want to know the source of an action like where it is performed from)
-    1. Choose a name for the new histogram prefixed with `DevTools`, for example, `DevTools.ColorPickerOpenedFrom`.
-    2. Decide on the values for the different enums you want to log, for example, `StylesPane` and `SourcesPanel` for `DevTools.ColorPickerOpenedFrom` histogram.
-2. For actions
-    1. Decide on the name of the action, for example, `DeviceModeEnabled`.
-
-## Tracking an enumerated histogram
-
-1. Implement metric collection in devtools-frontend and create a CL. (Example [CL](https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3998783))
-    1. Add the new histogram name to the <code>[EnumeratedHistogram](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/core/host/InspectorFrontendHostAPI.ts;l=351?q=InspectorFrontendHostAPI.ts)</code> enum.
-    2. Add the same histogram name to the EnumeratedHistogram object in <code>[devtools_compatibility.js](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/devtools_compatibility.js;l=396?q=devtools_compatibil)</code> file.
-    3. Create a new function in <code>[UserMetrics.ts](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/core/host/UserMetrics.ts;l=351)</code> with an enum parameter that corresponds to the possible values like <code>colorPickerOpenedFrom(type: ColorPickerOpenedFrom): void</code> that calls <code>InspectorFrontendHostInstance.recordEnumeratedHistogram</code>.
-    4. Call the new function from <code>Host.userMetrics</code> in the places that you want to log the event.
-    5. Create the CL.
-2. Update [histograms.xml](https://source.corp.google.com/h/chromium/chromium/src/+/main:tools/metrics/histograms/metadata/dev/histograms.xml) and [enums.xml](https://source.chromium.org/chromium/chromium/src/+/main:tools/metrics/histograms/enums.xml;l=26267?q=tools%2Fmetrics%2Fhistograms%2Fenums.xml) in the Chromium codebase.
-    1. Add a new enum in [enums.xml](https://source.chromium.org/chromium/chromium/src/+/main:tools/metrics/histograms/enums.xml;l=26267?q=tools%2Fmetrics%2Fhistograms%2Fenums.xml) with values corresponding to the values in the frontend with name <code>DevTools&lt;HISTOGRAM_NAME></code> and make sure that enum values 1-1 map to the values you’ve defined in the frontend.
-    2. Add the new histogram definition in [histograms.xml](https://source.corp.google.com/h/chromium/chromium/src/+/main:tools/metrics/histograms/metadata/dev/histograms.xml) and set enum name to be the enum you've defined in the 1st step. Make sure that histogram name is the same with the name you've used in the frontend change.
-    3. Create the CL.
-
-## Tracking an action
-
-1. Implement metric collection in devtools-frontend and create a CL. (Example [CL](https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3998783))
-    1. Add the action you want to track to the <code>[Action](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/core/host/UserMetrics.ts;l=379)</code> enum in <code>UserMetrics.ts.</code>
-    2. Call <code>Host.userMetrics.actionTaken(Action.YOUR_ACTION)</code> in the places you want to the event.
-    3. Create the CL.
-2. Update enums in the Chromium side in <code>[tools/metrics/histograms/enums.xml](https://source.chromium.org/chromium/chromium/src/+/main:tools/metrics/histograms/enums.xml;l=26267?q=tools%2Fmetrics%2Fhistograms%2Fenums.xml)</code>.
-    1. Add the new action to the <code>DevToolsAction</code> enum.
-    2. Create the CL.
-
-
-## Metrics Dashboard
-
-After the both CLs are landed we expect your histogram or action data to be available in [UMA](http://uma/p/chrome/timeline_v2). For seeing them:
-
-*   Select the channel you want to dive into.
-*   Select the platforms you are interested in (for us, it is Linux, MacOS, Windows, ChromeOS and Lacros)
-*   Add the metric you want to see: either the histogram name you’ve newly added `DevTools.ColorPickerOpenedFrom` or the generic histogram for action tracking, `DevTools.ActionTaken`.

package/docs/uma_metrics.md

@@ -1,23 +0,0 @@
-# UMA metrics in DevTools frontend
-
-(Googlers only) Generally, the histogram or action data is available in the Timeline category of the [UMA](http://uma/) page.
-
-*   Select the channel you want to dive into.
-*   Select the platforms you are interested in (for us, it is Linux, MacOS, Windows, ChromeOS and Lacros)
-*   Add the metric you want to see, for example the generic histogram for action tracking, `DevTools.ActionTaken`.
-
-## General histograms
-
-* `DevTools.ActionTaken` is a generic histogram for tracking actions performed via the DevTools front-end.
-* `DevTools.PanelShown` counts how often a given panel or tab is shown in the DevTools front-end.
-
-## Histograms for the Workspaces feature
-
-* `DevTools.ActionTaken` records `AddFileSystemToWorkspace` (_Add Filesystem to Workspace_), `RemoveFileSystemFromWorkspace`
-  (_Remove Filesystem from Workspace_) and `FileSystemSourceSelected` (_Filesystem source selected_) according to developer
-  interactions with the _Filesystem_ tab in the _Sources_ panels sidebar.
-* `DevTools.Workspaces.PopulateWallClockTime` records the wall clock time in milliseconds elapsed while populating a project
-  folder in the workspace.
-* `DevTools.SidebarPaneShown` records the `navigator-files` (_Sources - Filesystem_) enum whenever the _Filesystem_ tab is
-  revealed in the _Sources_ panels sidebar.
-