General Improvements: Harden storage, anchoring, imports, and a11y; gate deploys on tests

.github/workflows/deploy-pages.yml

@@ -17,7 +17,24 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
+  # Hard gate: the site only deploys when the chromium suite is green.
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v7
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+      - name: Install dependencies
+        run: npm ci
+      - name: Install Playwright browsers
+        run: npx playwright install --with-deps
+      - name: Run tests
+        run: npx playwright test --project=chromium
+
   deploy:
+    needs: test
     environment:
       name: github-pages
       url: ${{ steps.deployment.outputs.page_url }}

.github/workflows/tests.yml

@@ -0,0 +1,43 @@
+name: Tests
+
+on:
+  push:
+    branches:
+      - main
+      - improvement
+  pull_request:
+  workflow_dispatch:
+
+concurrency:
+  group: tests-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  test:
+    name: Playwright (${{ matrix.project }})
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        # Desktop browsers are the compatibility gate (all three must pass).
+        # Mobile/tablet are best-effort and allowed to fail until they are
+        # stabilized.
+        project: [chromium, firefox, webkit]
+    steps:
+      - uses: actions/checkout@v7
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+      - name: Install dependencies
+        run: npm ci
+      - name: Install Playwright browsers
+        run: npx playwright install --with-deps
+      - name: Run tests
+        run: npx playwright test --project=${{ matrix.project }}
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: playwright-report-${{ matrix.project }}
+          path: playwright-report/
+          retention-days: 14

.gitignore

@@ -1,6 +1,10 @@
 node_modules/
 .DS_Store
 *.log
+.env
+.env.*
+!.env.example
+opencode.json
 .cache/
 dist/
 playwright-report/

README.md

@@ -28,7 +28,8 @@ That single line is the whole installation.
   import it with one click and see every note in place.
 - **Polished UI.** A floating toolbar, a Figma-style comments panel, light/dark
   themes that auto-adapt to your page, and full keyboard shortcuts.
-- **Tiny & dependency-free.** ~40 KB of vanilla JavaScript, zero dependencies.
+- **Tiny & dependency-free.** ~110 KB of vanilla JavaScript (unminified, zero
+  dependencies) — minify it for production to cut that to a few tens of KB.
 
 ---
 
@@ -348,7 +349,7 @@ Annotate.version;             // "1.2.0"
 ```bash
 git clone git@github.com:reviewjs/annotate.git
 cd annotate
-npm start          # serves the demo at http://localhost:3000
+npm start          # serves the demo at http://localhost:4200
 ```
 
 Open [`index.html`](./index.html) and start annotating. Framework examples live