chrome-devtools-frontend 1.0.1386602 → 1.0.1402249

package/front_end/ui/lit-html/static.ts

@@ -1,127 +0,0 @@
-// Copyright 2021 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-import * as i18n from '../../core/i18n/i18n.js';
-import type * as I18n from '../../third_party/i18n/i18n.js';
-import * as Lit from '../../third_party/lit/lit.js';
-
-export interface Static {
-  value: unknown;
-  $$static$$: true;
-}
-
-type TemplateValues = Static|unknown;
-type FlattenedTemplateValues = {
-  strings: TemplateStringsArray,
-  valueMap: boolean[],
-};
-
-export function flattenTemplate(strings: TemplateStringsArray, ...values: TemplateValues[]): FlattenedTemplateValues {
-  const valueMap: boolean[] = [];
-  const newStrings: string[] = [];
-
-  // Start with an empty buffer and start running over the values.
-  let buffer = '';
-  for (let v = 0; v < values.length; v++) {
-    const possibleStatic = values[v];
-    if (isStaticLiteral(possibleStatic)) {
-      // If this is a static literal, add the current string plus the
-      // static literal's value to the buffer.
-      buffer += strings[v] + possibleStatic.value;
-
-      // Filter this value in future invocations.
-      valueMap.push(false);
-    } else {
-      // If we reach a non-static value, push what we have on to
-      // the new strings array, and reset the buffer.
-      buffer += strings[v];
-      newStrings.push(buffer);
-      buffer = '';
-
-      // Include this value in future invocations.
-      valueMap.push(true);
-    }
-  }
-
-  // Since the strings length is always the values length + 1, we need
-  // to append whatever that final string is to whatever is left in the
-  // buffer, and flush both out to the newStrings.
-  newStrings.push(buffer + strings[values.length]);
-  (newStrings as unknown as {raw: readonly string[]}).raw = [...newStrings];
-  return {strings: newStrings as unknown as TemplateStringsArray, valueMap};
-}
-
-export function html(strings: TemplateStringsArray, ...values: TemplateValues[]): Lit.TemplateResult {
-  const staticValues = values.filter(value => isStaticLiteral(value));
-  if (staticValues.length) {
-    const key = staticValues.map(v => v.value as string).join(' ');
-    return htmlWithStatics(strings, values, key);
-  }
-
-  return Lit.html(strings, ...values);
-}
-
-export function literal(value: TemplateStringsArray): Static {
-  return {
-    value: value[0],
-    $$static$$: true,
-  };
-}
-
-function isStaticLiteral(item: TemplateValues|unknown): item is Static {
-  return typeof item === 'object' && (item !== null && '$$static$$' in item);
-}
-
-// While this is a WeakMap, that doesn't help because TemplateStringsArray are objects in a global registry
-// managed by the V8 runtime. They are never garbage collected.
-// We use a double-keyed cache in order to support dynamically changing the static literal: for example,
-// within a loop that dynamically selects what custom component to render.
-const flattenedTemplates = new WeakMap<TemplateStringsArray, Map<string, FlattenedTemplateValues>>();
-
-function htmlWithStatics(
-    strings: TemplateStringsArray, values: TemplateValues[], staticValuesKey: string): Lit.TemplateResult {
-  // Check to see if we've already converted this before.
-  // Cache key is the TemplateStringsArray, which works because the same usage of template string reuses the same array object.
-  // See: https://tc39.es/ecma262/multipage/ecmascript-language-expressions.html#sec-gettemplateobject
-  //      13.2.8.4 GetTemplateObject, step 3.
-  let flattened;
-  let secondaryMap = flattenedTemplates.get(strings);
-  if (!secondaryMap) {
-    secondaryMap = new Map();
-    flattenedTemplates.set(strings, secondaryMap);
-  }
-
-  flattened = secondaryMap.get(staticValuesKey);
-  if (!flattened) {
-    flattened = flattenTemplate(strings, ...values);
-    secondaryMap.set(staticValuesKey, flattened);
-  }
-
-  // Pass through to Lit.
-  const filteredValues = values.filter((_, index) => flattened.valueMap[index]);
-  return Lit.html(flattened.strings, ...filteredValues);
-}
-
-/**
- * @param placeholders placeholders must not contain localized strings or other localized templates as that is
- * incompatible with languages using a different sentence structure or ordering (e.g., RTL).
- */
-export function i18nTemplate(
-    registeredStrings: I18n.LocalizedStringSet.RegisteredFileStrings, stringId: string,
-    placeholders: Record<string, Lit.TemplateResult|string>): Lit.TemplateResult {
-  const formatter = registeredStrings.getLocalizedStringSetFor(i18n.DevToolsLocale.DevToolsLocale.instance().locale)
-                        .getMessageFormatterFor(stringId);
-  let result = html``;
-  for (const icuElement of formatter.getAst()) {
-    if (icuElement.type === /* argumentElement */ 1) {
-      const placeholderValue = placeholders[icuElement.value];
-      if (placeholderValue) {
-        result = html`${result}${placeholderValue}`;
-      }
-    } else if ('value' in icuElement) {
-      result = html`${result}${icuElement.value}`;
-    }
-  }
-  return result;
-}

