refactor: use compose from uselagoon/lagoon

.dockerignore

@@ -7,7 +7,17 @@ README.md
 **/yarn-error.log
 **/.gitignore
 node_modules
+cypress_cache
+cypress
+.vscode
+.github
+.storybook
+
 build
 
 # Envs
-**/.env.local
+**/.env.local
+
+lagoon-core.*
+Makefile
+cypress/screenshots

.github/workflows/ui-workflow.yaml

@@ -39,8 +39,18 @@ jobs:
 
   cypress-tests:
     runs-on: ubuntu-latest
-
-    needs: [format-check, lint]
+    continue-on-error: ${{ matrix.experimental }}
+    strategy:
+      fail-fast: false
+      matrix:
+        lagoon_image_tag: ["main"]
+        lagoon_image_repo: ["testlagoon"]
+        experimental: [false]
+        # include:
+        #   - lagoon_image_tag: "v2.20.1"
+        #     lagoon_image_repo: "uselagoon"
+        #     experimental: true
+    # needs: [format-check, lint]
 
     steps:
     - name: Checkout Repository
@@ -53,13 +63,13 @@ jobs:
 
     - name: Build and start Lagoon-minimal
       run: |
-        cd test
-        make up
+        make development-api LAGOON_CORE_IMAGE_REPO=${{matrix.lagoon_image_repo}} LAGOON_CORE_IMAGE_TAG=${{matrix.lagoon_image_tag}}
 
     - name: Start ui
       env:
-        GRAPHQL_API: http://0.0.0.0:33000/graphql
-        KEYCLOAK_API: http://0.0.0.0:38088/auth
+        GRAPHQL_API: http://localhost:3000/graphql
+        KEYCLOAK_API: http://localhost:8088/auth
+        NODE_PORT: 3003
       run: |
         yarn install
         yarn build
@@ -70,26 +80,37 @@ jobs:
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
+        wait-on: 'http://localhost:3003'
         command: yarn cypress:runRbac
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_url: http://localhost:3003
 
-    - name: Run General Cypress Tests
+    - name: Run Organization Cypress Tests
       uses: cypress-io/github-action@v6
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
-        command: yarn cypress:runGeneral
+        wait-on: 'http://localhost:3003'
+        command: yarn cypress:runOrganizations
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_url: http://localhost:3003
 
-    - name: Run Organization Cypress Tests
+    - name: Run General Cypress Tests
       uses: cypress-io/github-action@v6
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
-        command: yarn cypress:runOrganizations
+        wait-on: 'http://localhost:3003'
+        command: yarn cypress:runGeneral
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_url: http://localhost:3003
 
     - name: Stop Docker containers
       run: |
-        cd test
-        make down
+        make development-api-down

.gitignore

@@ -15,6 +15,9 @@ build-storybook.log
 .env
 .python-version
 docker-compose.override.yml
+cypress_cache
+lagoon-core.*
+cypress/screenshots
 
 # ts linter
 *.tsbuildinfo

Makefile

