chore(eslint): use common config (#382)

.eslintrc.yml

@@ -1,243 +1,2 @@
-parser: babel-eslint # typescript parser is used as an override (see overrides section)
-env:
-    es6: true
-    node: true
-    browser: true
-    jest/globals: true
-parserOptions: # http://eslint.org/docs/user-guide/configuring.html#specifying-parser-options
-    ecmaVersion: 11
-    sourceType: module
-    ecmaFeatures:
-        jsx: true
-settings:
-    react:
-        version: '16.11'
-plugins:
-    - babel
-    - filenames
-    - jest
-    - react
-    - react-hooks
-    - jsx-a11y
-    - testing-library
-    - flowtype
-    - import
-    - '@typescript-eslint'
-    - '@telefonica/eslint-plugin-async-await'
-    - '@telefonica/react-element-interface'
 extends:
-    - 'eslint:recommended'
-rules:
-    # Basic rules
-    default-case: error
-    dot-notation: error
-    eqeqeq: error
-    filenames/match-regex: [error, '^[a-z0-9]+(-[a-z0-9]+)*(\.(config))?$'] # matches: "foo-bar" or "foo-bar.config"
-    new-cap: [error, {newIsCap: true, capIsNew: false}]
-    no-cond-assign: error
-    no-debugger: error
-    no-delete-var: error
-    no-dupe-keys: error
-    no-duplicate-case: error
-    no-empty: error
-    no-eval: error
-    no-extend-native: error
-    no-extra-bind: error
-    no-extra-boolean-cast: error
-    no-fallthrough: error
-    no-implied-eval: error
-    no-inner-declarations: [error, both]
-    no-invalid-regexp: error
-    no-irregular-whitespace: error
-    no-labels: error
-    no-lone-blocks: error
-    no-lonely-if: error
-    no-loop-func: error
-    no-new-func: error
-    no-new-object: error
-    no-new-wrappers: error
-    no-octal: error
-    no-proto: error
-    no-redeclare: error
-    no-return-assign: error
-    no-shadow-restricted-names: error
-    no-sparse-arrays: error
-    no-undef-init: error
-    no-unneeded-ternary: error
-    no-unreachable: error
-    babel/no-unused-expressions: error
-    no-unused-vars: [error, {vars: all, args: after-used, ignoreRestSiblings: true}]
-    no-use-before-define: error
-    no-var: error
-    no-with: error
-    object-shorthand: error
-    prefer-arrow-callback: error
-    prefer-const: error
-    prefer-spread: error
-    strict: [error, global]
-    use-isnan: error
-    valid-typeof: error
-    yoda: error
-
-    # Jest rules. jest/recommended but setting all to error severity to fail in CI
-    jest/no-alias-methods: error
-    jest/no-disabled-tests: error
-    jest/no-focused-tests: error
-    jest/no-identical-title: error
-    jest/no-jest-import: error
-    jest/no-jasmine-globals: error
-    jest/no-test-prefixes: error
-    jest/valid-describe: error
-    jest/valid-expect: error
-    jest/valid-expect-in-promise: error
-    jest/consistent-test-it: [error, {fn: test}] # not included in jest/recommended
-
-    # react testing library
-    testing-library/prefer-screen-queries: error
-    testing-library/prefer-presence-queries: error
-    testing-library/prefer-explicit-assert: error
-    testing-library/no-wait-for-empty-callback: error
-    testing-library/no-manual-cleanup: error
-    testing-library/no-debug: error
-    testing-library/no-dom-import: error
-    testing-library/await-async-utils: error
-    testing-library/await-async-query: error
-    testing-library/no-await-sync-query: error
-    testing-library/prefer-find-by: error
-    testing-library/prefer-wait-for: error
-
-    # react rules
-    react/forbid-dom-props: [error, {forbid: [xmlns]}]
-    react/jsx-fragments: [error, syntax]
-    react/jsx-boolean-value: error
-    react/jsx-curly-brace-presence: [2, {'props': 'never', 'children': 'never'}]
-    react/jsx-no-duplicate-props: error
-    react/jsx-no-undef: error
-    react/jsx-uses-react: error
-    react/jsx-uses-vars: error
-    react/no-danger: error
-    react/no-deprecated: error
-    react/no-direct-mutation-state: error
-    react/no-find-dom-node: error
-    react/no-unknown-property: error
-    react/react-in-jsx-scope: error
-    react-hooks/rules-of-hooks: error
-    react-hooks/exhaustive-deps: [error, {'additionalHooks': 'useIsomorphicLayoutEffect'}]
-    '@telefonica/react-element-interface/params-length': error
-
-    # Accessibility rules: https://github.com/evcohen/eslint-plugin-jsx-a11y/tree/master/docs/rules
-    jsx-a11y/aria-role: error
-    jsx-a11y/aria-props: error
-    jsx-a11y/aria-proptypes: error
-    jsx-a11y/no-access-key: error
-    jsx-a11y/role-has-required-aria-props: error
-    jsx-a11y/tabindex-no-positive: error
-    jsx-a11y/scope: error
-    jsx-a11y/label-has-associated-control: error
-    jsx-a11y/role-supports-aria-props: error
-    jsx-a11y/no-distracting-elements: error
-    jsx-a11y/aria-unsupported-elements: error
-    jsx-a11y/interactive-supports-focus: error
-    jsx-a11y/no-interactive-element-to-noninteractive-role: error
-    jsx-a11y/no-noninteractive-tabindex: error
-    jsx-a11y/heading-has-content: error
-    jsx-a11y/no-redundant-roles: error
-    jsx-a11y/mouse-events-have-key-events: error
-    jsx-a11y/no-onchange: error
-    jsx-a11y/img-redundant-alt: error
-    jsx-a11y/no-noninteractive-element-interactions: error
-    jsx-a11y/no-static-element-interactions: [error, {handlers: [onClick, onKeyPress]}]
-
-    # flow rules
-    flowtype/array-style-complex-type: error
-    flowtype/array-style-simple-type: error
-    flowtype/define-flow-type: error
-    flowtype/no-types-missing-file-annotation: error
-    flowtype/require-valid-file-annotation: [error, never, {annotationStyle: line}]
-    flowtype/use-flow-type: error
-
-    # import rules
-    import/export: error
-    import/no-mutable-exports: error
-    import/no-duplicates: error
-    import/extensions: [error, {js: never, json: always}]
-    import/no-named-default: error
-    import/no-useless-path-segments: error
-    import/no-self-import: error
-
-overrides:
-    # overrides for TypeScript files
-    - files:
-          - '*.tsx'
-      parser: '@typescript-eslint/parser'
-      rules:
-          'flowtype/no-types-missing-file-annotation': off
-          no-unused-vars: off
-          '@typescript-eslint/no-unused-vars':
-              - error
-              - vars: all
-                args: after-used
-                ignoreRestSiblings: true
-          '@typescript-eslint/no-empty-function': off
-          '@typescript-eslint/no-explicit-any': off
-          '@typescript-eslint/ban-ts-comment':
-              - error
-              - ts-expect-error: allow-with-description
-                ts-ignore: true
-                ts-nocheck: true
-                ts-check: false
-          '@typescript-eslint/no-namespace':
-              - error
-              - allowDeclarations: false
-                allowDefinitionFiles: false
-          'no-restricted-syntax':
-              - error
-              - selector: TSEnumDeclaration
-                message: 'enums are not allowed'
-          '@typescript-eslint/prefer-as-const': off # TODO: review this rule and check how flowgen translates "as const" syntax
-          no-use-before-define: off
-          '@typescript-eslint/no-use-before-define': error
-          '@typescript-eslint/explicit-module-boundary-types': error
-      extends:
-          - 'eslint:recommended'
-          - 'plugin:@typescript-eslint/recommended'
-
-    # overrides for Type Tests
-    - files:
-          - '**/__type_tests__/*-type-test.tsx'
-          - '**/__type_tests__/*-type-test.js'
-      rules:
-          'no-unused-vars': off
-          'babel/no-unused-expressions': off
-          '@typescript-eslint/no-unused-vars': off
-
-    # overrides for flow definitions
-    - files:
-          - '*.js.flow'
-      rules:
-          filenames/match-regex: [error, '^[a-z0-9]+(-[a-z0-9]+)*\.js$'] # matches: "foo-bar.js"
-          no-use-before-define: off
-          import/no-duplicates: off
-          no-undef: off
-          no-unused-vars: off
-    - files:
-          - '**/*+(screenshot|acceptance)-test.tsx'
-      rules:
-          '@telefonica/async-await/await-async-methods':
-              [
-                  error,
-                  {
-                      page: ['click', 'type', 'screenshot', 'title', 'close', 'goBack'],
-                      screen:
-                          [
-                              'findByPlaceholderToken',
-                              'findAllByPlaceholderToken',
-                              'findByToken',
-                              'findAllByToken',
-                              'findByLabelToken',
-                              'findAllByLabelToken',
-                              'findByAltToken',
-                              'findAllByAltToken',
-                          ],
-                  },
-              ]
+    - '@telefonica/eslint-config'

.github/actions/audit-accessibility/main.js

@@ -1,5 +1,7 @@
 // @ts-check
 const path = require('path');
+const os = require('os');
+const _ = require('lodash');
 const {execSync} = require('child_process');
 const StaticServer = require('static-server');
 const {AxePuppeteer} = require('@axe-core/puppeteer');
@@ -69,6 +71,8 @@ const startStorybook = () => {
  */
 const audit = async (browser, url) => {
     const page = await browser.newPage();
+    const ua = await browser.userAgent();
+    await page.setUserAgent(`${ua} acceptance-test`);
     await page.goto(url);
     const result = await new AxePuppeteer(page)
         .disableRules([
@@ -214,10 +218,16 @@ const main = async () => {
     const results = [];
 
     const t = Date.now();
-    for (const story of stories) {
-        console.log(story);
-        const result = await audit(browser, getStoryUrl(story));
-        results.push([story, result]);
+    const chunkSize = Math.max(os.cpus().length - 1, 2);
+    const chunks = _.chunk(stories, chunkSize);
+    for (const stories of chunks) {
+        await Promise.all(
+            stories.map(async (story) => {
+                console.log(story);
+                const result = await audit(browser, getStoryUrl(story));
+                results.push([story, result]);
+            })
+        );
     }
 
     processResults(results);

.storybook/welcome-story.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {Text2, Text6, Stack, Box, ResponsiveLayout, useTheme, ButtonLink, TextLink} from '../src';
 import logo from '../img/mistica-react-logo.svg';
 

.swcrc

@@ -6,6 +6,11 @@
         "parser": {
             "syntax": "typescript",
             "tsx": true
+        },
+        "transform": {
+            "react": {
+                "runtime": "automatic"
+            }
         }
     }
-}
+}

flow-defs/credit-card-number-field.js.flow

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from "react";
-import type { CommonFormFieldProps } from "./text-field-base";
 import type { CardOptions } from "./utils/credit-card";
+import type { CommonFormFieldProps } from "./text-field-base";
 declare type CreditCardNumberFieldProps = {
   ...$Exact<CommonFormFieldProps>,
 

flow-defs/nestable-context.js.flow

@@ -15,7 +15,7 @@ declare type NestableContext<Value> = {
   useValue: () => Value,
   useSetValue: (value: Value) => void,
 };
-declare var createNestableContext: <Value: mixed>(
+declare var createNestableContext: <Value>(
   defaultValue: Value
 ) => NestableContext<Value>;
 declare export default typeof createNestableContext;

jest.acceptance.config.js

@@ -1,4 +1,3 @@
-/* eslint-disable filenames/match-regex */
 // For a detailed explanation regarding each configuration property, visit:
 // https://jestjs.io/docs/en/configuration.html
 

jest.base.config.js

@@ -1,4 +1,3 @@
-/* eslint-disable filenames/match-regex */
 const fs = require('fs');
 const swcConfig = JSON.parse(fs.readFileSync(`${__dirname}/.swcrc`, 'utf-8'));
 

jest.unit.config.js

@@ -1,5 +1,3 @@
-/* eslint-disable filenames/match-regex */
-
 module.exports = {
     ...require('./jest.base.config'),
     displayName: 'unit',

package.json

@@ -76,8 +76,7 @@
         "@swc/core": "^1.2.93",
         "@swc/jest": "^0.2.4",
         "@telefonica/acceptance-testing": "^2.5.0",
-        "@telefonica/eslint-plugin-async-await": "^1.1.0",
-        "@telefonica/eslint-plugin-react-element-interface": "^1.0.0",
+        "@telefonica/eslint-config": "^1.0.0",
         "@telefonica/prettier-config": "^1.1.0",
         "@telefonica/ts-to-flow": "1.1.5",
         "@testing-library/jest-dom": "^5.12.0",
@@ -91,24 +90,12 @@
         "@types/react-transition-group": "^4.4.1",
         "@types/rimraf": "^3.0.0",
         "@types/semver-compare": "^1.0.1",
-        "@typescript-eslint/eslint-plugin": "^4.26.0",
-        "@typescript-eslint/parser": "^4.26.0",
         "axe-html-reporter": "^2.2.2",
-        "babel-eslint": "^10.1.0",
         "cpx": "^1.5.0",
         "cross-env": "^7.0.3",
         "detect-port": "^1.3.0",
         "dpdm": "^3.6.1",
         "eslint": "^7.27.0",
-        "eslint-plugin-babel": "^5.3.1",
-        "eslint-plugin-filenames": "^1.3.2",
-        "eslint-plugin-flowtype": "^5.7.2",
-        "eslint-plugin-import": "^2.23.4",
-        "eslint-plugin-jest": "^24.3.6",
-        "eslint-plugin-jsx-a11y": "^6.4.1",
-        "eslint-plugin-react": "^7.24.0",
-        "eslint-plugin-react-hooks": "^4.2.0",
-        "eslint-plugin-testing-library": "^4.6.0",
         "flow-bin": "^0.152.0",
         "flow-typed": "^3.3.1",
         "glob": "^7.1.7",

playroom/themes.tsx

@@ -1,5 +1,6 @@
 import {mediaQueriesConfig} from '../src/theme';
 import * as themes from '../.storybook/themes';
+
 import type {ThemeConfig} from '../src/theme';
 
 const common = {

playroom/use-scope.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import {useScreenSize, useTheme} from '../src';
 import curry from 'lodash/curry';
 

scripts/size-stats/app-test-lib-overhead/src/index-baseline.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import ReactDOM from 'react-dom';
 
 /*

scripts/size-stats/app-test-lib-overhead/src/index.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import ReactDOM from 'react-dom';
 import {ThemeContextProvider, IconTruckFilled, getMovistarSkin} from '@telefonica/mistica';