chore(*): added linting and formatting to CI

Author: dackers86

.github/workflows/test.yaml

@@ -9,6 +9,29 @@ on:
       - "**"
 
 jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          check-latest: true
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: latest
+      - name: Install dependencies
+        run: pnpm install
+      - name: Run ESLint on core packages
+        run: pnpm --filter="@firebase-ui/*" run lint
+      - name: Run ESLint on example apps
+        run: pnpm --filter="angular-example" --filter="nextjs" --filter="react" run lint
+      - name: Check Prettier formatting
+        run: pnpm format:check
+
   test:
     runs-on: ubuntu-latest
     steps:

.gitignore

@@ -15,6 +15,9 @@ dist-ssr
 # Angular
 .angular
 
+# Next.js
+.next
+
 # Coverage
 coverage
 

.prettierignore

@@ -13,6 +13,7 @@ releases/
 # Generated files
 *.min.js
 *.min.css
+packages/styles/dist.css
 
 # Logs
 *.log

eslint.config.js

@@ -16,47 +16,119 @@
 
 import js from "@eslint/js";
 import prettier from "eslint-config-prettier";
+import tseslint from "@typescript-eslint/eslint-plugin";
+import tsparser from "@typescript-eslint/parser";
 
 export default [
-  { ignores: ["**/dist/**", "**/node_modules/**", "**/releases/**", "**/.angular/**"] },
+  {
+    ignores: [
+      "dist/**",
+      "node_modules/**",
+      "releases/**",
+      "*.tgz",
+      "**/dist/**",
+      "**/node_modules/**",
+      "**/build/**",
+      "**/.next/**",
+      "**/coverage/**",
+      "**/.angular/**",
+      "**/cache/**",
+      "**/.cache/**",
+    ],
+  },
   js.configs.recommended,
   prettier,
   {
-    files: ["**/*.{js,jsx,ts,tsx}"],
+    files: ["**/*.{js,jsx}"],
     languageOptions: {
       ecmaVersion: 2022,
       sourceType: "module",
+      globals: {
+        window: "readonly",
+        console: "readonly",
+        document: "readonly",
+        process: "readonly",
+        Buffer: "readonly",
+        __dirname: "readonly",
+        __filename: "readonly",
+        global: "readonly",
+        module: "readonly",
+        require: "readonly",
+        exports: "readonly",
+        setImmediate: "readonly",
+        clearImmediate: "readonly",
+        URL: "readonly",
+        clearInterval: "readonly",
+        clearTimeout: "readonly",
+        setTimeout: "readonly",
+        setInterval: "readonly",
+      },
+    },
+    rules: {
+      "no-unused-vars": "off",
+      "no-console": "warn",
+      "prefer-const": "error",
+      "no-var": "error",
+      "no-undef": "off",
+    },
+  },
+  {
+    files: ["**/*.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: 2022,
+      sourceType: "module",
+      parser: tsparser,
       parserOptions: {
         ecmaFeatures: {
           jsx: true,
         },
       },
+      globals: {
+        window: "readonly",
+        console: "readonly",
+        document: "readonly",
+        process: "readonly",
+        Buffer: "readonly",
+        __dirname: "readonly",
+        __filename: "readonly",
+        global: "readonly",
+        module: "readonly",
+        require: "readonly",
+        exports: "readonly",
+        setImmediate: "readonly",
+        clearImmediate: "readonly",
+        URL: "readonly",
+        clearInterval: "readonly",
+        clearTimeout: "readonly",
+        setTimeout: "readonly",
+        setInterval: "readonly",
+        React: "readonly",
+        describe: "readonly",
+        it: "readonly",
+        expect: "readonly",
+        beforeEach: "readonly",
+        afterEach: "readonly",
+        beforeAll: "readonly",
+        afterAll: "readonly",
+        vi: "readonly",
+        test: "readonly",
+        jest: "readonly",
+      },
+    },
+    plugins: {
+      "@typescript-eslint": tseslint,
     },
     rules: {
-      // Core JavaScript rules
-      "no-unused-vars": ["error", { varsIgnorePattern: "^_", argsIgnorePattern: "^_" }],
+      "no-unused-vars": "off",
+      "no-undef": "off",
       "no-console": "warn",
       "prefer-const": "error",
       "no-var": "error",
-
-      // Security and best practices
-      "no-debugger": "error",
-      "no-eval": "error",
-      "no-implied-eval": "error",
-      "no-new-func": "error",
-      "no-script-url": "error",
-      "no-with": "error",
-
-      // Modern JavaScript preferences
-      "prefer-arrow-callback": "error",
-      "prefer-template": "error",
-      "prefer-destructuring": ["error", { object: true, array: false }],
-
-      // Code quality
-      eqeqeq: ["error", "always"],
-      "no-duplicate-imports": "error",
-      "no-useless-return": "error",
-      "no-useless-concat": "error",
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        { varsIgnorePattern: "^_", argsIgnorePattern: "^_", caughtErrorsIgnorePattern: "^_" },
+      ],
+      "@typescript-eslint/no-explicit-any": "warn",
     },
   },
 ];