@@ -0,0 +1,62 @@
+# upstream
+CI_BUILD_TAG ?= lagoon-ui
+CORE_REPO=https://github.com/uselagoon/lagoon.git
+CORE_TREEISH=main
+CYPRESS_BASE=cypress/base:20.13.1
+
+LAGOON_CORE_IMAGE_REPO=testlagoon
+LAGOON_CORE_IMAGE_TAG=main
+
+.PHONY: yarn-start-ui
+yarn-start-ui:
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& yarn install \
+    && yarn build \
+    && yarn start \
+
+# run-cypress:
+.PHONY: start-ui
+start-ui: development-api
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& export NODE_ENV=production \
+	&& export NODE_PORT=3003 \
+	&& export LAGOON_UI_TOURS_ENABLED=disabled \
+	&& docker compose -p $(CI_BUILD_TAG) --compatibility up --build -d ui
+
+.PHONY: development-api
+development-api:
+	export LAGOON_CORE=$$(mktemp -d ./lagoon-core.XXX) \
+	&& export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& git clone $(CORE_REPO) "$$LAGOON_CORE" \
+	&& cd "$$LAGOON_CORE" \
+	&& git checkout $(CORE_TREEISH) \
+	&& IMAGE_REPO=$(LAGOON_CORE_IMAGE_REPO) IMAGE_REPO_TAG=$(LAGOON_CORE_IMAGE_TAG) COMPOSE_STACK_NAME=core-$(CI_BUILD_TAG) docker compose -p core-$(CI_BUILD_TAG) pull \
+	&& IMAGE_REPO=$(LAGOON_CORE_IMAGE_REPO) IMAGE_REPO_TAG=$(LAGOON_CORE_IMAGE_TAG) COMPOSE_STACK_NAME=core-$(CI_BUILD_TAG) $(MAKE) compose-api-logs-development
+
+.PHONY: run-cypress-with-development-api
+run-cypress-with-development-api: start-ui
+	$(MAKE) run-cypress
+
+.PHONY: run-cypress
+run-cypress:
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& export UI_URL=http://localhost:3003 \
+	&& docker run --rm -it --network host --name ct-$(CI_BUILD_TAG) \
+		--volume "$$(pwd):/workdir" -w /workdir \
+		-e cypress_api=$$GRAPHQL_API \
+		-e cypress_keycloak=$$KEYCLOAK_API \
+		-e cypress_url=$$UI_URL \
+		--entrypoint=/bin/bash $(CYPRESS_BASE) ./cypress/run.sh
+
+.PHONY: development-api-down
+development-api-down:
+	docker compose -p core-$(CI_BUILD_TAG) --compatibility down -v --remove-orphans
+
+.PHONY: down
+down:
+	$(MAKE) development-api-down
+	docker compose -p $(CI_BUILD_TAG) --compatibility down -v --remove-orphans

cypress/cypress.config.ts

@@ -6,7 +6,7 @@ export default defineConfig({
   e2e: {
     env: {
       api: 'http://0.0.0.0:33000/graphql',
-      keycloak: 'http://0.0.0.0:38088',
+      keycloak: 'http://0.0.0.0:38088/auth',
       url: 'http://0.0.0.0:3000',
       user_guest: '[email protected]',
       user_reporter: '[email protected]',

cypress/e2e/general/navigation.cy.ts

@@ -46,7 +46,7 @@ describe('Navigation tests', () => {
 
       navigation.getLinkElement('account').click();
 
-      const redirect = `${Cypress.env('keycloak')}/auth/realms/lagoon/account/`;
+      const redirect = `${Cypress.env('keycloak')}/realms/lagoon/account/`;
       cy.origin(redirect, { args: { redirect } }, ({ redirect }) => {
         cy.location().should(loc => {
           expect(loc.toString()).to.eq(redirect);

cypress/run.sh

@@ -0,0 +1,11 @@
+#!/bin/bash
+
+# create cache for repeat runs
+mkdir -p /workdir/cypress_cache
+ln -s /workdir/cypress_cache /root/.cache
+
+yarn --frozen-lockfile
+# run the tests
+yarn cypress:runRbac
+yarn cypress:runGeneral
+yarn cypress:runOrganizations

docker-compose.yml

@@ -12,7 +12,9 @@ x-environment: &default-environment
   LAGOON_ENVIRONMENT_TYPE: production
   GRAPHQL_API: "${GRAPHQL_API:-http://0.0.0.0:3000/graphql}"
   KEYCLOAK_API: "${KEYCLOAK_API:-http://0.0.0.0:8088/auth}"
-  LAGOON_UI_TOURS_ENABLED: enabled
+  LAGOON_UI_TOURS_ENABLED: ${LAGOON_UI_TOURS_ENABLED:-enabled}
+  NODE_ENV: "${NODE_ENV}"
+  NODE_PORT: "${NODE_PORT:-3003}"
 
 services:
   ui:

server.js

@@ -2,7 +2,7 @@ const express = require('express');
 const next = require('next');
 
 const dev = process.env.NODE_ENV !== 'production';
-const port = dev ? 3003 : 3000;
+const port = process.env.NODE_PORT || 3000;
 const app = next({
   dev,
   dir: 'src',