Merge pull request #17 from thavelick/remove-jsdom-add-playwright-tests

Remove jsdom dependencies and add Playwright integration tests

Author: thavelick

.gitignore

@@ -1,2 +1,3 @@
 .claude/
-node_modules/
+node_modules/
+test-results/

CLAUDE.md

@@ -13,7 +13,7 @@ Just Bangs Lite is a client-side search tool with bang shortcuts (e.g., `python
 - **`public_html/main.js`**: Simple entry point that ONLY calls `initialize()` - no additional code or functions
 - **`public_html/index.html`**: Loads both scripts sequentially (search.js then main.js)
 
-**IMPORTANT**: main.js exists solely to separate the function library (search.js) from execution for Jest compatibility. Adding any additional code or functions to main.js will break this separation and cause testing issues.
+**IMPORTANT**: main.js exists solely to separate the function library (search.js) from execution for test compatibility. Adding any additional code or functions to main.js will break this separation and cause testing issues.
 
 ### Dependency Injection Pattern
 Functions that use browser objects (like `window`) accept them as parameters for testability. Most commonly this is a `windowObj = window` parameter:
@@ -23,11 +23,13 @@ function someFunction(param, windowObj = window) { ... }
 
 The `= window` default parameter makes the real browser object the default, allowing seamless browser usage while enabling tests to pass mock objects.
 
-### Testing Without package.json
-- Uses Jest via `bunx jest` with custom configuration
+### Testing Without Dependencies
+- **Unit tests**: Uses Bun test runner via `bun test` - no package.json required
+- **Integration tests**: Uses Playwright via `bunx playwright test` for browser automation
 - CommonJS exports in search.js for Node.js compatibility: `module.exports = { ... }`
-- Test files in `tests/` directory with `.spec.js` extension
-- All functions tested with mock browser objects as needed
+- Unit test files in `tests/unit/` directory with `.spec.js` extension
+- Integration test files in `tests/integration/` directory with `.spec.js` extension
+- All unit tests use mock browser objects for isolation
 
 ## Development Commands
 
@@ -42,8 +44,17 @@ make check      # Run both formatting and linting checks
 
 ### Running Specific Tests
 ```bash
+# Run unit tests only
+make test-unit
+
+# Run integration tests only (requires dev server on port 8000)
+make test-integration
+
+# Run all tests
+make test-all
+
 # Run single test file
-bun test tests/search.spec.js
+bun test tests/unit/search.spec.js
 
 # Run specific test pattern
 bun test -t "processBang"
@@ -59,7 +70,7 @@ bun test -t "processBang"
 ### Module System
 - **Browser**: Regular script tags (no ES6 modules for broader compatibility)
 - **Tests**: CommonJS require/module.exports (Bun supports both)
-- **Minimal package.json**: Basic metadata only, no external dependencies
+- **No package.json**: Pure dependency-free JavaScript with external test runner
 
 ## Bang System
 
@@ -83,7 +94,7 @@ Modify the `bangs` array in `search.js`:
 Always pass mock browser objects to test functions that interact with DOM, location, or other browser APIs:
 ```javascript
 const mockWindow = {
-  document: { getElementById: jest.fn() },
+  document: { getElementById: () => {} },
   location: { search: "?q=test", href: "", hash: "" }
 };
 ```

Makefile

@@ -13,19 +13,38 @@ dev: # Start development server
 
 format: # Format code with Biome
 	@echo "Formatting code.."
-	npx --yes @biomejs/biome format --write .
+	bunx --bun @biomejs/biome format --write .
 
 lint: # Lint code with Biome
 	@echo "Linting code.."
-	npx --yes @biomejs/biome lint .
+	bunx --bun @biomejs/biome lint .
 
 check: # Check formatting and linting with Biome
 	@echo "Checking formatting and linting.."
-	npx --yes @biomejs/biome check .
+	bunx --bun @biomejs/biome check .
 
 test: # Run unit tests with Bun
-	@echo "Running tests.."
-	bun test
+	@echo "Running unit tests.."
+	bun test tests/unit
+
+test-unit: # Run unit tests only
+	@echo "Running unit tests.."
+	bun test tests/unit
+
+test-coverage: # Run unit tests with coverage
+	@echo "Running unit tests with coverage.."
+	bun test tests/unit --coverage
+
+test-integration: # Run integration tests with Playwright
+	@echo "Running integration tests.."
+	bunx playwright test tests/integration
+
+test-all: # Run both unit and integration tests
+	@echo "Running all tests.."
+	@echo "Running unit tests.."
+	bun test tests/unit
+	@echo "Running integration tests.."
+	bunx playwright test tests/integration
 
 # -----------------------------------------------------------
 # CAUTION: If you have a file with the same name as make