Merge branch 'release/1.0.29' into v1

.github/workflows/build-and-deploy-docs.yml

@@ -1,15 +1,15 @@
 name: Build and Deploy Docs
 env:
-  DOCS_DEST_DIR: /webperf/
+  DOCS_DEST_DIR: /webperf/v1/
 on:
   push:
     branches:
-      - v3
+      - v1
     paths:
       - 'docs/**'
   pull_request:
     branches:
-      - v3
+      - v1
     paths:
       - 'docs/**'
   workflow_dispatch:
@@ -22,11 +22,11 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        node-version: [14.x]
+        node-version: [ 20.x ]
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
       - run: npm ci
@@ -35,7 +35,7 @@ jobs:
       - name: rsync deployments
         uses: burnett01/[email protected]
         with:
-          switches: -avzr --delete
+          switches: -avzr
           path: ./dist/
           remote_path: ${{ secrets.NYS_DOCS_ROOT }}${{ env.DOCS_DEST_DIR }}
           remote_host: ${{ secrets.NYS_DEPLOY_REMOTE_HOST }}

.github/workflows/code-analysis.yaml

@@ -0,0 +1,40 @@
+name: Code Analysis
+
+on:
+  pull_request: null
+  push:
+    branches:
+      - develop
+  workflow_dispatch:
+permissions:
+  contents: read
+jobs:
+  code_analysis:
+    strategy:
+      fail-fast: false
+      matrix:
+        actions:
+          - name: 'PHPStan'
+            run: composer phpstan
+          - name: 'Coding Standards'
+            run: composer fix-cs
+    name: ${{ matrix.actions.name }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Cache Composer dependencies
+        uses: actions/cache@v4
+        with:
+          path: /tmp/composer-cache
+          key: ${{ runner.os }}-${{ hashFiles('**/composer.lock') }}
+      - name: Setup PHP
+        id: setup-php
+        uses: shivammathur/setup-php@v2
+        with:
+          php-version: 8.2
+          extensions: 'ctype,curl,dom,iconv,imagick,intl,json,mbstring,openssl,pcre,pdo,reflection,spl,zip'
+          ini-values: post_max_size=256M, max_execution_time=180, memory_limit=512M
+          tools: composer:v2
+      - name: Install Composer dependencies
+        run: composer install --no-interaction --no-ansi --no-progress
+      - run: ${{ matrix.actions.run }}

.github/workflows/create-release.yml

@@ -0,0 +1,21 @@
+name: Create Release
+run-name: Create release for ${{ github.event.client_payload.version }}
+
+on:
+  repository_dispatch:
+    types:
+      - craftcms/new-release
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+    steps:
+      - uses: ncipollo/release-action@v1
+        with:
+          body: ${{ github.event.client_payload.notes }}
+          makeLatest: ${{ github.event.client_payload.latest }}
+          name: ${{ github.event.client_payload.version }}
+          prerelease: ${{ github.event.client_payload.prerelease }}
+          tag: ${{ github.event.client_payload.tag }}

CHANGELOG.md

@@ -1,5 +1,23 @@
 # Webperf Changelog
 
+## 1.0.29 - 2024.02.09
+### Added
+* Add `phpstan` and `ecs` code linting
+* Add `code-analysis.yaml` GitHub action
+
+### Changed
+* Add `allow-plugins` for CI
+* Switch over to Vite `^5.0.0` & Node `^20.0.0` for the buildchain
+* Move to using `ServicesTrait` and add getter methods for services
+* Update the Test on Google PageSpeed Insights URL to `pagespeed.web.dev`
+* Clean up search bar CSS
+* Updated docs to use node 20 & a new sitemap plugin
+* ECS code cleanup
+
+### Fixed
+* Update to Boomerang Loader Snippet version 15 to modernize the loader, and eliminage `document.write` warnings
+* Added  the unused `static` to the Tailwind CSS `blocklist` to avoid a name collision with a Craft CSS class ([#1412](https://github.com/nystudio107/craft-seomatic/issues/1412))
+
 ## 1.0.28 - 2022.06.23
 ### Changed
 * Removed the sub resource integrity on the built JavaScript, which could fail if systems were set up that manipulated the incoming JavaScript resources dynamically

buildchain/.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Misc directories & files
+coverage/*
+.stylelintcache

buildchain/Dockerfile

@@ -1,7 +1,7 @@
-ARG TAG=16-alpine
-FROM nystudio107/node-dev-base:$TAG
+ARG TAG=20-alpine
+FROM node:$TAG
 
-USER node
+RUN npm install -g npm@^10.0.0
 
 WORKDIR /app/buildchain/
 

buildchain/Makefile

@@ -1,37 +1,39 @@
-TAG?=16-alpine
-CONTAINER?=$(shell basename $(dir $(CURDIR)))-buildchain
-DOCKERRUN=docker container run \
-	--name ${CONTAINER} \
-	--rm \
-	-t \
-	--network plugindev_default \
-	-p 3001:3001 \
-	-v "${CURDIR}"/../:/app \
-	${CONTAINER}:${TAG}
+MAJOR_VERSION?=1
+TAG?=20-alpine
+CONTAINER?=$(shell basename $(dir $(CURDIR)))-v${MAJOR_VERSION}-buildchain
+DEV_PORT?=300${MAJOR_VERSION}
+IMAGE_INFO=$(shell docker image inspect $(CONTAINER):$(TAG))
+IMAGE_NAME=${CONTAINER}:${TAG}
+DOCKER_NETWORK?=plugindev_default
+DOCKER_RUN=docker container run --rm -it --network "${DOCKER_NETWORK}" -v "${CURDIR}"/../:/app
 
-.PHONY: build dev docker install clean npm
+.PHONY: build clean dev image-build image-check npm ssh
 
-build: docker install
-	${DOCKERRUN} \
-		run build
-dev: docker install
-	${DOCKERRUN} \
-		run dev
-docker:
-	docker build \
-		. \
-		-t ${CONTAINER}:${TAG} \
-		--build-arg TAG=${TAG} \
-		--no-cache
-install: docker
-	${DOCKERRUN} \
-		install --ignore-scripts
+# Perform a dist build via npm run build
+build: image-check
+	${DOCKER_RUN} --name ${CONTAINER}-$@ ${IMAGE_NAME} run build
+# Remove node_modules/ & package-lock.json
 clean:
 	rm -rf node_modules/
 	rm -f package-lock.json
-npm: docker
-	${DOCKERRUN} \
-		$(filter-out $@,$(MAKECMDGOALS))
+# Run the development server via npm run dev
+dev: image-check
+	${DOCKER_RUN} --name ${CONTAINER}-$@ -e DEV_PORT="${DEV_PORT}" -p ${DEV_PORT}:${DEV_PORT} ${IMAGE_NAME} run dev
+# Build the Docker image & run npm install
+image-build:
+	docker build . -t ${IMAGE_NAME} --build-arg TAG=${TAG} --no-cache
+	${DOCKER_RUN} --name ${CONTAINER}-$@ ${IMAGE_NAME} install --ignore-scripts
+# Ensure the image has been created
+image-check:
+ifeq ($(IMAGE_INFO), [])
+image-check: image-build
+endif
+# Run the passed in npm command
+npm: image-check
+	${DOCKER_RUN} --name ${CONTAINER}-$@ ${IMAGE_NAME} $(filter-out $@,$(MAKECMDGOALS)) $(MAKEFLAGS)
+# Open a shell inside of the container
+ssh: image-check
+	${DOCKER_RUN} --name ${CONTAINER}-$@ --entrypoint=/bin/sh ${IMAGE_NAME}
 %:
 	@:
 # ref: https://stackoverflow.com/questions/6273608/how-to-pass-argument-to-makefile-from-command-line

buildchain/README.md

@@ -0,0 +1,58 @@
+# `webperf` buildchain
+
+This buildchain is a self-contained build system for the `webperf` JavaScript bundle.
+
+## Overview
+
+The buildchain builds & bundles all of the `webperf` TypeScript/JavaScript code, Vue components, CSS, and any other static resources via Vite via a Docker container.
+
+Source files:
+
+`buildchain/src/`
+
+Built distribution files:
+
+`src/web/assets/dist/`
+
+## Prerequisites
+
+To run the buildchain for development purposes:
+
+- You must have [Docker Desktop](https://www.docker.com/products/docker-desktop/) (or the equivalent) installed
+- We assume you're using the [`plugindev`](https://github.com/nystudio107/plugindev) development project. If you're not, see the **If you're not using `plugindev`** section below
+
+## Commands
+
+This buildchain uses `make` as an interface to the buildchain. The following commands are available from the `buildchain/` directory:
+
+- `make build` - Do a distribution build of the CantoDamAsset asset bundle resources into `src/web/assets/dist/`
+- `make dev` - Start Vite HMR dev server for local development
+- `make clean` - Remove `node_modules/` and `package-lock.json` to start clean (need to run `make image-build` after doing this, see below)
+- `make npm XXX` - Run an `npm` command inside the container, e.g.: `make npm run lint` or `make npm install`
+- `make ssh` - Open up a shell session into the buildchain Docker container
+- `make image-build` - Build the Docker image & run `npm install`
+
+### If you're not using `plugindev`
+
+If you're not using the [`plugindev`](https://github.com/nystudio107/plugindev) development project, you'll need to follow these steps in order to use the HMR for development in local dev:
+
+- For HMR during local development, you'll need the following variable set in your project's `.env` file:
+```dotenv
+VITE_PLUGIN_DEVSERVER=1
+```
+The [`craft-plugin-vite`](https://github.com/nystudio107/craft-plugin-vite) library looks for this environment variable to determine whether it should check for a running Vite dev server.
+
+#### If you're also using Docker
+
+- So your project can access the buildchain container over the [internal Docker network](https://docs.docker.com/compose/networking/), you'll need to set the `DOCKER_NETWORK` environment variable before running any buildchain `make` commands:
+```bash
+env DOCKER_NETWORK=myproject_default make dev
+```
+...or use any other method for [setting environment variables](https://www.twilio.com/blog/how-to-set-environment-variables.html). This environment variable needs to be set in the shell where you run the buildchain's various `make` commands from, so setting it in your project's `.env` file won't work.
+
+The network your project uses is typically the project name with `_default` appended to it, but it can be explicitly set in the `docker-composer.yaml` like this:
+```yaml
+networks:
+  default:
+    name: someproject_default
+```