TEST-1234 Add eslint and prettier

tests/playwright/.prettierrc

@@ -0,0 +1,8 @@
+{
+    "semi": true,
+    "trailingComma": "es5",
+    "singleQuote": true,
+    "printWidth": 80,
+    "tabWidth": 2, 
+    "useTabs": false
+} 

tests/playwright/.vscode/settings.json

@@ -0,0 +1,15 @@
+{
+  //"editor.defaultFormatter": "rvest.vs-code-prettier-eslint",
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnType": false,
+  "editor.formatOnPaste": true,
+  "editor.formatOnSave": true,
+  "editor.formatOnSaveMode": "file",
+  "files.autoSave": "onFocusChange", // optional but recommended
+  //"vs-code-prettier-eslint.prettierLast": false, // set as "true" to run 'prettier' last not first
+  "source.fixAll": "explicit",
+  "explorer.fileNesting.enabled": true,
+  "eslint.experimental.useFlatConfig": true,
+  "eslint.lintTask.enable": true,
+  "eslint.format.enable": true
+}

tests/playwright/eslint.config.mjs

@@ -0,0 +1,23 @@
+import globals from 'globals';
+import pluginReactConfig from 'eslint-plugin-react/configs/recommended.js';
+import eslintConfigPrettier from 'eslint-config-prettier';
+
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { FlatCompat } from '@eslint/eslintrc';
+import pluginJs from '@eslint/js';
+
+// mimic CommonJS variables -- not needed if using CommonJS
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: pluginJs.configs.recommended,
+});
+
+export default [
+  { languageOptions: { globals: globals.browser } },
+  ...compat.extends('standard-with-typescript'),
+  pluginReactConfig,
+  eslintConfigPrettier,
+];

tests/playwright/package.json

@@ -4,8 +4,28 @@
   "main": "index.js",
   "license": "MIT",
   "devDependencies": {
+    "@eslint/eslintrc": "^3.0.2",
+    "@eslint/js": "^9.1.1",
     "@playwright/test": "^1.43.1",
-    "@types/node": "^20.12.7"
+    "@types/node": "^20.12.7",
+    "@typescript-eslint/eslint-plugin": "^6.4.0",
+    "eslint": "^8.0.1",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-standard-with-typescript": "^43.0.1",
+    "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-n": "^15.0.0 || ^16.0.0 ",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-promise": "^6.0.0",
+    "eslint-plugin-react": "^7.34.1",
+    "globals": "^15.0.0",
+    "prettier": "^3.2.5",
+    "typescript": "*"
   },
-  "scripts": {}
+  "scripts": {
+    "lint": "eslint \"**/*.{ts,tsx}\""
+  },
+  "description": "playwright test project",
+  "repository": "https://github.com/hwinther/test",
+  "author": "hwinther",
+  "private": true
 }

tests/playwright/tests/example.spec.ts

@@ -14,5 +14,7 @@ test('get started link', async ({ page }) => {
   await page.getByRole('link', { name: 'Get started' }).click();
 
   // Expects page to have a heading with the name of Installation.
-  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
+  await expect(
+    page.getByRole('heading', { name: 'Installation' })
+  ).toBeVisible();
 });