npm - chrome-devtools-frontend - Versions diffs - 1.0.1538523 → 1.0.1539728 - Mend

chrome-devtools-frontend 1.0.1538523 → 1.0.1539728

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.

Files changed (245) hide show

package/front_end/ui/components/docs/recorder_select_button/basic.html DELETED Viewed

@@ -1,20 +0,0 @@
-<!--
-  Copyright 2023 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width" />
-  <title>Recorder: select button</title>
-</head>
-<body>
-  <div id="container"></div>
-  <script src="./basic.js" type="module"></script>
-</body>
-</html>

package/front_end/ui/components/docs/recorder_select_button/basic.ts DELETED Viewed

@@ -1,81 +0,0 @@
-// Copyright 2023 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as ComponentHelpers from '../../../../../front_end/ui/components/helpers/helpers.js';
-import * as Lit from '../../../../../front_end/ui/lit/lit.js';
-import * as RecorderComponents from '../../../../panels/recorder/components/components.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-const {html} = Lit;
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-const container = document.getElementById('container');
-const throttlingIconUrl = new URL('../../../../panels/recorder/images/throttling_icon.svg', import.meta.url).toString();
-const playIconUrl = new URL('../../../../images/play_icon.svg', import.meta.url).toString();
-const items = [
-  {
-    value: 'performance',
-    label: () => 'Performance panel',
-    buttonIconUrl: throttlingIconUrl,
-  },
-  {
-    value: 'performance_insights',
-    label: () => 'Performance insights panel',
-    buttonIconUrl: throttlingIconUrl,
-  },
-];
-const replayItems = [
-  {
-    value: 'normal',
-    buttonIconUrl: playIconUrl,
-    buttonLabel: () => 'Replay',
-    label: () => 'Normal (Default)',
-  },
-  {value: 'slow', buttonIconUrl: playIconUrl, buttonLabel: () => 'Slow replay', label: (): string => 'Slow'},
-  {
-    value: 'very_slow',
-    buttonIconUrl: playIconUrl,
-    buttonLabel: () => 'Very slow replay',
-    label: () => 'Very slow',
-  },
-  {
-    value: 'extremely_slow',
-    buttonIconUrl: playIconUrl,
-    buttonLabel: () => 'Extremely slow replay',
-    label: () => 'Extremely slow',
-  },
-];
-function litRender(template: Lit.TemplateResult): void {
-  const div = document.createElement('div');
-  div.style.width = '400px';
-  div.style.display = 'flex';
-  div.style.margin = '10px';
-  div.style.flexDirection = 'row-reverse';
-  container?.appendChild(div);
-  Lit.render(template, div);
-}
-litRender(html`
-    <devtools-select-button .items=${items} .value=${items[0].value}></devtools-select-button>`);
-litRender(html`
-    <devtools-select-button .disabled=${true} .items=${items} .value=${items[0].value}>
-    </devtools-select-button>`);
-litRender(html`
-    <devtools-select-button
-      .variant=${RecorderComponents.SelectButton.Variant.OUTLINED}
-      .items=${replayItems}
-      .value=${replayItems[0].value}>
-    </devtools-select-button>`);
-litRender(html`
-    <devtools-select-button
-      .disabled=${true}
-      .variant=${RecorderComponents.SelectButton.Variant.OUTLINED}
-      .items=${replayItems}
-      .value=${replayItems[2].value}>
-    </devtools-select-button>`);

package/front_end/ui/components/docs/recorder_split_view/basic.html DELETED Viewed

@@ -1,17 +0,0 @@
-<!--
-  Copyright 2023 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width" />
-  <title>Recorder: Split View</title>
-</head>
-<body>
-  <div id="container" style="width: 90vw; height: 90vh;"></div>
-  <script src="./basic.js" type="module"></script>
-</body>
-</html>

package/front_end/ui/components/docs/recorder_split_view/basic.ts DELETED Viewed

