chrome-devtools-frontend 1.0.1473514 → 1.0.1506453

package/docs/styleguide/ux/components.md

@@ -268,17 +268,20 @@ slider.addEventListener('change', event => onChange(event))
 
 ### Usage
 
-#### Designer guidelines
+#### Design guidelines
 
 Find an exhaustive collection of icons currently used in DevTools [here](https://drive.google.com/corp/drive/folders/1EpmxLRjvdHn5Ia8iT3aicgIEPEvhXY_D?resourcekey=0-QseNsNRsF4w8F5EKz7ncnA)
 
 #### Developer guidelines
 
+For some frequently used icons e.g. cross-circle, warning-filled etc. colors are auto-set in the component. See full list [here](https://source.chromium.org/chromium/chromium/src/+/main:third_party/devtools-frontend/src/front_end/ui/components/icon_button/icon.css;l=47)
+
 ##### Dos and Don'ts
 
 ###### Do
 
-  * Set class and change color and / or size in .css files
+  * Set class and change color in .css files
+  * Set one of the predefined classes to change icon size e.g. extra-small for 12px
 
 ###### Don't
 
@@ -299,3 +302,188 @@ Usage with the imperative API:
 ```js
 const someIcon = IconButton.Icon.create('some-icon-name', 'some-class');
 ```
+
+## Context menus
+
+![Context menu with various simple menu items](images/context-menu-example.png)
+
+Context Menu allows us to display contextual actions to the user, typically triggered by a right-click or via a dedicated menu button.
+
+### General information
+
+#### ContextMenu Class
+
+The primary class for creating and managing context menus.
+It can render as a "soft" menu (custom HTML-based implementation, offering extra functionality like keeping the menu open) or a native menu. The preferred and default way is the native menu, soft menu should ONLY be used in exceptional cases where native menu lacks features.
+Typically instantiated in response to a user event (e.g. contextmenu mouse event).
+
+#### Item Class
+
+Represents an individual entry within a context menu.
+Types:
+  * 'item': A standard clickable menu item.
+  * 'checkbox': An item that can be toggled on or off.
+  * 'separator': A visual line to group related items.
+Items can have labels, handlers, be enabled/disabled. Optionally can also display shortcuts or tooltips (both are exceptions and not recommended).
+
+#### Section Class
+
+Groups related Items within a ContextMenu or SubMenu.
+Helps organize the menu structure and often introduces visual separation.
+Predefined section names (e.g. 'header', 'clipboard', 'default', 'footer') are available on ContextMenu and SubMenu instances.
+
+#### SubMenu Class
+
+A special type of Item that, when clicked or hovered, opens another nested menu.
+SubMenus contain their own Sections and Items, allowing for hierarchical menu structures.
+
+#### MenuButton Component
+
+A custom HTML element (`<devtools-menu-button>`) that renders as a button (currently an icon button only, though we plan to extend it to text buttons too).
+When clicked, it instantiates and displays a ContextMenu.
+Configured via HTML attributes (e.g. `icon-name`, `title`) and a `populateMenuCall` property to define the menu's content.
+
+
+#### Providers
+
+A mechanism to dynamically add context-specific menu items.
+Providers are registered with `ContextMenu.registerProvider()` and are associated with specific object types.
+When a context menu is shown for a particular target object, relevant providers are invoked to append their items.
+
+
+#### Registered Items
+
+A way to add menu items (linked to actions from the `ActionRegistry`) to predefined locations within the DevTools UI (e.g. the main menu, navigator context menus).
+Items are registered using `ContextMenu.registerItem()` with a specific `ItemLocation`.
+
+### Usage
+
+#### Design Guidelines
+
+Generally, we do not recommend using shortcuts in context menus since this goes against Mac platform guidelines and we do not want to have them on some platforms, but not the others. Try to find an alternative solution, however if none is possible and showing shortcuts is critical for a smooth user flow, reach out to kimanh@ or kprokopenko@.
+
+#### Developer guidelines
+
+##### Dos and Don'ts
+
+###### Do
+
+  * Use `new ContextMenu(event, options?)` to create and show menus in response to user interactions (e.g. contextmenu event on an element).
+  * Use `<devtools-menu-button>` to create buttons that should trigger a context menu.
+
+###### Don't
+
+  * Forget to call `contextMenu.show()` after populating the menu; otherwise, it won't open.
+
+##### Developer examples
+
+Usage with lit-html (left-click on a `<devtools-menu-button>` opens a menu):
+
+```js
+html`
+<devtools-menu-button
+  icon-name="some-icon-name"
+  .populateMenuCall=${(menu: UI.ContextMenu.ContextMenu) => {
+    menu.defaultSection().appendItem('Item', () => {
+      console.log('Item clicked');
+    }, {jslogContext: 'item'});
+  }}
+  jslogContext="my-menu-button"
+></devtools-menu-button>
+`
+```
+
+Usage with the imperative API (menu shows on a right-click)
+
+Various simple menu items:
+
+```js
+const element = this.shadowRoot.querySelector('.element-to-add-menu-to');
+element.addEventListener('contextmenu', (event: MouseEvent) => {
+  const contextMenu = new UI.ContextMenu.ContextMenu(event);
+
+// Regular item
+  contextMenu.defaultSection().appendItem('Regular item', () => {
+    console.log('Regular item clicked ');
+  }, { jslogContext: 'regular-item' });
+
+// Disabled item
+  contextMenu.defaultSection().appendItem('Disabled item', () => {
+    console.log('Will not be printed');
+  }, { jslogContext: 'disabled-item',
+       disabled: true });
+
+// Experimental item
+  const item = contextMenu.defaultSection().appendItem('Experimental item', () => {
+    console.log('Experimental item clicked');
+  }, { jslogContext: 'experimental-item',
+       isPreviewFeature: true });
+
+// Separator
+  contextMenu.defaultSection().appendSeparator();
+
+// Checkbox item
+  contextMenu.defaultSection().appendCheckboxItem('Checkbox item', () => {
+    console.log('Checkbox item clicked');
+  }, { checked: true, jslogContext: 'checkbox-item' });
+
+  void contextMenu.show();
+});
+```
+
+Custom section:
+
+```js
+  const customSection = contextMenu.section('Custom section');
+  customSection.appendItem('Section inner item 1', () => { /* ... */ }, {jslogContext: 'my-inner-item-1'});
+
+  customSection.appendItem('Section inner item 2', () => { /* ... */ }, {jslogContext: 'my-inner-item-2'});
+```
+
+Sub menu:
+
+```js
+const subMenu = contextMenu.defaultSection().appendSubMenuItem('Item to open sub menu', /* disabled */ false, 'my-sub-menu');
+subMenu.defaultSection().appendItem('Sub menu inner item 1', () => { /* ... */ }, {jslogContext: 'my-inner-item-1'});
+subMenu.defaultSection().appendItem('Sub menu inner item 2', () => { /* ... */ }, {jslogContext: 'my-inner-item-2'});
+```
+
+Context menu provider registration (adds items dynamically based on the context menu’s target):
+
+```js
+// Define provider
+class MyCustomNodeProvider implements UI.ContextMenu.Provider<SomeTarget|SomeOtherTarget> {
+  appendApplicableItems(event: Event, contextMenu: UI.ContextMenu.ContextMenu, target: SomeTarget|SomeOtherTarget) {
+    if (target instanceof SomeTarget) {
+      contextMenu.defaultSection().appendItem('Item 1', () => {
+        console.log('Item 1 clicked');}, {jsLogContext: 'my-item-1'});
+    } else {
+      contextMenu.defaultSection().appendItem('Item 2', () => {
+        console.log('Item 2 clicked');}, {jsLogContext: 'my-item-2'});
+    }
+  }
+}
+```
+
+```js
+// Register provider
+UI.ContextMenu.registerProvider<SDK.DOMModel.DOMNode>({
+  contextTypes: () => [SomeTarget, SomeOtherTarget],
+  loadProvider: async () => {
+    const myModule = await loadMyModule();
+    return new myModule.MyCustomNodeProvider();
+  },
+  experiment: undefined, // or name of experiment this is behind
+});
+```
+
+Static menu item registration via ItemLocation (adds an action to a predefined menu location):
+
+```js
+UI.ContextMenu.registerItem({
+  location: UI.ContextMenu.ItemLocation.NAVIGATOR_MENU_DEFAULT,
+  actionId: 'quick-open.show',
+  order: undefined,
+});
+```
+This will automatically add the "Open file" action to the context menu that appears when clicking the Elements panel's 3-dot button.

package/docs/styleguide/ux/glossary.md

@@ -4,6 +4,22 @@ To stop mixing terms for UI elements across DevTools UI, its docs, and code, fam
 
 [TOC]
 
+## Main tab bar
+
+The primary tab bar at the top of the DevTools window. It contains the main
+panels, such as **Elements**, **Console**, **Sources**.
+
+You can reorder tabs, and move them between the main tab bar and the **Drawer**.
+
+## Drawer
+
+A container that can be shown or hidden at the bottom or right side of the
+DevTools window. It provides access to additional tools, such as the
+**Console**.
+
+You can toggle the drawer with the `Esc` key and move panels between the main
+tab bar and the drawer.
+
 ## Panel
 
 A top-level tab in the DevTools window, including tabs from the **Drawer**

package/docs/ui_engineering.md

@@ -24,11 +24,17 @@ We should however strive to expose a “HTML-native” API: e.g. toolbar doesn
 
 ## Model-View-Presenter architecture
 
-We should strictly separate business logic, from UI logic and presentation. This means that most of the UI code should be centered around a presenter (subclass of a `UI.Widget`) that gets a view function injected. All the logic that is not related to the DevTools UI (i.e. that would stay the same if we rewrite DevTools as a command-line tool), should belong to the model layer.
+We should strictly separate business logic from UI logic and presentation. This means that most of the UI code should be centered around a presenter (a subclass of `UI.Widget`) that gets a view function injected. All the logic that is not related to the DevTools UI (i.e., that would stay the same if we were to rewrite DevTools as a command-line tool) should belong to the model layer.
 
-The presenter code should make no assumptions about the details of model or view code. It should not care what race conditions CDP exposes or how many layers of `<div class=”wrapper”>` does the markup have. However, for simplicity, the injected view function should have a default implementation inlined with a presenter (see an example below).
+The presenter should make no assumptions about the details of the model or view code. It should not care what race conditions CDP exposes or how many layers of `<div class="wrapper">` the markup has.
 
-In tests, we use a simple stub as a view function, which allows us to test the presenter logic without any DOM manipulation. To test the view function itself we should use screenshot and e2e tests.
+For testability and simplicity, the view function should be injectable into the presenter's constructor. The presenter should also provide a default view. The recommended pattern is to define the default rendering logic in a separate, exported function named `DEFAULT_VIEW`. The presenter's constructor can then use this as the default value for its `view` parameter.
+
+This approach has two main benefits:
+1.  **Testability**: In unit tests, we can pass a simple stub as the view function, which allows us to test the presenter's logic without any DOM manipulation.
+2.  **Clarity**: It cleanly separates the presenter's logic from its rendering logic.
+
+To test the `DEFAULT_VIEW` function itself, we should use screenshot and e2e tests.
 
 ## Declarative and orchestrated DOM updates
 
@@ -38,7 +44,51 @@ To embed another presenter (`UI.Widget`) in the lit-html template, use `<devtool
 
 This will instantiate a `Widget` class with the web component as its `element` and, optionally, will set the properties provided in the second parameter. The widget won’t be re-instantiated on the subsequent template renders, but the properties would be updated. For this to work, the widget needs to accept `HTMLElement` as a sole constructor parameter and properties need to be public members or setters.
 
-For backwards compatibility, the first argument to `widgetConfig` can also be a factory function: `<devtools-widget .widgetConfig=${widgetConfig(element => new MyWidget(foo, bar, element))}>`. Similar to the class constructor version, `element` is the actual `<devtools-widget>` so the following two invocations of `widgetConfig` are equivalent: `widgetConfig(MyWidget)` and `widgetConfig(element = new MyWidget(element))`.
+For backwards compatibility, the first argument to `widgetConfig` can also be a factory function: `<devtools-widget .widgetConfig=${widgetConfig(element => new MyWidget(foo, bar, element))}>`. Similar to the class constructor version, `element` is the actual `<devtools-widget>` so the following two invocations of `widgetConfig` are equivalent: `widgetConfig(MyWidget)` and `widgetConfig(element => new MyWidget(element))`.
+
+## Styling
+To prevent style conflicts in widgets without relying on shadow DOM, we use the CSS [`@scope`](https://developer.mozilla.org/en-US/docs/Web/CSS/@scope) at-rule for style encapsulation. This ensures that styles defined for a widget do not leak out and affect other components.
+
+The convention is to add the `@scope` rule directly into the widget's .css file. The scope's "lower boundary" is set to `(devtools-widget > *)`. This prevents the styles from cascading into the contents of any nested child widgets, while still allowing the parent to style the `<devtools-widget>` element itself.
+
+First, define the styles within an @scope block in your CSS file:
+
+```css
+/* my-widget.css */
+@scope to (devtools-widget > *) {
+  /* Use :scope to style the widget's container element itself. */
+  :scope {
+    width: 100%;
+    box-shadow: none;
+  }
+
+  .title {
+    font-size: 1.2em;
+    color: var(--sys-color-tonal-on-container);
+  }
+}
+```
+
+Then, import and use these styles in your widget's view function:
+```ts
+/* myWidget.ts */
+import {html} from 'lit-html';
+import * as UI from '../../ui/legacy/legacy.js';
+import myWidgetStyles from './myWidget.css.js';
+
+render(html`
+  <style>
+    ${myWidgetStyles}
+  </style>
+  <div class="container">
+    <h3 class="title">My Widget</h3>
+    ...
+    <devtools-widget .widgetConfig=${widgetConfig(NestedWidget)}></devtools-widget>
+  </div>
+`, this.element);
+```
+
+In this example, the `.title` style will apply within the parent widget but will not leak into the nested `<devtools-widget>`. Because this convention relies on developer discipline, it is important to verify its correct application during code reviews.
 
 ## Examples
 
@@ -56,22 +106,33 @@ For backwards compatibility, the first argument to `widgetConfig` can also be a
 ```
 
 ```ts
+type View = (input: ViewInput, output: ViewOutput, target: HTMLElement) => void;
+const DEFAULT_VIEW = (input, output, target) => {
+  render(html`
+    <devtools-widget .widgetConfig=${widgetConfig(MetricsPane, {element: input.element})}>
+    </devtools-widget>
+    <devtools-toolbar>
+      <devtools-filter-input @change=${input.onFilter}></devtools-filter-input>
+      <devtools-checkbox @change=${input.onShowAll}>Show All</devtools-checkbox>
+      <devtools-checkbox @change=${input.onGroup}>Group</devtools-checkbox>
+    </devtools-toolbar>
+    <devtools-tree-outline>
+      ${input.properties.map(p => html`<li>
+        <dt>${p.key}</dt><dd>${renderValue(p.value)}</dd>
+        <ol>${p.subproperties.map(...)}
+        </li>`)}
+    </devtools-tree-outline>
+  `, target);
+};
+
 class StylesPane extends UI.Widget {
-  constructor(element, view = (input, output, target) => {
-    render(html`
-      <devtools-widget .widgetConfig=${widgetConfig(MetricsPane, {element: input.element})}>
-      </devtools-widget>
-      <devtools-toolbar>
-        <devtools-filter-input @change=${input.onFilter}></devtools-filter-input>
-        <devtools-checkbox @change=${input.onShowAll}>Show All</devtools-checkbox>
-        <devtools-checkbox @change=${input.onGroup}>Group</devtools-checkbox>
-      </devtools-toolbar>
-      <devtools-tree-outline>
-        ${input.properties.map(p => html`<li>
-          <dt>${p.key}</dt><dd>${renderValue(p.value)}</dd>
-          <ol>${p.subproperties.map(...)}
-          </li>`)}
-      </devtools-tree-outline>`
+  #view: View;
+  constructor(element, view = DEFAULT_VIEW) {
+    this.#view = view;
+  }
+
+  performUpdate() {
+    this.#view(inputPlaceholder, this.#outputPlaceholder, this.contentElement);
   }
 }
 ```

package/eslint.config.mjs

@@ -25,7 +25,7 @@ export default defineConfig([
     // Don't include third party code
     'third_party/',
 
-    'front_end/diff/diff_match_patch.jD',
+    'front_end/diff/diff_match_patch.js',
     'front_end/models/javascript_metadata/NativeFunctions.js',
     // All of these scripts are auto-generated so don't lint them.
     'front_end/generated/ARIAProperties.js',
@@ -93,7 +93,7 @@ export default defineConfig([
         'single',
         {
           avoidEscape: true,
-          allowTemplateLiterals: false,
+          allowTemplateLiterals: 'always',
         },
       ],
 
@@ -122,7 +122,7 @@ export default defineConfig([
 
       curly: 'error',
       '@stylistic/new-parens': 'error',
-      '@stylistic/func-call-spacing': 'error',
+      '@stylistic/function-call-spacing': 'error',
       '@stylistic/arrow-parens': ['error', 'as-needed'],
       '@stylistic/eol-last': 'error',
       'object-shorthand': ['error', 'properties'],
@@ -287,10 +287,32 @@ export default defineConfig([
       'rulesdir/no-commented-out-import': 'error',
       'rulesdir/check-license-header': 'error',
       /**
-       * Ensures that JS Doc comments are properly aligned - all the starting
-       * `*` are in the right place.
+       * Enforce some consistency and usefulness of JSDoc comments, to make sure
+       * we actually benefit from them.
        */
       'jsdoc/check-alignment': 'error',
+      'jsdoc/check-tag-names': [
+        'error',
+        {
+          definedTags: [
+            'attribute',  // @attribute is used by lit-analyzer (through web-component-analyzer)
+            'meaning',    // @meaning is used by localization
+          ],
+        },
+      ],
+      'jsdoc/empty-tags': 'error',
+      'jsdoc/multiline-blocks': 'error',
+      'jsdoc/no-bad-blocks': 'error',
+      'jsdoc/no-blank-blocks': [
+        'error',
+        {
+          enableFixer: true,
+        },
+      ],
+      'jsdoc/require-asterisk-prefix': 'error',
+      'jsdoc/require-param-name': 'error',
+      'jsdoc/require-hyphen-before-param-description': ['error', 'never'],
+      'jsdoc/sort-tags': 'error',
     },
   },
   {
@@ -563,6 +585,13 @@ export default defineConfig([
           importName: 'Trace',
         },
       ],
+
+      'rulesdir/validate-timing-types': 'error',
+
+      // Disallow redundant (and potentially conflicting) type information
+      // within JSDoc comments.
+      'jsdoc/no-types': 'error',
+      'jsdoc/require-returns-description': 'error',
     },
   },
   {
@@ -633,6 +662,7 @@ export default defineConfig([
         },
       ],
       'rulesdir/enforce-ui-strings-as-const': 'error',
+      'rulesdir/no-new-lit-element-components': 'error',
     },
   },
   {
@@ -662,13 +692,10 @@ export default defineConfig([
     ],
 
     rules: {
-      // errors on it('test') with no body
-      'mocha/no-pending-tests': 'error',
-
       // errors on {describe, it}.only
       'mocha/no-exclusive-tests': 'error',
 
-      'mocha/no-async-describe': 'error',
+      'mocha/no-async-suite': 'error',
       'mocha/no-global-tests': 'error',
       'mocha/no-nested-tests': 'error',
 
@@ -696,7 +723,6 @@ export default defineConfig([
       'rulesdir/no-assert-equal-boolean-null-undefined': 'error',
       'rulesdir/no-imperative-dom-api': 'off',
       'rulesdir/no-lit-render-outside-of-view': 'off',
-      'rulesdir/no-screenshot-test-outside-perf-panel': 'error',
       'rulesdir/prefer-assert-instance-of': 'error',
       'rulesdir/prefer-assert-is-ok': 'error',
       'rulesdir/prefer-assert-length-of': 'error',
@@ -713,27 +739,22 @@ export default defineConfig([
         {
           name: 'describeWithDevtoolsExtension',
           type: 'suite',
-          interfaces: ['BDD', 'TDD'],
+          interface: 'BDD',
         },
         {
           name: 'describeWithEnvironment',
           type: 'suite',
-          interfaces: ['BDD', 'TDD'],
+          interface: 'BDD',
         },
         {
           name: 'describeWithLocale',
           type: 'suite',
-          interfaces: ['BDD', 'TDD'],
+          interface: 'BDD',
         },
         {
           name: 'describeWithMockConnection',
           type: 'suite',
-          interfaces: ['BDD', 'TDD'],
-        },
-        {
-          name: 'itScreenshot',
-          type: 'testCase',
-          interfaces: ['BDD', 'TDD'],
+          interface: 'BDD',
         },
       ],
     },
@@ -783,7 +804,7 @@ export default defineConfig([
     },
   },
   {
-    name: 'Front end component docs',
+    name: 'Front-end component docs',
     files: ['front_end/ui/components/docs/**/*.ts'],
     rules: {
       // This makes the component doc examples very verbose and doesn't add
@@ -798,14 +819,34 @@ export default defineConfig([
     },
   },
   {
-    name: 'Traces import rule',
-    files: ['front_end/models/trace/handlers/**/*.ts'],
+    name: 'Keep models/trace isolated',
+    files: ['front_end/models/trace/**/*.ts'],
+    ignores: ['front_end/models/trace/**/*.test.ts'],
     rules: {
       'rulesdir/no-imports-in-directory': [
         'error',
         {
           bannedImportPaths: [
-            join(import.meta.dirname, 'front_end', 'core', 'sdk', 'sdk.js'),
+            {
+              bannedPath: join(
+                  import.meta.dirname,
+                  'front_end',
+                  'core',
+                  'sdk',
+                  'sdk.js',
+                  ),
+              allowTypeImports: true,
+            },
+            {
+              bannedPath: join(
+                  import.meta.dirname,
+                  'front_end',
+                  'ui',
+                  'legacy',
+                  'legacy.js',
+                  ),
+              allowTypeImports: false,
+            },
           ],
         },
       ],

package/extension-api/ExtensionAPI.d.ts

@@ -95,6 +95,9 @@ export namespace Chrome {
       create(title: string, iconPath: string, pagePath: string, callback?: (panel: ExtensionPanel) => unknown): void;
       openResource(url: string, lineNumber: number, columnNumber?: number, callback?: () => unknown): void;
 
+      setOpenResourceHandler(
+          callback?: (resource: Resource, lineNumber: number, columnNumber: number) => void, scheme?: string): void;
+
       /**
        * Fired when the theme changes in DevTools.
        *

package/extensions/cxx_debugging/CMakeLists.txt

@@ -155,12 +155,6 @@ if(CXX_DEBUGGING_USE_SPLIT_DWARF)
   endif()
 endif()
 
-fix_sysroot(lldb-tblgen)
-fix_sysroot(clang-tblgen)
-fix_sysroot(llvm-tblgen)
-fix_sysroot(llvm-mc)
-fix_sysroot(llvm-dwp)
-
 if (CXX_DEBUGGING_BUILD_WASM)
   add_subdirectory(lib)
   add_subdirectory(src)

package/extensions/cxx_debugging/e2e/MochaRootHooks.ts

@@ -44,7 +44,6 @@ async function beforeAll() {
       `--window-size=${defaultViewport.width + 20, defaultViewport.height + 100}`,
       `--custom-devtools-frontend=${new URL(`${DEVTOOLS_DIR}/front_end`, 'file://').href}`,
       '--disable-features=RenderDocument',
-      '--enable-features=DevToolsVeLogging:testing/true',
     ],
   });
 
@@ -63,6 +62,9 @@ async function beforeAll() {
     throw new Error('Could not find frontend page');
   }
   await frontend.setViewport(defaultViewport);
+  const devToolsVeLogging = {enabled: true, testing: true};
+  await frontend.evaluateOnNewDocument(`globalThis.hostConfigForTesting = ${JSON.stringify({devToolsVeLogging})};`);
+  await frontend.reload();
 
   setBrowserAndPages({frontend, target, browser: conn});
 }

package/extensions/cxx_debugging/e2e/TestDriver.ts

@@ -23,7 +23,6 @@ import {
 } from 'test/e2e/helpers/sources-helpers.js';
 import {
   $$,
-  assertNotNullOrUndefined,
   click,
   clickElement,
   getBrowserAndPages,
@@ -230,7 +229,7 @@ async function readScopeView(scope: string, variable: string[]) {
 async function scrollToLine(lineNumber: number): Promise<void> {
   await waitForFunction(async () => {
     const visibleLines = await $$(CODE_LINE_SELECTOR);
-    assertNotNullOrUndefined(visibleLines[0]);
+    assert.exists(visibleLines[0]);
     const lineNumbers = await Promise.all(visibleLines.map(v => v.evaluate(e => Number(e.textContent ?? ''))));
     if (lineNumbers.includes(lineNumber)) {
       return true;

package/extensions/cxx_debugging/src/GlobMatch.ts

@@ -40,7 +40,7 @@ function globToRegExp(glob: string): RegExp {
  *
  * @param pattern the wildcard pattern
  * @param subject the subject URL to test against
- * @return whether the `subject` matches the given `pattern`.
+ * @returns whether the `subject` matches the given `pattern`.
  */
 export function globMatch(pattern: string, subject: string): boolean {
   const regexp = globToRegExp(pattern);

package/extensions/cxx_debugging/src/ModuleConfiguration.ts

@@ -31,7 +31,7 @@ export type PathSubstitutions = readonly PathSubstitution[];
  * @param pathSubstitutions possible substitutions to apply to the {@param sourcePath}, applies the first match.
  * @param sourcePath the source path as found in the debugging information.
  * @param baseURL the URL of the WebAssembly module, which is used to resolve relative source paths.
- * @return an absolute `file:`-URI or a URL relative to the {@param baseURL}.
+ * @returns an absolute `file:`-URI or a URL relative to the {@param baseURL}.
  */
 export function resolveSourcePathToURL(pathSubstitutions: PathSubstitutions, sourcePath: string, baseURL: URL): URL {
   // Normalize '\' to '/' in sourcePath first.
@@ -93,7 +93,7 @@ export type ModuleConfigurations = readonly ModuleConfiguration[];
  *
  * @param moduleConfigurations list of module configurations to scan.
  * @param moduleName the URL of the module to lookup.
- * @return the matching module configuration or the default fallback.
+ * @returns the matching module configuration or the default fallback.
  */
 export function findModuleConfiguration(
     moduleConfigurations: ModuleConfigurations, moduleURL: URL): ModuleConfiguration {

package/extensions/cxx_debugging/third_party/llvm/README.chromium

@@ -8,6 +8,8 @@ License: Apache 2.0 with LLVM Exceptions
 License File: src/LICENSE.TXT
 Shipped: no
 Security Critical: yes
+Mitigated: CVE-2024-31852
+CVE-2024-31852: The CVE affects codegen in the ARM backend. The extension doesn't codegen and in particular not for ARM.
 Description: The llvm project is a toolkit for the construction of compilers and assorted tools. Contained within is lldb, a debugger for the C language family.
 
 In the DevTools C++ debugging extension, lldb is used as a library to ingest DWARF debug symbols and resolve queries against these symbols, like source line resolution or listing of variables. The library is shipped with the extension, it is not shipped with chrome.

package/extensions/cxx_debugging/tools/bootstrap.py

@@ -57,9 +57,14 @@ def stage1(sysroot_dir, source_dir, OPTIONS):
         os.path.join(OPTIONS.build_dir, 'DevTools_CXX_Debugging.stage1'))
     if not os.path.exists(binary_dir):
         os.makedirs(binary_dir)
+    emscripten_install_dir = os.path.join(devtools_dir(source_dir),
+                                          'third_party',
+                                          'emscripten-releases', 'install')
+    libcxx_dir = os.path.join(emscripten_install_dir, 'lib')
 
     cmake_settings = {
         'build_shared': 'OFF' if OPTIONS.static else 'ON',
+        'libcxx_dir': libcxx_dir,
     }
     cmake_args = [
         OPTIONS.cmake,
@@ -67,6 +72,8 @@ def stage1(sysroot_dir, source_dir, OPTIONS):
         *CMAKE_DEFAULTS,
         '-DBUILD_SHARED_LIBS={build_shared}'.format(**cmake_settings),
         '-DCMAKE_BUILD_TYPE=Release',
+        '-DCMAKE_CXX_FLAGS=-stdlib=libc++ -pthread -I{libcxx_dir}/include/c++/v1'.format(**cmake_settings),
+        '-DCMAKE_EXE_LINKER_FLAGS=-stdlib=libc++ -L{libcxx_dir}'.format(**cmake_settings),
     ]
     if not OPTIONS.no_sysroot:
         cmake_args.extend(('-DCMAKE_FIND_ROOT_PATH_MODE_LIBRARY=ONLY',