fix @types (#9523)

.eslintrc.cjs

@@ -0,0 +1,75 @@
+/** @type {import('eslint').Linter.Config} */
+const config = {
+    root: true,
+    parser: '@typescript-eslint/parser',
+    plugins: ['@typescript-eslint', 'unicorn', 'import'],
+    extends: ['eslint:recommended'],
+    env: {
+        node: true,
+        es6: true,
+    },
+    parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: 'module',
+    },
+    rules: {
+        quotes: ['error', 'single', { avoidEscape: true }],
+        camelcase: ['error', { properties: 'never' }],
+        semi: ['error', 'never'],
+        indent: [2, 4],
+        eqeqeq: ['error', 'always'],
+
+        'prefer-const': 'error',
+        'no-multiple-empty-lines': [2, { max: 1, maxEOF: 1 }],
+        'array-bracket-spacing': ['error', 'never'],
+        'brace-style': ['error', '1tbs', { allowSingleLine: true }],
+        'comma-spacing': ['error', { before: false, after: true }],
+        'no-lonely-if': 'error',
+        'dot-notation': 'error',
+        'no-else-return': 'error',
+        'no-tabs': 'error',
+        'no-trailing-spaces': [
+            'error',
+            {
+                skipBlankLines: false,
+                ignoreComments: false,
+            },
+        ],
+        'no-var': 'error',
+        'unicode-bom': ['error', 'never'],
+        curly: ['error', 'all'],
+        'object-curly-spacing': ['error', 'always'],
+        'keyword-spacing': ['error'],
+        'require-atomic-updates': 0,
+        'linebreak-style': ['error', 'unix'],
+        'unicorn/prefer-node-protocol': ['error'],
+        'import/extensions': ['error', 'ignorePackages'],
+        'no-restricted-syntax': [
+            'error',
+            'IfStatement > ExpressionStatement > AssignmentExpression',
+        ],
+        'unicorn/prefer-ternary': 'error',
+    },
+    overrides: [
+        {
+            files: ['*.ts'],
+            rules: {
+                // see https://stackoverflow.com/questions/55280555/typescript-eslint-eslint-plugin-error-route-is-defined-but-never-used-no-un
+                'no-unused-vars': 'off',
+                '@typescript-eslint/no-unused-vars': 'error',
+                '@typescript-eslint/consistent-type-imports': 'error',
+                'no-undef': 'off',
+                // allow overloads
+                'no-redeclare': 'off',
+            },
+        },
+        {
+            files: ['*.test.ts'],
+            rules: {
+                'dot-notation': 'off',
+            },
+        },
+    ],
+}
+
+module.exports = config

.eslintrc.js

@@ -1,65 +0,0 @@
-module.exports = {
-    root: true,
-    parser: '@typescript-eslint/parser',
-    plugins: ['@typescript-eslint', 'unicorn', 'import'],
-    extends: [
-        'eslint:recommended'
-    ],
-    env: {
-        node: true,
-        es6: true
-    },
-    parserOptions: {
-        ecmaVersion: 2020,
-        sourceType: 'module'
-    },
-    rules: {
-        quotes: ['error', 'single', { avoidEscape: true }],
-        camelcase: ['error', { properties: 'never' }],
-        semi: ['error', 'never'],
-        indent: [2, 4],
-        eqeqeq: ['error', 'always'],
-
-        'prefer-const': 'error',
-        'no-multiple-empty-lines': [2, { 'max': 1, 'maxEOF': 1 }],
-        'array-bracket-spacing': ['error', 'never'],
-        'brace-style': ['error', '1tbs', { allowSingleLine: true }],
-        'comma-spacing': ['error', { before: false, after: true }],
-        'no-lonely-if': 'error',
-        'dot-notation': 'error',
-        'no-else-return': 'error',
-        'no-tabs': 'error',
-        'no-trailing-spaces': ['error', {
-            skipBlankLines: false,
-            ignoreComments: false
-        }],
-        'no-var': 'error',
-        'unicode-bom': ['error', 'never'],
-        'curly': ['error', 'all'],
-        'object-curly-spacing': ['error', 'always'],
-        'keyword-spacing':['error'],
-        'require-atomic-updates': 0,
-        'linebreak-style': ['error', 'unix'],
-        'unicorn/prefer-node-protocol': ['error'],
-        'import/extensions': ['error', 'ignorePackages'],
-        'no-restricted-syntax': ['error', 'IfStatement > ExpressionStatement > AssignmentExpression'],
-        'unicorn/prefer-ternary': 'error'
-    },
-    overrides: [{
-        files: ['*.ts'],
-        rules: {
-            // see https://stackoverflow.com/questions/55280555/typescript-eslint-eslint-plugin-error-route-is-defined-but-never-used-no-un
-            'no-unused-vars': 'off',
-            '@typescript-eslint/no-unused-vars': 'error',
-            '@typescript-eslint/consistent-type-imports': 'error',
-            'no-undef': 'off',
-            // allow overloads
-            'no-redeclare': 'off'
-        }
-    }, {
-        files: ['*.test.ts'],
-        rules: {
-            'dot-notation': 'off'
-        }
-    }]
-}