package/scripts/.eslintrc.js

@@ -1,9 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-module.exports = {
-  rules : {
-    'no-console' : 'off',
-  }
-};

package/scripts/eslint_rules/lib/compare_arrays_with_assert_deepequal.js

@@ -1,60 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-/**
- * @fileoverview Rule to ensure array comparisons are checked with `assert.deepEqual`
- * @author Tim van der Lippe
- */
-'use strict';
-
-const VALID_DEEP_COMPARISON_METHODS = new Set([
-  'deepEqual', 'deepStrictEqual', 'sameMembers', 'sameDeepMembers', 'includeMembers', 'containsAllKeys', 'hasAllKeys'
-]);
-
-// ------------------------------------------------------------------------------
-// Rule Definition
-// ------------------------------------------------------------------------------
-
-module.exports = {
-  meta: {
-    type: 'problem',
-
-    docs: {
-      description: 'Compare arrays with `assert.deepEqual`',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      MemberExpression(node) {
-        if (node.object.name !== 'assert') {
-          return;
-        }
-        // Any existing usage of `deepEqual` or similar APIs is already fine
-        if (VALID_DEEP_COMPARISON_METHODS.has(node.property.name)) {
-          return;
-        }
-        // Should not happen, but here to code defensively
-        if (node.parent.type !== 'CallExpression') {
-          return;
-        }
-        // `assert.isDefined(someValue)`
-        if (node.parent.arguments.length < 2) {
-          return;
-        }
-        // `assert.equal(someResult, expectedValue)`
-        const expectedValue = node.parent.arguments[1];
-        if (expectedValue.type === 'ArrayExpression') {
-          context.report({
-            node,
-            message:
-                'Use assert.deepEqual (or similar assertion method that performs deep comparisons) to compare arrays'
-          });
-        }
-      }
-    };
-  }
-};

package/scripts/eslint_rules/lib/lit_no_style_interpolation.js

@@ -1,80 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-'use strict';
-
-const {isLitHtmlTemplateCall} = require('./utils.js');
-
-function countOccurencesOfSubstring(string, subString) {
-  let count = 0;
-  let i = string.indexOf(subString);
-  while (i > -1) {
-    count++;
-    i = string.indexOf(subString, i + 1);
-  }
-
-  return count;
-}
-
-function nodeHasStyleTagsWithInterpolation(taggedTemplateExpression) {
-  const STYLE_START = '<style>';
-  const STYLE_END = '</style>';
-
-  const templateParts = taggedTemplateExpression.quasi.quasis;
-  for (const part of templateParts) {
-    const valueOfPart = part.value.raw;
-    /**
-     * We take the tagged template part and look for the same number of opening
-     * <style> blocks as there are closing ones. This might seem like overkill
-     * but consider this LitHtml call:
-     * LitHtml.html`<style>div{}</style><style>p * { color: ${RED}; }</style>`
-     *
-     * Whose first template part in the AST is:
-     * "<style>div{}</style><style>"
-     *
-     * If we base our check just on having a
-     * <style> and a </style> tag, this code will pass, because the first part
-     * does have those. We need to make sure the amount of opening and closing
-     * <style> tags lines up.
-     *
-     */
-    const styleOpeningTagCount = countOccurencesOfSubstring(valueOfPart, STYLE_START);
-    const styleClosingTagCount = countOccurencesOfSubstring(valueOfPart, STYLE_END);
-
-    if (styleClosingTagCount !== styleOpeningTagCount) {
-      return true;
-    }
-  }
-  return false;
-}
-
-module.exports = {
-  meta: {
-    type: 'problem',
-
-    docs: {
-      description: 'ensure no interpolation in Lit style tags',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      TaggedTemplateExpression(node) {
-        const isLitHtmlCall = isLitHtmlTemplateCall(node);
-        if (!isLitHtmlCall) {
-          return;
-        }
-
-        if (nodeHasStyleTagsWithInterpolation(node)) {
-          context.report({
-            node,
-            message:
-                '<style> tag must not have data interpolated into it. Use CSS custom properties if you need to share data between CSS and JS in a component.'
-          });
-        }
-      },
-    };
-  }
-};

