Fix Vite configuration and add regression tests

This commit addresses code review feedback and adds comprehensive tests:

## Vite Configuration Fixes

1. Remove redundant vite-env.d.ts
   - Already have vite/client in tsconfig.json types

2. Fix HTML file locations and asset paths
   - Move all entry point HTML files to frontend root
   - Update script paths to point to src/
   - Ensures Vite outputs HTML to dist root, not dist/src/

3. Use Vite's publicDir instead of custom plugin
   - Move (not copy) assets/ to public/assets/
   - Move src/static/ contents to public/
   - Move manifest.xml to public/
   - Remove complex file-moving plugin
   - Configure publicDir: 'public'

4. Simplify vite.config.ts
   - Remove copyStaticAssets plugin
   - Keep only manifestPlugin for transformation

## Regression Tests Added

Added comprehensive test suites to prevent build issues:

### test-build-output.mjs
- Verifies HTML files at dist root (not subdirectories)
- Checks asset paths use absolute paths (/assets/)
- Validates static files copied correctly
- Tests manifest.xml transformation

### test-dev-server.mjs
- Tests all HTML entry points accessible
- Verifies static file serving
- Checks asset file accessibility
- Validates 404s for non-existent paths

### Test Commands
- npm run test:build - Test build output
- npm run test:dev-server - Test dev server (requires server running)
- npm run test:vite - Full build + test

See TESTING.md for detailed documentation.

All tests passing ✅

Author: claude

CLAUDE.md

@@ -20,7 +20,7 @@ This is a writing tools application consisting of two main components:
   - Build: `npm run build` (production) or `npm run build:dev` (development)
   - Lint: `npm run lint` or `npm run lint:fix`
   - Format: `npm run format` or `npm run style:fix` (lint + format)
-  - Test: `npm run test`
+  - Test: `npm run test` (Jest) or `npm run test:vite` (Vite build regression tests)
 
 ### Backend (`/backend`)
 - **Use `uv`** - NOT pip

frontend/TESTING.md

@@ -0,0 +1,107 @@
+# Vite Build Regression Tests
+
+This directory contains regression tests for the Vite build configuration to prevent issues that were caught during code review.
+
+## Test Suites
+
+### 1. Build Output Tests (`test-build-output.mjs`)
+
+Tests the production build output to ensure:
+- ✅ HTML files are at `dist/` root (not `dist/src/`)
+- ✅ No HTML files remain in subdirectories
+- ✅ Asset paths in HTML use absolute paths (`/assets/...`)
+- ✅ Static files from `public/` are copied to `dist/` root
+- ✅ Assets directory structure is correct
+- ✅ `manifest.xml` exists and is properly transformed
+
+**Run:** `npm run test:build`
+
+**When to run:** After any changes to `vite.config.ts` or build process
+
+### 2. Dev Server Tests (`test-dev-server.mjs`)
+
+Tests the development server to ensure:
+- ✅ HTML entry points are accessible at root paths
+- ✅ Static files from `public/` are served correctly
+- ✅ Asset files are accessible at `/assets/`
+- ✅ Non-existent paths return 404
+- ✅ Files that should NOT exist (like `/src/taskpane.html`) return 404
+
+**Run:** `npm run test:dev-server`
+
+**Prerequisites:** Dev server must be running (`npm run dev-server`)
+
+### 3. Combined Test (`test:vite`)
+
+Runs a full build and tests the output.
+
+**Run:** `npm run test:vite`
+
+## Issues These Tests Prevent
+
+### Issue 1: HTML Files in Wrong Location
+**Problem:** HTML files were output to `dist/src/` instead of `dist/` root, causing 404s.
+
+**Test:** Build Output Test #1, #2
+
+**How:** Verifies all HTML files exist at dist root and no HTML files exist in subdirectories.
+
+### Issue 2: Broken Asset Paths
+**Problem:** When HTML files were manually moved, relative asset paths broke (e.g., `../assets/...` became incorrect).
+
+**Test:** Build Output Test #3
+
+**How:** Parses HTML files to verify asset paths use absolute paths (`/assets/...`).
+
+### Issue 3: Static Files Not Copied
+**Problem:** Before using `publicDir`, static files weren't copied correctly.
+
+**Test:** Build Output Test #4
+
+**How:** Verifies all static files from `public/` exist in `dist/`.
+
+### Issue 4: Dev Server Path Issues
+**Problem:** Dev server wasn't serving files at expected paths.
+
+**Test:** Dev Server Tests #1-4
+
+**How:** Makes HTTP requests to verify all endpoints return correct status codes.
+
+## CI Integration
+
+Add to your CI pipeline:
+
+```yaml
+- name: Build and Test
+  run: |
+    cd frontend
+    npm install
+    npm run test:vite
+```
+
+## Local Development
+
+Before committing changes to Vite config:
+
+```bash
+# Build and test
+npm run test:vite
+
+# Or test individually
+npm run build
+npm run test:build
+
+# For dev server tests (in separate terminal)
+npm run dev-server
+npm run test:dev-server
+```
+
+## Adding New Tests
+
+When adding new entry points or changing the build structure:
+
+1. Add new test cases to `test-build-output.mjs` or `test-dev-server.mjs`
+2. Run tests to verify they fail without your changes
+3. Implement your changes
+4. Verify tests pass
+5. Commit both changes and updated tests

frontend/src/commands/commands.html frontend/commands.htmlfrontend/src/commands/commands.html renamed to frontend/commands.html

@@ -17,6 +17,6 @@
 	</head>
 
 	<body>
-		<script type="module" src="./commands.ts"></script>
+		<script type="module" src="./src/commands/commands.ts"></script>
 	</body>
 </html>

frontend/src/editor/editor.html frontend/editor.htmlfrontend/src/editor/editor.html renamed to frontend/editor.html

@@ -23,6 +23,6 @@
 
 	<body>
 		<div id="container"></div>
-		<script type="module" src="./index.tsx"></script>
+		<script type="module" src="./src/editor/index.tsx"></script>
 	</body>
 </html>

frontend/src/logs/logs.html frontend/logs.htmlfrontend/src/logs/logs.html renamed to frontend/logs.html

@@ -11,6 +11,6 @@
 
 	<body>
 		<div id="container"></div>
-		<script type="module" src="./index.tsx"></script>
+		<script type="module" src="./src/logs/index.tsx"></script>
 	</body>
 </html>

frontend/package.json

@@ -39,7 +39,10 @@
 		"style": "npm run lint && npm run format:check",
 		"style:fix": "npm run lint:fix && npm run format",
 		"prepare": "husky",
-		"test": "jest"
+		"test": "jest",
+		"test:build": "node test-build-output.mjs",
+		"test:dev-server": "node test-dev-server.mjs",
+		"test:vite": "npm run build && npm run test:build"
 	},
 	"dependencies": {
 		"@auth0/auth0-react": "^2.2.4",

frontend/src/popup.html frontend/popup.htmlfrontend/src/popup.html renamed to frontend/popup.html

@@ -18,7 +18,7 @@
 
 <body class="ms-font-m ms-Fabric">
   <div id="container"></div>
-  <script type="module" src="./popup.tsx"></script>
+  <script type="module" src="./src/popup.tsx"></script>
 </body>
 
 </html>