everget · everget · Dec 21, 2024 · Dec 21, 2024
diff --git a/.github/workflows/basic.yml b/.github/workflows/basic.yml
@@ -0,0 +1,84 @@
+name: Basic CI
+
+on:
+  push:
+    branches: [main, master]
+  pull_request:
+    branches: [main, master]
+    types: [opened, synchronize, reopened]
+
+env:
+  HUSKY: 0
+
+jobs:
+  typecheck:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 8
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '18.x'
+          cache: 'pnpm'
+
+      - name: Type Checking
+        run: |
+          pnpm install --frozen-lockfile
+          pnpm run ci:typecheck
+
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 8
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '18.x'
+          cache: 'pnpm'
+
+      - name: Linting
+        run: |
+          pnpm install --frozen-lockfile
+          pnpm run ci:lint
+
+  unit-tests:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 8
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '18.x'
+          cache: 'pnpm'
+
+      - name: Unit Testing
+        run: |
+          pnpm install --frozen-lockfile
+          pnpm run ci:test
+
+  e2e-tests:
+    timeout-minutes: 30
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+      - name: Install dependencies
+        run: npm install -g pnpm && pnpm install
+      - name: Install Playwright Browsers
+        run: pnpm exec playwright install --with-deps
+      - name: Run Playwright tests
+        run: pnpm run ci:test:e2e
+      - uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: playwright-report
+          path: playwright-report/
+          retention-days: 7
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,33 @@
+_dev
+coverage
+node_modules
+dist
+build
+.eslintcache
+.windsurfrules
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,16 @@
+_dev
+dist
+build
+coverage
+playwright
+cypress
+node_modules
+.changeset
+.astro
+.vscode
+tests/e2e/report
+tests/e2e/test-results
+
+.eslintcache
+package-lock.json
+pnpm-lock.yaml
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1,24 @@
+{
+  "tabWidth": 4,
+  "useTabs": true,
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "printWidth": 100,
+  "plugins": ["prettier-plugin-organize-attributes"],
+  "overrides": [
+    {
+      "files": ["*.{json,md,yml,yaml}"],
+      "options": {
+        "useTabs": false,
+        "tabWidth": 2
+      }
+    },
+    {
+      "files": ["*.{css,scss,less}"],
+      "options": {
+        "singleQuote": false
+      }
+    }
+  ]
+}
diff --git a/eslint.config.js b/eslint.config.js
@@ -0,0 +1,20 @@
+import pluginJs from '@eslint/js';
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+
+export default [
+	{
+		ignores: ['coverage', 'dist', 'build', 'tests/e2e/report/*', 'tests/e2e/test-results/*'],
+	},
+	{ files: ['src/**/*.{js,mjs,cjs,ts,jsx,tsx}', 'tests/**/*.spec.{js,mjs,cjs,ts,jsx,tsx'] },
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node,
+			},
+		},
+	},
+	pluginJs.configs.recommended,
+	...tseslint.configs.recommended,
+];
diff --git a/index.html b/index.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<link rel="icon" type="image/svg+xml" href="/vite.svg" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Calculator | Vanilla TypeScript</title>
+		<link rel="stylesheet" href="dist/assets/index-DpDR3dZA.css" />
+	</head>
+	<body>
+		<div id="app"></div>
+		<script type="module" src="dist/assets/index-DssakvEw.js"></script>
+	</body>
+</html>
diff --git a/package.json b/package.json
@@ -0,0 +1,48 @@
+{
+  "name": "calculator",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "build": "pnpm run swap:dev && tsc && vite build && pnpm run swap:prod",
+    "dev": "pnpm run swap:dev && vite",
+    "preview": "pnpm run build && vite preview",
+    "swap": "node ./scripts/swap-index-urls.mjs",
+    "swap:prod": "pnpm run swap -- --prod",
+    "swap:dev": "pnpm run swap -- --dev",
+    "check": "pnpm run typecheck && pnpm run format:check && pnpm run lint:check",
+    "fix": "pnpm run format:fix && pnpm run lint:fix",
+    "test": "vitest",
+    "test:e2e": "pnpm exec playwright test",
+    "test:e2e:ui": "pnpm exec playwright test --ui",
+    "coverage": "vitest run --coverage",
+    "lint:check": "eslint . --cache",
+    "lint:fix": "eslint . --fix",
+    "lint": "pnpm run lint:fix",
+    "format:check": "prettier . --check --ignore-unknown --cache",
+    "format:fix": "prettier . --write --ignore-unknown --cache",
+    "format": "pnpm run format:fix",
+    "typecheck": "tsc --noEmit",
+    "ci:lint": "eslint .",
+    "ci:format:check": "pnpm run format:check",
+    "ci:typecheck": "pnpm run typecheck",
+    "ci:test": "pnpm run coverage",
+    "ci:test:e2e": "pnpm run test:e2e"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.17.0",
+    "@playwright/test": "^1.49.1",
+    "@types/node": "^22.10.2",
+    "@vitest/coverage-v8": "^2.1.8",
+    "eslint": "^9.17.0",
+    "globals": "^15.14.0",
+    "jsdom": "^25.0.1",
+    "prettier": "^3.4.2",
+    "prettier-plugin-organize-attributes": "^1.0.0",
+    "typescript": "^5.7.2",
+    "typescript-eslint": "^8.18.1",
+    "vite": "^5.4.11",
+    "vitest": "^2.1.8"
+  },
+  "packageManager": "[email protected]+sha512.0a203ffaed5a3f63242cd064c8fb5892366c103e328079318f78062f24ea8c9d50bc6a47aa3567cabefd824d170e78fa2745ed1f16b132e16436146b7688f19b"
+}
diff --git a/playwright.config.ts b/playwright.config.ts
@@ -0,0 +1,86 @@
+import { defineConfig, devices } from '@playwright/test';
+import path from 'node:path';
+
+const FRONTEND_URL = 'http://localhost:5173';
+const PLAYWRIGHT_DIR = './tests/e2e/';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// import dotenv from 'dotenv';
+// dotenv.config({ path: path.resolve(__dirname, '.env') });
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+	testDir: PLAYWRIGHT_DIR,
+	// Folder for test artifacts such as screenshots, videos, traces, etc.
+	outputDir: path.join(PLAYWRIGHT_DIR, 'test-results'), //'./tests/e2e/playwright/test-results',
+
+	timeout: 2e4,
+	/* Run tests in files in parallel */
+	fullyParallel: true,
+	/* Fail the build on CI if you accidentally left test.only in the source code. */
+	forbidOnly: !!process.env.CI,
+	/* Retry on CI only */
+	retries: process.env.CI ? 2 : 0,
+	/* Opt out of parallel tests on CI. */
+	workers: process.env.CI ? 1 : undefined,
+	/* Reporter to use. See https://playwright.dev/docs/test-reporters */
+	reporter: [['html', { outputFolder: path.join(PLAYWRIGHT_DIR, 'report') }]],
+	/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+	use: {
+		// headless: true,
+		baseURL: FRONTEND_URL,
+		colorScheme: 'light',
+		locale: 'en',
+	},
+
+	/* Configure projects for major browsers */
+	projects: [
+		{
+			name: 'chromium',
+			use: { ...devices['Desktop Chrome'] },
+		},
+
+		// {
+		// 	name: 'firefox',
+		// 	use: { ...devices['Desktop Firefox'] },
+		// },
+
+		// {
+		// 	name: 'webkit',
+		// 	use: { ...devices['Desktop Safari'] },
+		// },
+
+		/* Test against mobile viewports. */
+		// {
+		//   name: 'Mobile Chrome',
+		//   use: { ...devices['Pixel 5'] },
+		// },
+		// {
+		//   name: 'Mobile Safari',
+		//   use: { ...devices['iPhone 12'] },
+		// },
+
+		/* Test against branded browsers. */
+		// {
+		//   name: 'Microsoft Edge',
+		//   use: { ...devices['Desktop Edge'], channel: 'msedge' },
+		// },
+		// {
+		//   name: 'Google Chrome',
+		//   use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+		// },
+	],
+
+	/* Run your local dev server before starting the tests */
+	webServer: {
+		command: 'pnpm run dev',
+		url: FRONTEND_URL,
+		reuseExistingServer: !process.env.CI,
+		timeout: 3e4,
+	},
+});