fix(e2e): consolidate frontend E2E to Cypress and restore CI (#967)

.github/workflows/e2e.yml

@@ -1,30 +1,51 @@
-# name: Test-e2e
-# on: [push, pull_request]
-# jobs:
-#   build:
-#     name: Test-e2e
-#     runs-on: ubuntu-latest
-#     timeout-minutes: 10
-#     steps:
-#       - name: Check out code
-#         uses: actions/checkout@v4
-#       - uses: actions/setup-python@v4
-#         with:
-#           python-version: '3.11.4' 
-#           cache: 'pip'
-#       - uses: actions/setup-node@v3
-#         with:
-#           cache: 'yarn'
-#           node-version: 'v20.12.1'
-#       - name: Install dependencies
-#         run: |
-#           sudo apt-get update
-#           sudo apt-get install -y python3-setuptools python3-pip python3-virtualenv chromium-browser libgbm1
-#           make install
-#       - name: DB setup
-#         run: |
-#             make migrate-upgrade
-#             python cre.py --upstream_sync
-#       # - name: Run app and e2e tests
-      #   run: |
-      #       make e2e
+name: Test-e2e
+on: [push, pull_request]
+permissions:
+  contents: read
+
+jobs:
+  build:
+    name: Test-e2e
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v4
+        with:
+          persist-credentials: false
+      - uses: actions/setup-python@v5
+        with:
+          python-version: '3.12.3'
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20.12.1'
+          cache: 'yarn'
+      - name: Install system dependencies
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y \
+              python3-setuptools \
+              python3-virtualenv \
+              python3-pip \
+              libxml2-dev \
+              libxslt-dev
+      - name: Create venv and install Python deps (no Playwright — Cypress ships its own browser)
+        run: |
+          pip install --upgrade pip setuptools virtualenv
+          virtualenv -p python3 venv
+          make install-deps-python
+      - name: Install Node deps (root for Cypress, frontend for build)
+        run: |
+          yarn install
+          make install-deps-typescript
+      - name: Seed e2e database (schema from models via create_all, data from checked-in fixture)
+        run: make e2e-db
+      - name: Run Cypress e2e
+        run: make e2e
+      - name: Upload Cypress screenshots on failure
+        if: failure()
+        uses: actions/upload-artifact@v4
+        with:
+          name: cypress-screenshots
+          path: cypress/screenshots
+          if-no-files-found: ignore

AGENTS.md

@@ -136,4 +136,7 @@ make mypy              # Python typecheck
 make test              # Python unittest suite
 make frontend          # yarn build (when TS/TSX changed)
 make alembic-guardrail # before deploy/migration ops
+make install-python    # includes `playwright install` for Python embeddings (prompt_client) — not frontend e2e; do not remove when adding Cypress
+make e2e-db            # seed ./standards_cache.sqlite for e2e (create_all from models + upstream_sync)
+make e2e               # frontend Cypress e2e (build, serve Flask on 127.0.0.1:5000, cypress run)
 ```

Makefile

@@ -86,16 +86,32 @@ dev-flask-docker:
 
 e2e:
 	yarn build
+	if [ -d "./venv" ]; then . ./venv/bin/activate; fi
+	[ -f "$(CURDIR)/standards_cache.sqlite" ] || { echo "ERROR: standards_cache.sqlite not found — run 'make e2e-db' first"; exit 1; }
+	export FLASK_APP="$(CURDIR)/cre.py"
+	export FLASK_CONFIG=development
+	export INSECURE_REQUESTS=1
+	flask run --host=127.0.0.1 --port=5000 > /tmp/opencre-e2e-flask.log 2>&1 &
+	FLASK_PID=$$!
+	trap 'kill $$FLASK_PID 2>/dev/null || true' EXIT INT TERM
+	for i in `seq 1 30`; do \
+		curl -fsS http://127.0.0.1:5000 >/dev/null && break; \
+		sleep 1; \
+	done
+	curl -fsS http://127.0.0.1:5000 >/dev/null || { echo "ERROR: Flask did not become ready on http://127.0.0.1:5000 after 30s; see /tmp/opencre-e2e-flask.log"; exit 1; }
+	env -u ELECTRON_RUN_AS_NODE yarn test:e2e
+
+# Build the e2e SQLite schema from the ORM models (create_all), then load a
+# small checked-in fixture graph. Local/CI e2e uses create_all, NOT
+# migrate-upgrade: migrations are the Postgres path and omit columns the
+# models added without a migration (e.g. cre.document_metadata, see
+# application/database/db.py), so a migrate-built SQLite cache is incomplete.
+# create_all always matches the models.
+e2e-db:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
-	export FLASK_APP="$(CURDIR)/cre.py" &&\
-	export FLASK_CONFIG=development &&\
-	export INSECURE_REQUESTS=1 &&\
-	flask run &
-	sleep 5
-	yarn test:e2e
-	sleep 20
-	killall yarn
-	killall flask
+	rm -f "$(CURDIR)/standards_cache.sqlite" &&\
+	NO_LOAD_GRAPH_DB=1 FLASK_CONFIG=development python -c "from application import create_app, sqla; app=create_app(mode='development'); app.app_context().push(); sqla.create_all()" &&\
+	FLASK_CONFIG=development python scripts/seed_e2e_fixtures.py
 
 test:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
@@ -116,11 +132,11 @@ install-deps-typescript:
 install-deps: install-deps-python install-deps-typescript
 
 install-python:
-	virtualenv -p python3  venv
+	virtualenv -p python3 venv
 	. ./venv/bin/activate &&\
 	make install-deps-python &&\
-	playwright install
-	
+	playwright install  # Python embeddings/scraping (prompt_client); NOT frontend e2e — keep when migrating to Cypress
+
 install-typescript:
 	yarn add webpack && cd application/frontend && yarn build
 

README.md

@@ -378,6 +378,25 @@ make cover
 
 Try to keep the coverage above 70%.
 
+### Frontend end-to-end tests (Cypress)
+
+Frontend E2E tests run with [Cypress](https://www.cypress.io/) against a local Flask server.
+First seed a local database — this builds the schema from the ORM models and loads the CRE graph
+from upstream into `./standards_cache.sqlite` — then run the suite headlessly:
+
+```bash
+make e2e-db   # rebuild and populate the local SQLite cache (discards any existing cache)
+make e2e      # build the frontend, start Flask on 127.0.0.1:5000, run Cypress
+```
+
+To watch the tests run interactively, start the backend in one terminal and open Cypress in
+another (after seeding with `make e2e-db`):
+
+```bash
+make dev-flask       # terminal 1: serves http://127.0.0.1:5000
+yarn cypress:open    # terminal 2: opens the Cypress runner
+```
+
 ---
 
 [![Code style: black](https://img.shields.io/badge/code%20style-black-000000.svg)](https://github.com/psf/black)

application/frontend/src/pages/Search/SearchName.tsx

@@ -19,6 +19,7 @@ export const SearchName = () => {
   const [error, setError] = useState<string | Object | null>(null);
 
   useEffect(() => {
+    window.scrollTo(0, 0);
     setLoading(true);
     axios
       .get(`${apiUrl}/text_search`, { params: { text: searchTerm } })

cypress.config.js

@@ -0,0 +1,10 @@
+const { defineConfig } = require('cypress');
+
+module.exports = defineConfig({
+  video: false,
+  e2e: {
+    baseUrl: 'http://127.0.0.1:5000',
+    specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}',
+    supportFile: false,
+  },
+});