examples/angular/angular.json

@@ -69,7 +69,7 @@
         },
         "extract-i18n": {
           "builder": "@angular/build:extract-i18n"
-        },
+        }
       }
     },
     "angular": {
@@ -92,7 +92,7 @@
             }
           },
           "defaultConfiguration": "production"
-        },
+        }
       }
     }
   },

examples/angular/eslint.config.js

@@ -16,6 +16,8 @@
 
 import js from "@eslint/js";
 import prettier from "eslint-config-prettier";
+import typescript from "@typescript-eslint/eslint-plugin";
+import typescriptParser from "@typescript-eslint/parser";
 
 export default [
   { ignores: ["dist/**", "node_modules/**", ".angular/**"] },
@@ -26,13 +28,18 @@ export default [
     languageOptions: {
       ecmaVersion: 2022,
       sourceType: "module",
+      parser: typescriptParser,
       parserOptions: {
         project: "./tsconfig.json",
       },
     },
+    plugins: {
+      "@typescript-eslint": typescript,
+    },
     rules: {
-      "no-unused-vars": ["error", { varsIgnorePattern: "^_", argsIgnorePattern: "^_" }],
-      "no-console": "warn",
+      "no-unused-vars": "off", // Use TypeScript version instead
+      "no-console": "off", // Allow console in examples
+      "no-undef": "off", // TypeScript handles this
       "prefer-const": "error",
       "no-var": "error",
       "@typescript-eslint/no-explicit-any": "warn",

examples/angular/package.json

@@ -1,6 +1,7 @@
 {
   "name": "angular-example",
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
@@ -52,6 +53,8 @@
     "@types/express": "^4.17.17",
     "@types/node": "^20.19.0",
     "eslint": "^9.22.0",
+    "@typescript-eslint/eslint-plugin": "^8.43.0",
+    "@typescript-eslint/parser": "^8.43.0",
     "eslint-config-prettier": "^9.1.0",
     "firebase": "^11",
     "vitest": "^3.2.0",
@@ -64,4 +67,4 @@
     "prettier": "^3.1.1",
     "typescript": "~5.9.2"
   }
-}
+}

examples/angular/src/test-setup.ts

@@ -21,14 +21,13 @@ import "zone.js";
 import "zone.js/testing";
 
 // Import Angular testing utilities
-import { getTestBed, TestBed } from "@angular/core/testing";
-import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from "@angular/platform-browser-dynamic/testing";
+import { TestBed } from "@angular/core/testing";
 
 // Ensure Zone.js testing environment is properly configured
 beforeEach(() => {
   // Reset Zone.js state before each test
   if (typeof Zone !== "undefined") {
-    Zone.current.fork({}).run(() => {
+    Zone.current.fork({ name: "test-zone" }).run(() => {
       // Run each test in a fresh zone
     });
   }
@@ -41,13 +40,6 @@ import * as matchers from "@testing-library/jest-dom/matchers";
 // Extend Vitest's expect with jest-dom matchers
 expect.extend(matchers);
 
-// Initialize the testing environment with Zone.js support
-if (!TestBed.platform) {
-  TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
-    teardown: { destroyAfterEach: false },
-  });
-}
-
 // Reset TestBed after each test to prevent configuration conflicts
 afterEach(() => {
   TestBed.resetTestingModule();
@@ -60,11 +52,11 @@ declare global {
 }
 
 // Define global test utilities
-globalThis.spyOn = (obj: any, method: string) => {
+(globalThis as any).spyOn = (obj: any, method: string) => {
   const spy = vi.spyOn(obj, method);
   // Add Jasmine-compatible methods
-  spy.and = {
-    callFake: (fn: Function) => {
+  (spy as any).and = {
+    callFake: (fn: (...args: any[]) => any) => {
       spy.mockImplementation(fn);
       return spy;
     },
@@ -77,7 +69,7 @@ globalThis.spyOn = (obj: any, method: string) => {
       return spy;
     },
   };
-  spy.calls = {
+  (spy as any).calls = {
     reset: () => spy.mockClear(),
     all: () => spy.mock.calls,
     count: () => spy.mock.calls.length,
@@ -86,6 +78,6 @@ globalThis.spyOn = (obj: any, method: string) => {
   };
   return spy;
 };
-globalThis.pending = (reason?: string) => {
+(globalThis as any).pending = (reason?: string) => {
   throw new Error(`Test pending: ${reason || "No reason provided"}`);
 };

examples/nextjs/.eslintrc.json

@@ -0,0 +1,9 @@
+{
+  "extends": ["next/core-web-vitals"],
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint"],
+  "rules": {
+    "@typescript-eslint/no-explicit-any": "warn",
+    "no-console": "off"
+  }
+}

examples/nextjs/package.json

@@ -27,6 +27,10 @@
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "eslint": "^9.22.0",
+    "eslint-config-next": "^15.1.7",
+    "@typescript-eslint/eslint-plugin": "^8.43.0",
+    "@typescript-eslint/parser": "^8.43.0",
     "postcss": "^8.5.2",
     "postcss-load-config": "^6.0.1",
     "prettier": "^3.1.1",