package/scripts/eslint_rules/lib/migrate_create_shadow_root_with_styles.js

@@ -1,110 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-'use strict';
-
-const path = require('path');
-const fs = require('fs');
-
-function lookForCSSFileProperty(node) {
-  for (let i = 0; i < node.length; i++) {
-    const propertyNode = node[i];
-    if (propertyNode.key.name === 'cssFile') {
-      return propertyNode;
-    }
-  }
-  return null;
-}
-
-function updateGRDFile(cssFilePath) {
-  if (process.env.ESLINT_SKIP_GRD_UPDATE) {
-    return;
-  }
-
-  const contents = fs.readFileSync('config/gni/devtools_grd_files.gni', 'utf-8').split('\n').map(c => c.trim());
-  const newGRDFileEntry = JSON.stringify(`front_end/${cssFilePath}.js`) + ',';
-  if (contents.includes(newGRDFileEntry)) {
-    return;
-  }
-
-  const index = contents.findIndex(line => line.includes('.css.js'));
-  contents.splice(index, 0, newGRDFileEntry);
-  const finalContents = contents.join('\n');
-  fs.writeFileSync('config/gni/devtools_grd_files.gni', finalContents, 'utf-8');
-}
-
-module.exports = {
-  meta: {
-    type: 'problem',
-
-    docs: {
-      description: 'Checks wasShown() method definitions call super.wasShown();',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      CallExpression(node) {
-        if (node.type === 'CallExpression' && node.callee &&
-            (node.callee.name === 'createShadowRootWithCoreStyles' ||
-             (node.callee.property && node.callee.property.name === 'createShadowRootWithCoreStyles'))) {
-          try {
-            /* Construct 'import componentStyles form './componentStyles.css.js'' statement */
-            const options = node.arguments[1];
-            const propertyNode = lookForCSSFileProperty(options.properties);
-
-            if (propertyNode && propertyNode.value.type === 'Literal') {
-              const filenameWithExtension = propertyNode.value.value.replace(/\\/g, '/');
-              const filename = path.basename(filenameWithExtension, '.css');
-              const newFileName = filename + 'Styles';
-
-              const importDir = 'front_end/' + path.dirname(filenameWithExtension);
-              const fileDir = path.dirname(context.getFilename());
-              const relativeImport = path.relative(fileDir, importDir).replace(/\\/g, '/');
-              const importStatement = relativeImport === '' ?
-                  `import ${newFileName} from \'./${filename}.css.js\';\n` :
-                  `import ${newFileName} from \'${relativeImport}/${filename}.css.js\';\n`;
-
-              const programNode = context.getAncestors()[0];
-              const sourceCode = context.getSourceCode().getText();
-
-              if (sourceCode.includes(importStatement)) {
-                // File is already imported so does not need to be imported or added to devtools_grd_files again.
-                context.report({
-                  node,
-                  message: 'Import CSS file instead of passing a string into createShadowRootWithStyles',
-                  fix(fixer) {
-                    return [fixer.replaceText(propertyNode.value, `[${newFileName}]`)];
-                  }
-                });
-
-                return;
-              }
-
-              context.report({
-                node,
-                message: 'Import CSS file instead of passing a string into createShadowRootWithStyles',
-                fix(fixer) {
-                  return [
-                    fixer.insertTextBefore(programNode, importStatement),
-                    fixer.replaceText(propertyNode.value, `[${newFileName}]`)
-                  ];
-                }
-              });
-              updateGRDFile(filenameWithExtension);
-            }
-
-          } catch (error) {
-            context.report({
-              node,
-              message: `Please manually migrate this file. Got error: ${error.message}`,
-            });
-          }
-        }
-      }
-    };
-  }
-};

package/scripts/eslint_rules/lib/migrate_register_required_css.js