@types/css-shorthand-properties.d.ts

@@ -1,5 +1,5 @@
 declare module "css-shorthand-properties" {
-    declare const cssShortHand: {
+    const cssShortHand: {
         /**
          * Returns a boolean indicating if a CSS property is a shorthand.
          */
@@ -7,7 +7,7 @@ declare module "css-shorthand-properties" {
         /**
          * Takes a CSS shorthand property and returns a list of longhand properties.
          */
-        expand: (property: string, recurse = false) => string[]
+        expand: (property: string, recurse?: boolean) => string[]
     }
 
     export = cssShortHand

@types/css-value.d.ts

@@ -1,14 +1,12 @@
 declare module "css-value" {
-    declare const cssValue: {
-        (rgb: string): CSSValue[]
-    }
+    function cssValue(rgb: string): cssValue.CSSValue[]
 
     namespace cssValue {
         interface CSSValue {
             type: string
             string: string
             unit: string
-            value: any
+            value: string | number
         }
     }
 

@types/junit-report-builder.d.ts

@@ -3,7 +3,7 @@ declare module "junit-report-builder" {
         build: () => void
     }
 
-    declare const cssValue: {
+    const cssValue: {
         newBuilder: () => Builder
     }
 

@types/query-selector-shadow-dom.d.ts

@@ -1,4 +1,4 @@
-const ExecuteMethod = (element: Element | Document, selector: string) => Element | null;
+declare function ExecuteMethod(element: Element | Document, selector: string): Element | null;
 
 /**
  * Contains two functions `queryOne` and `queryAll` that can
@@ -12,13 +12,13 @@ const ExecuteMethod = (element: Element | Document, selector: string) => Element
  * @public
  */
 interface CustomQueryHandler {
-    queryOne?: ExecuteMethod
+    queryOne?: typeof ExecuteMethod
     queryAll?: (element: Element | Document, selector: string) => Element[] | NodeListOf<Element>;
 }
 
 declare const querySelectorShadowDom: {
     QueryHandler: CustomQueryHandler
-    locatorStrategy: ExecuteMethod
+    locatorStrategy: typeof ExecuteMethod
 }
 
 declare module "query-selector-shadow-dom/plugins/puppeteer/index.js" {

package.json

@@ -1,6 +1,7 @@
 {
   "name": "webdriverio-monorepo",
   "private": true,
+  "type": "module",
   "scripts": {
     "create": "node ./scripts/generateSubPackage",
     "backport": "node ./scripts/backport.js",

packages/webdriverio/src/utils/index.ts

@@ -110,9 +110,9 @@ function sanitizeCSS (value?: string) {
 
 /**
  * parse css values to a better format
- * @param  {Object} cssPropertyValue result of WebDriver call
- * @param  {String} cssProperty      name of css property to parse
- * @return {Object}                  parsed css property
+ * @param  {string} cssPropertyValue result of WebDriver call
+ * @param  {string} cssProperty      name of css property to parse
+ * @return {object}                  parsed css property
  */
 export function parseCSS (cssPropertyValue: string, cssProperty?: string) {
     const parsedValue: ParsedCSSValue = {
@@ -141,7 +141,7 @@ export function parseCSS (cssPropertyValue: string, cssProperty?: string) {
         const string = parsedValue.value
         const value = cssPropertyValue.split(/,/).map(sanitizeCSS)
 
-        parsedValue.value = sanitizeCSS(font[0].value || font[0].string)
+        parsedValue.value = sanitizeCSS(font[0].value as string || font[0].string)
         parsedValue.parsed = { value, type: 'font', string }
     } else {
         /**