fix(e2e): complete Cypress migration and stabilize make e2e for #523

Makefile

@@ -47,16 +47,19 @@ dev-flask-docker:
 
 e2e:
 	yarn build
-	[ -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
+	if [ -d "./venv" ]; then . ./venv/bin/activate; fi
+	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
 
 test:
 	[ -d "./venv" ] && . ./venv/bin/activate &&\
@@ -81,7 +84,7 @@ install-python:
 	. ./venv/bin/activate &&\
 	make install-deps-python &&\
 	playwright install
-	
+
 install-typescript:
 	yarn add webpack && cd application/frontend && yarn build
 

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,
+  },
+});

cypress/e2e/smoke.cy.js

@@ -0,0 +1,20 @@
+describe('OpenCRE e2e smoke', () => {
+  it('loads homepage with primary search form', () => {
+    cy.visit('/');
+    cy.get('form#search-bar').should('exist');
+    cy.get('form#search-bar input[type="text"]').should('be.visible');
+  });
+
+  it('home search routes to search results page', () => {
+    const term = 'asvs';
+    cy.visit('/');
+    cy.get('form#search-bar input[type="text"]').type(`${term}{enter}`);
+    cy.url().should('include', `/search/${term}`);
+    cy.contains('Results matching').should('be.visible');
+  });
+
+  it('browse route is reachable', () => {
+    cy.visit('/root_cres');
+    cy.contains('h1', 'Root CREs').should('be.visible');
+  });
+});

package.json

@@ -7,7 +7,9 @@
     "lint": "prettier --write '**/*.tsx' '**/*.ts' '**/*.js'",
     "build": "webpack --config webpack.prod.js",
     "start": "webpack serve",
-    "test:e2e": "jest",
+    "test:e2e": "cypress run",
+    "cypress:open": "cypress open",
+    "cypress:run": "cypress run",
     "postinstall": "del-cli node_modules/@types/react-dom/node_modules/@types && del-cli node_modules/webpack/types.d.ts"
   },
   "keywords": [],
@@ -23,6 +25,7 @@
     "@types/react-router-dom": "^5",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
     "babel-loader": "^8.2.2",
+    "cypress": "^13.17.0",
     "css-loader": "^5.2.4",
     "del-cli": "^3.0.1",
     "enzyme": "3.11.0",