chrome-devtools-frontend 1.0.1657110 → 1.0.1660788

package/front_end/panels/console/console-meta.ts

@@ -10,7 +10,7 @@ import type * as Console from './console.js';
 
 const UIStrings = {
   /**
-   * @description Title of the Console tool
+   * @description Title of the Console tool.
    */
   console: 'Console',
   /**
@@ -22,61 +22,61 @@ const UIStrings = {
    */
   toggleConsole: 'Toggle Console',
   /**
-   * @description Text to clear the console
+   * @description Text to clear the console.
    */
   clearConsole: 'Clear console',
   /**
-   * @description Title of an action in the console tool to clear
+   * @description Title of an action in the Console tool to clear.
    */
   clearConsoleHistory: 'Clear console history',
   /**
-   * @description Title of an action in the console tool to create pin. A live expression is code that the user can enter into the console and it will be pinned in the UI. Live expressions are constantly evaluated as the user interacts with the console (hence 'live').
+   * @description Title of an action in the Console tool to create pin. A live expression is code that the user can enter into the Console and it will be pinned in the UI. Live expressions are constantly evaluated as the user interacts with the Console (hence 'live').
    */
   createLiveExpression: 'Create live expression',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
   networkMessages: 'Network messages',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
   hideNetworkMessages: 'Hide network messages',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
   showNetworkMessages: 'Show network messages',
   /**
-   * @description Alternative title text of a setting in Console View of the Console panel
+   * @description Alternative title text of a setting in Console view of the Console panel.
    */
   selectedContextOnly: 'Selected context only',
   /**
-   * @description Tooltip text that appears on the setting when hovering over it in Console View of the Console panel
+   * @description Tooltip text that appears on the setting when hovering over it in Console view of the Console panel.
    */
   onlyShowMessagesFromTheCurrent: 'Only show messages from the current context (`top`, `iframe`, `worker`, extension)',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
   showMessagesFromAllContexts: 'Show messages from all contexts',
   /**
-   * @description Title of a setting under the Console category
+   * @description Title of a setting under the Console category.
    */
   timestamps: 'Timestamps',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
   showTimestamps: 'Show timestamps',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
   hideTimestamps: 'Hide timestamps',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
   autocompleteFromHistory: 'Autocomplete from history',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
-  doNotAutocompleteFromHistory: 'Do not autocomplete from history',
+  doNotAutocompleteFromHistory: 'Don’t autocomplete from history',
   /**
    * @description Title of a setting under the Console category that controls whether to accept autocompletion with Enter.
    */
@@ -84,51 +84,51 @@ const UIStrings = {
   /**
    * @description Title of a setting under the Console category that controls whether to accept autocompletion with Enter.
    */
-  doNotAutocompleteOnEnter: 'Do not accept autocomplete suggestion on Enter',
+  doNotAutocompleteOnEnter: 'Don’t accept autocomplete suggestion on Enter',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
   groupSimilarMessages: 'Group similar messages',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
-  doNotGroupSimilarMessages: 'Don\'t group similar messages',
+  doNotGroupSimilarMessages: 'Don’t group similar messages',
   /**
-   * @description Title of a setting under the Console category in Settings
+   * @description Title of a setting under the Console category in Settings.
    */
   corsErrorsInConsole: 'CORS errors in console',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
   showCorsErrorsInConsole: 'Show CORS errors in console',
   /**
-   * @description Title of an option under the Console category that can be invoked through the Command Menu
+   * @description Title of an option under the Console category that can be invoked through the command menu.
    */
-  doNotShowCorsErrorsIn: 'Don\'t show CORS errors in console',
+  doNotShowCorsErrorsIn: 'Don’t show CORS errors in console',
   /**
-   * @description Title of a setting under the Console category in Settings
+   * @description Title of a setting under the Console category in Settings.
    */
   eagerEvaluation: 'Eager evaluation',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
-  eagerlyEvaluateConsolePromptText: 'Eagerly evaluate console prompt text',
+  eagerlyEvaluateConsolePromptText: 'Eagerly evaluate Console prompt text',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
-  doNotEagerlyEvaluateConsole: 'Do not eagerly evaluate console prompt text',
+  doNotEagerlyEvaluateConsole: 'Don’t eagerly evaluate Console prompt text',
   /**
-   * @description Allows code that is executed in the console to do things that usually are only allowed if triggered by a user action
+   * @description Allows code that is executed in the Console to do things that usually are only allowed if triggered by a user action.
    */
   evaluateTriggersUserActivation: 'Treat code evaluation as user action',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
   treatEvaluationAsUserActivation: 'Treat evaluation as user activation',
   /**
-   * @description Title of a setting under the Console category that can be invoked through the Command Menu
+   * @description Title of a setting under the Console category that can be invoked through the command menu.
    */
-  doNotTreatEvaluationAsUser: 'Do not treat evaluation as user activation',
+  doNotTreatEvaluationAsUser: 'Don’t treat evaluation as user activation',
   /**
    * @description Title of a setting under the Console category in Settings that controls whether `console.trace()` messages appear expanded by default.
    */
@@ -136,7 +136,7 @@ const UIStrings = {
   /**
    * @description Title of a setting under the Console category in Settings that controls whether `console.trace()` messages appear collapsed by default.
    */
-  collapseConsoleTraceMessagesByDefault: 'Do not automatically expand `console.trace()` messages',
+  collapseConsoleTraceMessagesByDefault: 'Don’t automatically expand `console.trace()` messages',
   /**
    * @description Title of a setting under the Console category in Settings that controls whether AI summaries should
    * be shown for console warnings/errors.

package/front_end/panels/console_counters/WarningErrorCounter.ts

@@ -168,8 +168,8 @@ export class WarningErrorCounterWidget extends UI.Widget.Widget {
   }
 
   override async performUpdate(): Promise<void> {
-    const errors = SDK.ConsoleModel.ConsoleModel.allErrors();
-    const warnings = SDK.ConsoleModel.ConsoleModel.allWarnings();
+    const errors = SDK.ConsoleModel.ConsoleModel.allErrors(SDK.TargetManager.TargetManager.instance());
+    const warnings = SDK.ConsoleModel.ConsoleModel.allWarnings(SDK.TargetManager.TargetManager.instance());
     const issuesManager = IssuesManager.IssuesManager.IssuesManager.instance();
     const issues = issuesManager.numberOfIssues();
 

package/front_end/panels/coverage/CoverageListView.ts

@@ -32,56 +32,56 @@ export interface CoverageListItem {
 
 const UIStrings = {
   /**
-   * @description Text that appears on a button for the css resource type filter.
+   * @description Text that appears on a button for the CSS resource type filter.
    */
   css: 'CSS',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
   jsPerFunction: 'JS (per function)',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
   jsPerBlock: 'JS (per block)',
   /**
-   * @description Text for web URLs
+   * @description Text for web URLs.
    */
   url: 'URL',
   /**
-   * @description Text that refers to some types
+   * @description Text that refers to some types.
    */
   type: 'Type',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
-  totalBytes: 'Total Bytes',
+  totalBytes: 'Total bytes',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
-  unusedBytes: 'Unused Bytes',
+  unusedBytes: 'Unused bytes',
   /**
-   * @description Text in the Coverage List View of the Coverage Tab
+   * @description Text in the coverage list view of the Coverage tab.
    */
-  usageVisualization: 'Usage Visualization',
+  usageVisualization: 'Usage visualization',
   /**
-   * @description Data grid name for Coverage data grids
+   * @description Data grid name for Coverage data grids.
    */
-  codeCoverage: 'Code Coverage',
+  codeCoverage: 'Code coverage',
   /**
-   * @description Cell title in Coverage List View of the Coverage tab. The coverage tool tells
-   *developers which functions (logical groups of lines of code) were actually run/executed. If a
-   *function does get run, then it is marked in the UI to indicate that it was covered.
+   * @description Cell title in coverage list view of the Coverage tab. The coverage tool tells
+   * developers which functions (logical groups of lines of code) were actually run/executed. If a
+   * function does get run, then it is marked in the UI to indicate that it was covered.
    */
   jsCoverageWithPerFunction:
-      'JS coverage with per function granularity: Once a function was executed, the whole function is marked as covered.',
+      'JS coverage with per function granularity: once a function was executed, the whole function is marked as covered.',
   /**
-   * @description Cell title in Coverage List View of the Coverage tab. The coverage tool tells
-   *developers which blocks (logical groups of lines of code, smaller than a function) were actually
-   *run/executed. If a block does get run, then it is marked in the UI to indicate that it was
-   *covered.
+   * @description Cell title in coverage list view of the Coverage tab. The coverage tool tells
+   * developers which blocks (logical groups of lines of code, smaller than a function) were actually
+   * run/executed. If a block does get run, then it is marked in the UI to indicate that it was
+   * covered.
    */
   jsCoverageWithPerBlock:
-      'JS coverage with per block granularity: Once a block of JavaScript was executed, that block is marked as covered.',
+      'JS coverage with per block granularity: once a block of JavaScript was executed, that block is marked as covered.',
   /**
    * @description Accessible text for the value in bytes in memory allocation or coverage view.
    */
@@ -94,25 +94,25 @@ const UIStrings = {
   /**
    * @description Tooltip text for the bar in the coverage list view of the coverage tool that illustrates the relation between used and unused bytes.
    * @example {1000} PH1
-   * @example {12.34} PH2
+   * @example {12.34%} PH2
    */
   sBytesSBelongToFunctionsThatHave: '{PH1} bytes ({PH2}) belong to functions that have not (yet) been executed.',
   /**
    * @description Tooltip text for the bar in the coverage list view of the coverage tool that illustrates the relation between used and unused bytes.
    * @example {1000} PH1
-   * @example {12.34} PH2
+   * @example {12.34%} PH2
    */
   sBytesSBelongToBlocksOf: '{PH1} bytes ({PH2}) belong to blocks of JavaScript that have not (yet) been executed.',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    * @example {1000} PH1
-   * @example {12.34} PH2
+   * @example {12.34%} PH2
    */
   sBytesSBelongToFunctionsThatHaveExecuted: '{PH1} bytes ({PH2}) belong to functions that have executed at least once.',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    * @example {1000} PH1
-   * @example {12.34} PH2
+   * @example {12.34%} PH2
    */
   sBytesSBelongToBlocksOfJavascript:
       '{PH1} bytes ({PH2}) belong to blocks of JavaScript that have executed at least once.',

package/front_end/panels/coverage/CoverageModel.ts

@@ -808,7 +808,8 @@ export class URLCoverageInfo extends Common.ObjectWrapper.ObjectWrapper<URLCover
     if (!useFullText) {
       return null;
     }
-    const resource = SDK.ResourceTreeModel.ResourceTreeModel.resourceForURL(url);
+    const resource =
+        SDK.ResourceTreeModel.ResourceTreeModel.resourceForURL(SDK.TargetManager.TargetManager.instance(), url);
     if (!resource) {
       return null;
     }

package/front_end/panels/coverage/CoverageView.ts

@@ -30,91 +30,91 @@ import coverageViewStyles from './coverageView.css.js';
 
 const UIStrings = {
   /**
-   * @description Tooltip in Coverage List View of the Coverage tab for selecting JavaScript coverage mode
+   * @description Tooltip in coverage list view of the Coverage tab for selecting JavaScript coverage mode.
    */
   chooseCoverageGranularityPer:
-      'Choose coverage granularity: Per function has low overhead, per block has significant overhead.',
+      'Choose coverage granularity: per function has low overhead, per block has significant overhead.',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
   perFunction: 'Per function',
   /**
-   * @description Text in Coverage List View of the Coverage tab
+   * @description Text in coverage list view of the Coverage tab.
    */
   perBlock: 'Per block',
   /**
-   * @description Text in Coverage View of the Coverage tab
+   * @description Text in Coverage View of the Coverage tab.
    */
   filterByUrl: 'Filter by URL',
   /**
-   * @description Label for the type filter in the Coverage Panel
+   * @description Label for the type filter in the Coverage panel.
    */
   filterCoverageByType: 'Filter coverage by type',
   /**
-   * @description Text for everything
+   * @description Option in the type filter dropdown of the Coverage panel to show all resource types (both CSS and JavaScript).
    */
   all: 'All',
   /**
-   * @description Text that appears on a button for the css resource type filter.
+   * @description Text that appears on a button for the CSS resource type filter.
    */
   css: 'CSS',
   /**
-   * @description Text in Timeline Tree View of the Performance panel
+   * @description Text in Timeline Tree View of the Performance panel.
    */
   javascript: 'JavaScript',
   /**
-   * @description Tooltip text that appears on the setting when hovering over it in Coverage View of the Coverage tab
+   * @description Tooltip text that appears on the setting when hovering over it in Coverage View of the Coverage tab.
    */
   includeExtensionContentScripts: 'Include extension content scripts',
   /**
-   * @description Title for a type of source files
+   * @description Title for a type of source files.
    */
   contentScripts: 'Content scripts',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    */
   noCoverageData: 'No coverage data',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    */
   reloadPage: 'Reload page',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    */
   startRecording: 'Start recording',
 
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    * @example {Reload page} PH1
    */
-  clickTheReloadButtonSToReloadAnd: 'Click the "{PH1}" button to reload and start capturing coverage.',
+  clickTheReloadButtonSToReloadAnd: 'Click the “{PH1}” button to reload and start capturing coverage.',
   /**
-   * @description Message in Coverage View of the Coverage tab
+   * @description Message in Coverage View of the Coverage tab.
    * @example {Start recording} PH1
    */
-  clickTheRecordButtonSToStart: 'Click the "{PH1}" button to start capturing coverage.',
+  clickTheRecordButtonSToStart: 'Click the “{PH1}” button to start capturing coverage.',
   /**
    * @description Message in the Coverage View explaining that DevTools could not capture coverage.
    */
   bfcacheNoCapture: 'Could not capture coverage info because the page was served from the back/forward cache.',
   /**
-   * @description  Message in the Coverage View explaining that DevTools could not capture coverage.
+   * @description Message in the Coverage View explaining that DevTools could not capture coverage.
    */
   activationNoCapture: 'Could not capture coverage info because the page was prerendered in the background.',
   /**
-   * @description  Message in the Coverage View prompting the user to reload the page.
+   * @description Message in the Coverage View prompting the user to reload the page.
    * @example {reload button icon} PH1
    */
   reloadPrompt: 'Click the reload button {PH1} to reload and get coverage.',
 
   /**
-   * @description Footer message in Coverage View of the Coverage tab
+   * @description Footer message in Coverage View of the Coverage tab.
    * @example {300k used, 600k unused} PH1
    * @example {500k used, 800k unused} PH2
    */
   filteredSTotalS: 'Filtered: {PH1}  Total: {PH2}',
   /**
-   * @description Footer message in Coverage View of the Coverage tab
+   * @description Footer message in Coverage View of the Coverage tab.
    * @example {1.5 MB} PH1
    * @example {2.1 MB} PH2
    * @example {71%} PH3
@@ -636,7 +636,7 @@ export class CoverageView extends UI.Widget.VBox<ShadowRoot> {
   }
 
   async exportReport(): Promise<void> {
-    const fos = new Bindings.FileUtils.FileOutputStream();
+    const fos = new Bindings.FileUtils.FileOutputStream(Workspace.FileManager.FileManager.instance());
     const fileName =
         `Coverage-${Platform.DateUtilities.toISO8601Compact(new Date())}.json` as Platform.DevToolsPath.RawPathString;
     const accepted = await fos.open(fileName);

package/front_end/panels/coverage/coverage-meta.ts

@@ -9,23 +9,23 @@ import type * as Coverage from './coverage.js';
 
 const UIStrings = {
   /**
-   * @description Title of the 'Coverage' tool in the bottom drawer
+   * @description Title of the Coverage tool in the bottom drawer.
    */
   coverage: 'Coverage',
   /**
-   * @description Command for showing the 'Coverage' tool in the bottom drawer
+   * @description Command for showing the Coverage tool in the bottom drawer.
    */
   showCoverage: 'Show Coverage',
   /**
-   * @description Title of an action under the Performance category that can be invoked through the Command Menu
+   * @description Title of an action under the Performance category that can be invoked through the Command Menu.
    */
   instrumentCoverage: 'Instrument coverage',
   /**
-   * @description Title of an action under the Performance category that can be invoked through the Command Menu
+   * @description Title of an action under the Performance category that can be invoked through the Command Menu.
    */
   stopInstrumentingCoverageAndShow: 'Stop instrumenting coverage and show results',
   /**
-   * @description Title of an action in the coverage tool to start with reload
+   * @description Title of an action in the Coverage tool to start with reload.
    */
   startInstrumentingCoverageAnd: 'Start instrumenting coverage and reload page',
   /**

package/front_end/panels/css_overview/CSSOverviewCompletedView.ts

@@ -28,99 +28,99 @@ const {widget} = UI.Widget;
 
 const UIStrings = {
   /**
-   * @description Label for the summary in the CSS overview report
+   * @description Label for the summary in the CSS overview report.
    */
   overviewSummary: 'Overview summary',
   /**
-   * @description Title of colors subsection in the CSS overview panel
+   * @description Title of colors subsection in the CSS overview panel.
    */
   colors: 'Colors',
   /**
-   * @description Title of font info subsection in the CSS overview panel
+   * @description Title of font info subsection in the CSS overview panel.
    */
   fontInfo: 'Font info',
   /**
-   * @description Label to denote unused declarations in the target page
+   * @description Label to denote unused declarations in the target page.
    */
   unusedDeclarations: 'Unused declarations',
   /**
-   * @description Label for the number of media queries in the CSS overview report
+   * @description Label for the number of media queries in the CSS overview report.
    */
   mediaQueries: 'Media queries',
   /**
-   * @description Title of the Elements Panel
+   * @description Title of the Elements panel.
    */
   elements: 'Elements',
   /**
-   * @description Label for the number of External stylesheets in the CSS overview report
+   * @description Label for the number of external stylesheets in the CSS overview report.
    */
   externalStylesheets: 'External stylesheets',
   /**
-   * @description Label for the number of inline style elements in the CSS overview report
+   * @description Label for the number of inline style elements in the CSS overview report.
    */
   inlineStyleElements: 'Inline style elements',
   /**
-   * @description Label for the number of style rules in CSS overview report
+   * @description Label for the number of style rules in CSS overview report.
    */
   styleRules: 'Style rules',
   /**
-   * @description Label for the number of type selectors in the CSS overview report
+   * @description Label for the number of type selectors in the CSS overview report.
    */
   typeSelectors: 'Type selectors',
   /**
-   * @description Label for the number of ID selectors in the CSS overview report
+   * @description Label for the number of ID selectors in the CSS overview report.
    */
   idSelectors: 'ID selectors',
   /**
-   * @description Label for the number of class selectors in the CSS overview report
+   * @description Label for the number of class selectors in the CSS overview report.
    */
   classSelectors: 'Class selectors',
   /**
-   * @description Label for the number of universal selectors in the CSS overview report
+   * @description Label for the number of universal selectors in the CSS overview report.
    */
   universalSelectors: 'Universal selectors',
   /**
-   * @description Label for the number of Attribute selectors in the CSS overview report
+   * @description Label for the number of attribute selectors in the CSS overview report.
    */
   attributeSelectors: 'Attribute selectors',
   /**
-   * @description Label for the number of non-simple selectors in the CSS overview report
+   * @description Label for the number of non-simple selectors in the CSS overview report.
    */
   nonsimpleSelectors: 'Non-simple selectors',
   /**
-   * @description Label for unique background colors in the CSS overview panel
+   * @description Label for unique background colors in the CSS overview panel.
    * @example {32} PH1
    */
   backgroundColorsS: 'Background colors: {PH1}',
   /**
-   * @description Label for unique text colors in the CSS overview panel
+   * @description Label for unique text colors in the CSS overview panel.
    * @example {32} PH1
    */
   textColorsS: 'Text colors: {PH1}',
   /**
-   * @description Label for unique fill colors in the CSS overview panel
+   * @description Label for unique fill colors in the CSS overview panel.
    * @example {32} PH1
    */
   fillColorsS: 'Fill colors: {PH1}',
   /**
-   * @description Label for unique border colors in the CSS overview panel
+   * @description Label for unique border colors in the CSS overview panel.
    * @example {32} PH1
    */
   borderColorsS: 'Border colors: {PH1}',
   /**
-   * @description Label to indicate that there are no fonts in use
+   * @description Label to indicate that no fonts are in use.
    */
-  thereAreNoFonts: 'There are no fonts.',
+  thereAreNoFonts: 'No fonts',
   /**
-   * @description Message to show when no unused declarations in the target page
+   * @description Message to show when no unused declarations are in the target page.
    */
-  thereAreNoUnusedDeclarations: 'There are no unused declarations.',
+  thereAreNoUnusedDeclarations: 'No unused declarations',
   /**
-   * @description Message to show when no media queries are found in the target page
+   * @description Message to show when no media queries are found in the target page.
    */
-  thereAreNoMediaQueries: 'There are no media queries.',
+  thereAreNoMediaQueries: 'No media queries',
   /**
-   * @description Title of the Drawer for contrast issues in the CSS overview panel
+   * @description Title of the drawer for contrast issues in the CSS overview panel.
    */
   contrastIssues: 'Contrast issues',
   /**
@@ -128,43 +128,43 @@ const UIStrings = {
    */
   nOccurrences: '{n, plural, =1 {# occurrence} other {# occurrences}}',
   /**
-   * @description Section header for contrast issues in the CSS overview panel
+   * @description Section header for contrast issues in the CSS overview panel.
    * @example {1} PH1
    */
   contrastIssuesS: 'Contrast issues: {PH1}',
   /**
-   * @description Title of the button for a contrast issue in the CSS overview panel
+   * @description Title of the button for a contrast issue in the CSS overview panel.
    * @example {#333333} PH1
    * @example {#333333} PH2
    * @example {2} PH3
    */
   textColorSOverSBackgroundResults: 'Text color {PH1} over {PH2} background results in low contrast for {PH3} elements',
   /**
-   * @description Label aa text content in Contrast Details of the Color Picker
+   * @description Label aa text content in contrast details of the color picker.
    */
   aa: 'AA',
   /**
-   * @description Label aaa text content in Contrast Details of the Color Picker
+   * @description Label aaa text content in contrast details of the color picker.
    */
   aaa: 'AAA',
   /**
-   * @description Label for the APCA contrast in Color Picker
+   * @description Label for the APCA contrast in color picker.
    */
   apca: 'APCA',
   /**
-   * @description Label for the column in the element list in the CSS overview report
+   * @description Label for the column in the element list in the CSS overview report.
    */
   element: 'Element',
   /**
-   * @description Column header title denoting which declaration is unused
+   * @description Column header title denoting which declaration is unused.
    */
   declaration: 'Declaration',
   /**
-   * @description Text for the source of something
+   * @description Text for the source of something.
    */
   source: 'Source',
   /**
-   * @description Text of a DOM element in Contrast Details of the Color Picker
+   * @description Text of a DOM element in contrast details of the color picker.
    */
   contrastRatio: 'Contrast ratio',
   /**
@@ -172,7 +172,7 @@ const UIStrings = {
    */
   cssOverviewElements: 'CSS overview elements',
   /**
-   * @description Title of the button to show the element in the CSS overview panel
+   * @description Title of the button to show the element in the CSS overview panel.
    */
   showElement: 'Show element',
   /**

package/front_end/panels/css_overview/CSSOverviewProcessingView.ts

@@ -11,7 +11,7 @@ import cssOverviewProcessingViewStyles from './cssOverviewProcessingView.css.js'
 
 const UIStrings = {
   /**
-   * @description Text to cancel something
+   * @description Text to cancel something.
    */
   cancel: 'Cancel',
 } as const;