@@ -1,240 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-'use strict';
-
-const path = require('path');
-const fs = require('fs');
-
-function lookForParentClassBodyNode(node) {
-  if (!node.parent) {
-    /**
-     * If there is no parent node, we didn't find the class for the call to registerRequiredCSS.
-     * We will catch this null with a try catch and ask the file to be migrated manually.
-     **/
-
-    return null;
-  }
-
-  if (node.type === 'ClassBody') {
-    /**
-     * We have found the node that is the body of the class and where we need to add a wasShown method. */
-    return node;
-  }
-
-  return lookForParentClassBodyNode(node.parent);
-}
-
-function lookForWasShownMethod(node) {
-  for (const methodDefinition of node.body) {
-    if (methodDefinition.key.name === 'wasShown') {
-      return methodDefinition;
-    }
-  }
-  /**
-   * If we did not find a wasShown method then we can return null and insert it ourselves.
-   **/
-  return null;
-}
-
-function lookForRegisterCSSFilesCall(node, privatePropertyName) {
-  for (const expressionStatement of node.body) {
-    if (expressionStatement.expression && expressionStatement.expression.callee &&
-        expressionStatement.expression.callee.property.name === 'registerCSSFiles') {
-      /**
-       * Once we find a registerCSSFiles call in wasShown(), we need to check that the objects they are being called on the same. If the call is
-       * a `this.registerCSSFiles()` then privatePropertyName is ''. Otherwise, we check that the privatePropertyName is the same as the one we are
-       * calling registerCSSFiles() on.
-       **/
-      if (privatePropertyName === '') {
-        // We are looking for a this.registerRequiredCSS here
-        if (expressionStatement.expression.callee.object.type === 'ThisExpression') {
-          return expressionStatement.expression;
-        }
-      }
-
-      // This checks for a this._widget.registerRequiredCSS here
-      if (expressionStatement.expression.callee.object.type === 'MemberExpression' &&
-          expressionStatement.expression.callee.object.property.name === privatePropertyName) {
-        return expressionStatement.expression;
-      }
-    }
-  }
-  return null;
-}
-
-function updateGRDFile(cssFilePath) {
-  if (process.env.ESLINT_SKIP_GRD_UPDATE) {
-    return;
-  }
-
-  const contents = fs.readFileSync('config/gni/devtools_grd_files.gni', 'utf-8').split('\n').map(c => c.trim());
-  const newGRDFileEntry = JSON.stringify(`front_end/${cssFilePath}.js`) + ',';
-  if (contents.includes(newGRDFileEntry)) {
-    return;
-  }
-
-  const index = contents.findIndex(line => line.includes('.css.js'));
-  contents.splice(index, 0, newGRDFileEntry);
-  const finalContents = contents.join('\n');
-  fs.writeFileSync('config/gni/devtools_grd_files.gni', finalContents, 'utf-8');
-}
-
-module.exports = {
-  meta: {
-    type: 'problem',
-
-    docs: {
-      description: 'Checks wasShown() method definitions call super.wasShown();',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      ExpressionStatement(node) {
-        if (node.expression.type === 'CallExpression' && node.expression.callee.object &&
-            (node.expression.callee.object.type === 'ThisExpression' ||
-             node.expression.callee.object.type === 'MemberExpression') &&
-            node.expression.callee.property.name === 'registerRequiredCSS') {
-          /* Construct 'import componentStyles form './componentStyles.css.js'' statement */
-          const filenameWithExtension = node.expression.arguments[0].value;
-          const filename = path.basename(filenameWithExtension, '.css');
-          const newFileName = filename + 'Styles';
-
-          const importDir = 'front_end/' + path.dirname(filenameWithExtension);
-          const fileDir = path.dirname(context.getFilename());
-          const relativeImport = path.relative(fileDir, importDir).replace(/\\/g, '/');
-          const importStatement = relativeImport === '' ?
-              `import ${newFileName} from \'./${filename}.css.js\';\n` :
-              `import ${newFileName} from \'${relativeImport}/${filename}.css.js\';\n`;
-
-          const programNode = context.getAncestors()[0];
-          const containsImport = context.getSourceCode().getText().includes(importStatement);
-
-          /* Some calls are this._widget.registerRequiredCSS() so we need to store the private property that the function is called on. */
-          const privateProperty = node.expression.callee.object.type === 'MemberExpression';
-          const privatePropertyName = privateProperty ? node.expression.callee.object.property.name : '';
-
-          try {
-            const classBodyNode = lookForParentClassBodyNode(node);
-
-            const registerCSSFilesText =
-                `\n    this.${privateProperty ? privatePropertyName + '.' : ''}registerCSSFiles([${newFileName}]);`;
-
-            const wasShownFunction = lookForWasShownMethod(classBodyNode);
-            if (wasShownFunction) {
-              const registerCSSFilesCall =
-                  lookForRegisterCSSFilesCall(wasShownFunction.value.body, privatePropertyName);
-              if (registerCSSFilesCall) {
-                /*
-                 * If a wasShown() method exists and there is already a call to registerCSSFiles on the
-                 * appropriate property or object then we add a new argument to the call.
-                 */
-
-                const firstArg = registerCSSFilesCall.arguments[0].elements[0];
-
-                if (containsImport) {
-                  // File is already imported so does not need another import statement or to be added to devtools_grd_files
-                  context.report({
-                    node,
-                    message: 'Import CSS file instead of using registerRequiredCSS and edit wasShown method',
-                    fix(fixer) {
-                      return [fixer.insertTextBefore(firstArg, newFileName + ', '), fixer.remove(node)];
-                    }
-                  });
-
-                  return;
-                }
-
-                context.report({
-                  node,
-                  message: 'Import CSS file instead of using registerRequiredCSS and edit wasShown method',
-                  fix(fixer) {
-                    return [
-                      fixer.insertTextBefore(programNode, importStatement),
-                      fixer.insertTextBefore(firstArg, newFileName + ', '), fixer.remove(node)
-                    ];
-                  }
-                });
-
-                updateGRDFile(filenameWithExtension);
-                return;
-              }
-
-              /* If a wasShown() method exists then it adds the registerCSSFiles() to the second line. */
-              if (containsImport) {
-                // File is already imported so does not need another import statement or to be added to devtools_grd_files
-                context.report({
-                  node,
-                  message: 'Import CSS file instead of using registerRequiredCSS and edit wasShown method',
-                  fix(fixer) {
-                    return [
-                      fixer.insertTextAfter(wasShownFunction.value.body.body[0], registerCSSFilesText),
-                      fixer.remove(node)
-                    ];
-                  }
-                });
-
-                return;
-              }
-
-              context.report({
-                node,
-                message: 'Import CSS file instead of using registerRequiredCSS and edit wasShown method',
-                fix(fixer) {
-                  return [
-                    fixer.insertTextBefore(programNode, importStatement),
-                    fixer.insertTextAfter(wasShownFunction.value.body.body[0], registerCSSFilesText), fixer.remove(node)
-                  ];
-                }
-              });
-
-              updateGRDFile(filenameWithExtension);
-              return;
-            }
-
-            /* wasShown method does not exist and has to be added as the last method in the class. */
-            const lastMethodDeclarationNode = classBodyNode.body[classBodyNode.body.length - 1];
-            const wasShownText = `\n  wasShown(): void {
-    super.wasShown();${registerCSSFilesText}\n  }`;
-
-            if (containsImport) {
-              context.report({
-                node,
-                message: 'Import CSS file instead of using registerRequiredCSS and add wasShown method',
-                fix(fixer) {
-                  return [fixer.insertTextAfter(lastMethodDeclarationNode, wasShownText), fixer.remove(node)];
-                }
-              });
-
-              return;
-            }
-
-            context.report({
-              node,
-              message: 'Import CSS file instead of using registerRequiredCSS and add wasShown method',
-              fix(fixer) {
-                return [
-                  fixer.insertTextBefore(programNode, importStatement),
-                  fixer.insertTextAfter(lastMethodDeclarationNode, wasShownText), fixer.remove(node)
-                ];
-              }
-            });
-
-            updateGRDFile(filenameWithExtension);
-          } catch (error) {
-            /* Any errors will be expected to be migrated manually. */
-            context.report({
-              node,
-              message: `Please manually migrate ${
-                  filenameWithExtension} as it has edge cases not covered by this script. Got error: ${error.message}.`,
-            });
-          }
-        }
-      }
-    };
-  }
-};