@@ -1,22 +0,0 @@
-// Copyright 2023 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import '../../../../panels/recorder/components/components.js';
-import * as ComponentHelpers from '../../../../../front_end/ui/components/helpers/helpers.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-(document.getElementById('container') as HTMLElement).innerHTML = `
-    <devtools-split-view>
-        <div slot="main" style="padding: 10px;">
-            Left
-        </div>
-        <div slot="sidebar" style="padding: 10px;">
-            Sidebar
-        </div>
-    </devtools-split-view>
-`;

package/front_end/ui/components/docs/request_link_icon/basic.html DELETED Viewed

@@ -1,31 +0,0 @@
-<!--
-  Copyright 2021 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width" />
-  <title>Basic Request Link Icon example</title>
-  <style>
-    #container {
-      width: 80%;
-      border: 1px solid black;
-      padding: 20px;
-      height: 300px;
-    }
-  </style>
-</head>
-<body>
-  <div id="container">
-  </div>
-  <ul id="events"></ul>
-  <script type="module" src="./basic.js"></script>
-</body>
-</html>

package/front_end/ui/components/docs/request_link_icon/basic.ts DELETED Viewed

@@ -1,21 +0,0 @@
-// Copyright 2021 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-import type * as RequestLinkIconModule from '../../../../ui/components/request_link_icon/request_link_icon.js';
-import * as ComponentHelpers from '../../helpers/helpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-const RequestLinkIcon: typeof RequestLinkIconModule =
-    await import('../../../../ui/components/request_link_icon/request_link_icon.js');
-function appendComponent(data: RequestLinkIconModule.RequestLinkIcon.RequestLinkIconData) {
-  const component = new RequestLinkIcon.RequestLinkIcon.RequestLinkIcon();
-  component.data = data;
-  document.getElementById('container')?.appendChild(component);
-}
-appendComponent({});

package/front_end/ui/components/docs/slider/basic.ts DELETED Viewed

@@ -1,62 +0,0 @@
-// Copyright 2024 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as UI from '../../../legacy/legacy.js';
-import * as ComponentHelpers from '../../helpers/helpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-function sliderExample({min, max, tabIndex, disabled}: {
-  min: number,
-  max: number,
-  tabIndex: number,
-  disabled: boolean,
-}): HTMLElement {
-  const example = document.createElement('div');
-  example.style.marginTop = '20px';
-  const minExplanation = document.createElement('div');
-  const maxExplanation = document.createElement('div');
-  const valueExplanation = document.createElement('div');
-  const disabledExplanation = document.createElement('div');
-  const tabbableExplanation = document.createElement('div');
-  const component = UI.UIUtils.createSlider(min, max, tabIndex);
-  component.disabled = disabled;
-  minExplanation.textContent = `min: ${min}`;
-  maxExplanation.textContent = `max: ${max}`;
-  valueExplanation.textContent = `value: ${component.value}`;
-  disabledExplanation.textContent = `is disabled? ${component.disabled}`;
-  tabbableExplanation.textContent = `is tabbable? ${component.tabIndex >= 0}`;
-  component.addEventListener('change', () => {
-    valueExplanation.textContent = `value: ${component.value}`;
-  });
-  example.appendChild(component);
-  example.appendChild(minExplanation);
-  example.appendChild(maxExplanation);
-  example.appendChild(valueExplanation);
-  example.appendChild(disabledExplanation);
-  example.appendChild(tabbableExplanation);
-  return example;
-}
-function init(): void {
-  const container = document.getElementById('container');
-  if (!container) {
-    return;
-  }
-  container.style.padding = '42px 42px';
-  container.style.margin = '42px 42px';
-  container.style.border = '1px solid rgb(0 0 0 / 20%)';
-  // Basic
-  container.appendChild(sliderExample({min: 0, max: 100, tabIndex: 0, disabled: false}));
-  // Not tab reachable
-  container.appendChild(sliderExample({min: 0, max: 100, tabIndex: -1, disabled: false}));
-  // Disabled
-  container.appendChild(sliderExample({min: 0, max: 100, tabIndex: 0, disabled: true}));
-}
-init();

package/front_end/ui/components/docs/style_property_editor/flex.html DELETED Viewed

@@ -1,21 +0,0 @@
-<!--
-  Copyright 2021 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1" />
-  <title>Basic Flexbox Editor example</title>
-  <style>
-    .container {
-      font-size: 12px;
-    }
-  </style>
-</head>
-<body>
-  <div id="container">
-  </div>
-  <script type="module" src="./flex.js"></script>
-</body>

package/front_end/ui/components/docs/style_property_editor/flex.ts DELETED Viewed

@@ -1,52 +0,0 @@
-// Copyright 2021 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Elements from '../../../../panels/elements/components/components.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-import * as ComponentHelpers from '../../helpers/helpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-const component = new Elements.StylePropertyEditor.FlexboxEditor();
-document.getElementById('container')?.appendChild(component);
-const computedProperties = new Map([
-  ['flex-direction', 'column'],
-  ['flex-wrap', 'nowrap'],
-  ['align-content', 'initial'],
-  ['justify-content', 'flex-end'],
-  ['align-items', 'normal'],
-]);
-const originalComputedProperties = new Map(computedProperties);
-const authoredProperties = new Map([
-  ['flex-direction', 'column'],
-  ['justify-content', 'flex-end'],
-]);
-component.data = {
-  computedProperties,
-  authoredProperties,
-};
-component.addEventListener('propertyselected', (event: Elements.StylePropertyEditor.PropertySelectedEvent) => {
-  authoredProperties.set(event.data.name, event.data.value);
-  computedProperties.set(event.data.name, event.data.value);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});
-component.addEventListener('propertydeselected', (event: Elements.StylePropertyEditor.PropertyDeselectedEvent) => {
-  authoredProperties.delete(event.data.name);
-  computedProperties.set(event.data.name, originalComputedProperties.get(event.data.name) as string);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});

package/front_end/ui/components/docs/style_property_editor/grid.html DELETED Viewed

@@ -1,22 +0,0 @@
-<!--
-  Copyright 2021 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1" />
-  <title>Basic Grid Editor example</title>
-  <style>
-    .container {
-      font-size: 12px;
-    }
-  </style>
-</head>
-<body>
-  <div id="container">
-  </div>
-  <script type="module" src="./grid.js"></script>
-</body>

package/front_end/ui/components/docs/style_property_editor/grid.ts DELETED Viewed

@@ -1,50 +0,0 @@
-// Copyright 2021 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Elements from '../../../../panels/elements/components/components.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-import * as ComponentHelpers from '../../helpers/helpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-const component = new Elements.StylePropertyEditor.GridEditor();
-document.getElementById('container')?.appendChild(component);
-const computedProperties = new Map([
-  ['align-content', 'initial'],
-  ['justify-content', 'flex-end'],
-  ['align-items', 'normal'],
-  ['justify-items', 'normal'],
-]);
-const originalComputedProperties = new Map(computedProperties);
-const authoredProperties = new Map([
-  ['justify-content', 'flex-end'],
-]);
-component.data = {
-  computedProperties,
-  authoredProperties,
-};
-component.addEventListener('propertyselected', (event: Elements.StylePropertyEditor.PropertySelectedEvent) => {
-  authoredProperties.set(event.data.name, event.data.value);
-  computedProperties.set(event.data.name, event.data.value);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});
-component.addEventListener('propertydeselected', (event: Elements.StylePropertyEditor.PropertyDeselectedEvent) => {
-  authoredProperties.delete(event.data.name);
-  computedProperties.set(event.data.name, originalComputedProperties.get(event.data.name) as string);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});

package/front_end/ui/components/docs/style_property_editor/masonry.html DELETED Viewed

@@ -1,21 +0,0 @@
-<!--
-  Copyright 2025 The Chromium Authors
-  Use of this source code is governed by a BSD-style license that can be
-  found in the LICENSE file.
--->
-<!DOCTYPE html>
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width,initial-scale=1" />
-  <title>Basic Masonry Editor example</title>
-  <style>
-    .container {
-      font-size: 12px;
-    }
-  </style>
-</head>
-<body>
-  <div id="container">
-  </div>
-  <script type="module" src="./masonry.js"></script>
-</body>

package/front_end/ui/components/docs/style_property_editor/masonry.ts DELETED Viewed

@@ -1,50 +0,0 @@
-// Copyright 2025 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Elements from '../../../../panels/elements/components/components.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-import * as ComponentHelpers from '../../helpers/helpers.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-const component = new Elements.StylePropertyEditor.MasonryEditor();
-document.getElementById('container')?.appendChild(component);
-const computedProperties = new Map([
-  ['align-content', 'initial'],
-  ['justify-content', 'normal'],
-  ['align-items', 'normal'],
-  ['justify-items', 'normal'],
-]);
-const originalComputedProperties = new Map(computedProperties);
-const authoredProperties = new Map([
-  ['justify-content', 'normal'],
-]);
-component.data = {
-  computedProperties,
-  authoredProperties,
-};
-component.addEventListener('propertyselected', (event: Elements.StylePropertyEditor.PropertySelectedEvent) => {
-  authoredProperties.set(event.data.name, event.data.value);
-  computedProperties.set(event.data.name, event.data.value);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});
-component.addEventListener('propertydeselected', (event: Elements.StylePropertyEditor.PropertyDeselectedEvent) => {
-  authoredProperties.delete(event.data.name);
-  computedProperties.set(event.data.name, originalComputedProperties.get(event.data.name) as string);
-  component.data = {
-    computedProperties,
-    authoredProperties,
-  };
-});

package/front_end/ui/components/docs/switch/basic.ts DELETED Viewed

@@ -1,51 +0,0 @@
-// Copyright 2024 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as ComponentHelpers from '../../helpers/helpers.js';
-import * as Switch from '../../switch/switch.js';
-await ComponentHelpers.ComponentServerSetup.setup();
-function switchExample({checked, disabled}: {checked: boolean, disabled: boolean}): HTMLElement {
-  const example = document.createElement('div');
-  example.style.marginTop = '20px';
-  const explanation = document.createElement('div');
-  const disabledExplanation = document.createElement('div');
-  const component = new Switch.Switch.Switch();
-  component.checked = checked;
-  component.disabled = disabled;
-  explanation.textContent = `is checked? ${component.checked}`;
-  disabledExplanation.textContent = `is disabled? ${component.disabled}`;
-  component.addEventListener(Switch.Switch.SwitchChangeEvent.eventName, ev => {
-    explanation.textContent = `is checked? ${ev.checked}`;
-  });
-  example.appendChild(component);
-  example.appendChild(explanation);
-  example.appendChild(disabledExplanation);
-  return example;
-}
-function init(): void {
-  const container = document.getElementById('container');
-  if (!container) {
-    return;
-  }
-  container.style.padding = '42px 42px';
-  container.style.margin = '42px 42px';
-  container.style.border = '1px solid rgb(0 0 0 / 20%)';
-  // Basic
-  container.appendChild(switchExample({checked: false, disabled: false}));
-  // Already checked
-  container.appendChild(switchExample({checked: true, disabled: false}));
-  // Disabled
-  container.appendChild(switchExample({checked: false, disabled: true}));
-  // Disabled & checked
-  container.appendChild(switchExample({checked: true, disabled: true}));
-}
-init();

/package/front_end/entrypoints/node_app/{nodeConnectionsPanel.css → app/nodeConnectionsPanel.css} RENAMED Viewed

File without changes