Merge pull request #183 from LeastAuthority/176.improve-docker-npm-use

Optimize and cache images w/o npm inside
LeastAuthority · Feb 2, 2024 · b7bf42b · b7bf42b
2 parents 66671a3 + 4c8182e
commit b7bf42b
Show file tree

Hide file tree

Showing 6 changed files with 117 additions and 94 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -22,6 +22,17 @@ jobs:
         with:
           submodules: recursive
 
+      - name: Cache images
+        uses: ScribeMD/[email protected]
+        with:
+          key: |
+            docker-${{ runner.os }}-${{ hashFiles(
+              'docker-compose*.yml',
+              'client/Dockerfile',
+              'client-e2e/Dockerfile',
+              'client-e2e/images/Dockerfile.*'
+            ) }}
+
       - name: Prepare environment
         run: |
           touch ./client/.env
@@ -41,13 +52,30 @@ jobs:
           EOF
           touch ./client-e2e/.env
 
+      - name: Fix group membership
+        run: |
+          # Add the existing `runner` group to avoid the `docker` one
+          sudo adduser runner runner
+          echo "_GID=$(grep -E "^runner:" /etc/group | cut -d: -f3)" >> $GITHUB_ENV
+
+      - name: Build image - if not cached
+        run: |
+          repository=${{ github.repository }}
+          # Verify the cache
+          docker images --quiet ${repository##*/}-client:latest | grep -v "^$" && \
+          CLIENT=0 || CLIENT=1
+          # Build image if client is missing
+          test $CLIENT -eq 0 || \
+            docker compose --progress plain -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e \
+            build --build-arg uid=$(id -u) --build-arg gid=${_GID} client
+
       - name: Prepare containers
         run: |
-          docker compose build --build-arg uid="$(id -u)" --build-arg gid="$(id -g)"
-          docker compose run client npm i
+          docker compose build --build-arg uid="$(id -u)" --build-arg gid="$(id -g)" client
+          docker compose run --no-deps -e CI=true client npm clean-install
 
       - name: Deploy package
-        run: docker compose run client npm run deploy
+        run: docker compose run --no-deps client npm run deploy
 
       - name: Stop containers
         run: docker compose down
diff --git a/.github/workflows/integrate.yml b/.github/workflows/integrate.yml
@@ -25,7 +25,7 @@ jobs:
         uses: fkirc/skip-duplicate-actions@v5
         with:
           concurrent_skipping: "same_content_newer"
-          paths: '["docker-compose.yml", "client/**", "client-e2e/**", ".github/workflows/integrate.yml"]'
+          paths: '["docker-compose*.yml", "client/**", "client-e2e/**", ".github/workflows/integrate.yml"]'
 
   build:
     name: Build/Test
@@ -43,6 +43,17 @@ jobs:
           submodules: recursive
           fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis
 
+      - name: Cache images
+        uses: ScribeMD/[email protected]
+        with:
+          key: |
+            docker-${{ runner.os }}-${{ hashFiles(
+              'docker-compose*.yml',
+              'client/Dockerfile',
+              'client-e2e/Dockerfile',
+              'client-e2e/images/Dockerfile.*'
+            ) }}
+
       - name: Prepare environment
         run: |
           IP=$(ip address show  eth0 | grep inet | cut -d ' ' -f 6 | cut -d '/' -f1 | head -n1)
@@ -60,17 +71,39 @@ jobs:
           printf "Client-e2e .env:\n"
           cat ./.env
 
-      - name: Prepare containers
+      - name: Fix group membership
+        id: fix_group
+        run: |
+          # Add the existing `runner` group to avoid the `docker` one
+          sudo adduser runner runner
+          echo "_GID=$(grep -E "^runner:" /etc/group | cut -d: -f3)" >> $GITHUB_ENV
+
+      - name: Build images - if not cached
+        run: |
+          repository=${{ github.repository }}
+          # Verify the cache
+          docker images --quiet ${repository##*/}-client:latest | grep -v "^$" && \
+          CLIENT=0 || CLIENT=1
+          docker images --quiet ${repository##*/}-client-e2e:latest | grep -v "^$" && \
+          CLIENT_E2E=0 || CLIENT_E2E=1
+          # Build images if any client is missing
+          test $CLIENT -eq 0 -a $CLIENT_E2E -eq 0 || \
+            docker compose --progress plain -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e \
+              build --build-arg uid=$(id -u) --build-arg gid=${_GID}
+
+      - name: Setup containers
         run: |
-          docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e build --build-arg uid="$(id -u)" --build-arg gid="$(id -g)"
-          docker compose run --rm client npm i
-          docker compose run --rm client ./scripts/setup.sh
-          docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e run --rm client-e2e npm i
+          docker compose run --rm --no-deps -e CI=true client npm clean-install
+          docker compose run --rm --no-deps client ./scripts/setup.sh
+          docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e \
+            run --rm --no-deps -e CI=true client-e2e npm clean-install
 
       - name: Start devserver
         run: |
-          docker compose up -d client
+          docker compose --progress plain up -d client
           docker compose exec client ./scripts/wait-for-webpack.sh
+          docker compose ps
+          docker compose logs client
 
       - name: Setup tmate session
         uses: mxschmitt/action-tmate@v3
@@ -81,10 +114,11 @@ jobs:
 
       - name: Run END-2-END tests
         run: |
-          docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e run --rm client-e2e
+          docker compose --progress plain -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e \
+            run --rm client-e2e npm run wdio
 
       - name: Stop containers
-        run: docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e down
+        run: docker compose --profile e2e down
 
       - uses: sonarsource/sonarqube-scan-action@v2
         env:

diff --git a/README.md b/README.md
@@ -35,23 +35,22 @@ git clone --recurse-submodules [email protected]:LeastAuthority/winden.git
 
 ### System Prerequisites
 
-- npm
-- docker
-- docker compose
+- docker (v20.10.24+)
+- docker compose (docker-compose v1.29.2+ should work too)
 
 ### Set up docker images
 
 ```sh
 docker compose build
-docker compose run client npm i
-docker compose run client ./scripts/setup.sh
-docker compose -f docker-compose.yml -f docker-compose.e2e.yml run client-e2e npm i
+docker compose run --no-deps client npm i
+docker compose run --no-deps client ./scripts/setup.sh
+docker compose -f docker-compose.yml -f docker-compose.e2e.yml run --no-deps client-e2e npm i
 ```
 
 ### Set up pre-commit hooks
 
 ```sh
-npm i
+docker compose run --no-deps client npm i
 ```
 
 ### Run development environment
@@ -127,9 +126,9 @@ Run the end-to-end tests with the following
 
 ```sh
 # Run the tests. This would also start the selenium hub if it's not running yet.
-docker compose -f docker-compose.yml -f docker-compose.e2e.yml run --rm client-e2e
+docker compose -f docker-compose.yml -f docker-compose.e2e.yml --profile e2e run --rm client-e2e npm run wdio
 # If running on ARM64, you must use the e2e-arm64 override instead.
-docker compose -f docker-compose.yml -f docker-compose.e2e-arm64.yml run --rm client-e2e
+docker compose -f docker-compose.yml -f docker-compose.e2e-arm64.yml --profile e2e run --rm client-e2e npm run wdio
 
 # Once you're done working with the e2e tests, stop the containers running the selenium hub.
 docker compose --profile e2e down
@@ -145,41 +144,46 @@ And https://webdriver.io/docs/api/browser/debug/
 ## Building
 
 - Create `client/.env` if it does not exist already
-- Fill it with the following for:
+- Fill it with one of the following for:
 
-(Playground environment)
+  - Local development
 
-```sh
-MAILBOX_URL="wss://<mailbox server>/v1"
-RELAY_URL="wss:///<relay server>"
-# Use the following line for a development build
-NODE_ENV=development
-```
+  ```sh
+    MAILBOX_URL="wss://client:8080/mailbox"
+    RELAY_URL="wss://client:8080/relay"
+    ```
 
-(Production environment)
+  - Staging
+
+   ```sh
+    MAILBOX_URL="wss://mailbox.stage.winden.app/v1"
+    RELAY_URL="wss://relay.stage.winden.app"
+    ```
 
-```sh
-# Production
-MAILBOX_URL="wss://<mailbox server>/v1"
-RELAY_URL="wss:///<relay server>"
-# Or use the following line instead for a production build
-NODE_ENV=production
-```
+  - Production
 
-## Deploying
+  ```sh
+    MAILBOX_URL="wss://mailbox.winden.app/v1"
+    RELAY_URL="wss://relay.winden.app"
+    ```
 
-- Create `client/.env` if it does not exist already
-- Fill it with the following: (Replace placeholders in angle brackets with the appropriate values)
+- Add the targeted NodeJS build type:
 
-```sh
-SFTP_USERNAME=<username>
-SFTP_IDENTITY=<path to ssh key>
-SFTP_HOSTNAME=<hostname>
+  - Use the following line for a development build
 
-MAILBOX_URL="wss://<mailbox server>/v1"
-RELAY_URL="wss://<relay server>"
-NODE_ENV=production # or `development` if deploying to playground
-```
+  ```sh
+    NODE_ENV=development
+    ```
+
+  - Or use the following line instead for a production build
+
+  ```sh
+    NODE_ENV=production
+    ```
+
+## Deploying
+
+- Create `client/.env` as described above
 
 Now you can deploy by running the following:
 

diff --git a/client-e2e/Dockerfile b/client-e2e/Dockerfile
@@ -19,19 +19,3 @@ RUN DIRS="/usr/src/app" && \
 
 # Switch to non-root user
 USER ${user}
-
-# Switch to the directory where the client code will live
-WORKDIR /usr/src/app/client-e2e
-
-# Install the required packages... But not really?
-# FIXME: do it or get rid of this block
-COPY package.json .
-COPY package-lock.json .
-#RUN npm install
-
-# Copy the whole context except what is explicitly ignored
-# TODO: be explicit instead?
-COPY . .
-
-# Start the dev server by default
-CMD ["npm", "run", "wdio"]
diff --git a/client/Dockerfile b/client/Dockerfile
@@ -31,33 +31,3 @@ ENV PATH="/home/${user}/.cargo/bin:${PATH}"
 # Install wasm-pack to build the WebAssembly packages
 # FIXME: make it reproducible!
 RUN curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh
-
-# Switch to the parent directory of where the client code will live
-# So the modules installed here will be found by the module resolution
-# See https://nodejs.org/api/modules.html#all-together
-WORKDIR /usr/src/app
-
-RUN npm install @sentry/cli && \
-    npm cache clean --force 2> /dev/null
-ENV SENTRYCLI_SKIP_DOWNLOAD=1
-ARG SENTRYCLI_USE_LOCAL=1
-
-# Install the required packages globaly and unsafely
-COPY package.json .
-COPY package-lock.json .
-RUN npm clean-install && \
-    npm cache clean --force 2> /dev/null
-
-# Add paths to node modules installed above
-ENV PATH=/usr/src/app/node_modules/.bin:$PATH
-
-# Switch to the directory where the client code will live
-WORKDIR /usr/src/app/client
-
-# Copy the whole context except what is explicitly ignored
-# TODO: be explicit instead?
-COPY . .
-
-# Start the dev server by default
-CMD ["npm", "run", "serve"]
-EXPOSE 8080
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -15,6 +15,8 @@ services:
       - ./client/.env
     volumes:
       - ./client:/usr/src/app/client
+    working_dir: /usr/src/app/client
+    command: "npm run serve"
     ports:
       - "8080:8080" # DevServer
       - "35729:35729" # LiveReload
@@ -132,6 +134,7 @@ services:
     volumes:
       - ./client-e2e:/usr/src/app/client-e2e
       - test-downloads:/home/node/downloads
+    working_dir: /usr/src/app/client-e2e
     depends_on:
       client:
         condition: service_started