package/scripts/eslint_rules/lib/no_repeated_tests.js

@@ -1,30 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-/**
- * @fileoverview Rule to check that .repeat() is not used in mocha tests
- * @author Peter Marshall
- */
-'use strict';
-
-module.exports = {
-  meta: {
-    type: 'problem',
-    docs: {
-      description: 'usage of .repeat() in mocha tests',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      MemberExpression(node) {
-        if (node.object.name === 'it' && node.property.name === 'repeat' && node.parent.type === 'CallExpression') {
-          context.report({node, message: 'Unexpected repeated mocha test'});
-        }
-      }
-    };
-  }
-};

package/scripts/eslint_rules/lib/prefer_readonly_keyword.js

@@ -1,27 +0,0 @@
-// Copyright 2020 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-'use strict';
-
-module.exports = {
-  meta: {
-    type: 'problem',
-
-    docs: {
-      description: 'enforce usage of readonly rather than the ReadonlyArray helper',
-      category: 'Possible Errors',
-    },
-    fixable: 'code',
-    schema: []  // no options
-  },
-  create: function(context) {
-    return {
-      TSTypeReference(node) {
-        if (node.typeName.type === 'Identifier' && node.typeName.name === 'ReadonlyArray') {
-          context.report({node, message: 'Prefer the readonly keyword over the ReadonlyArray type.'});
-        }
-      },
-    };
-  }
-};