Update node versions tested

.devcontainer/Dockerfile

@@ -1,19 +1,5 @@
-# See here for image contents: https://github.com/microsoft/vscode-dev-containers/tree/v0.177.0/containers/typescript-node/.devcontainer/base.Dockerfile
 
-# [Choice] Node.js version: 16, 14, 12
-ARG VARIANT="16-buster"
-FROM mcr.microsoft.com/vscode/devcontainers/typescript-node:0-${VARIANT}
-
-# [Optional] Uncomment this section to install additional OS packages.
-# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
-#     && apt-get -y install --no-install-recommends <your-package-list-here>
-
-# [Optional] Uncomment if you want to install an additional version of node using nvm
-# ARG EXTRA_NODE_VERSION=10
-# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
-
-# [Optional] Uncomment if you want to install more global node packages
-# RUN su node -c "npm install -g <your-package-list -here>"
+FROM mcr.microsoft.com/devcontainers/base:bookworm
 
 RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
-     && apt-get -y install --no-install-recommends chromium-driver
+     && apt-get -y install --no-install-recommends chromium-driver build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev

.devcontainer/devcontainer.json

@@ -1,26 +1,23 @@
-// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
-// https://github.com/microsoft/vscode-dev-containers/tree/v0.177.0/containers/typescript-node
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/debian
 {
-	"name": "Node.js & TypeScript",
+	"name": "Debian",
+	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+	// "image": "mcr.microsoft.com/devcontainers/base:bookworm",
 	"build": {
-		"dockerfile": "Dockerfile",
-		// Update 'VARIANT' to pick a Node version: 12, 14, 16
-		"args": {
-			"VARIANT": "16"
-		}
-	},
-	// Set *default* container specific settings.json values on container create.
-	"settings": {
-		"terminal.integrated.shell.linux": "/bin/bash"
+		"dockerfile": "Dockerfile"
 	},
-	// Add the IDs of extensions you want installed when the container is created.
-	"extensions": [
-		"dbaeumer.vscode-eslint"
-	],
+	"features": {
+		"ghcr.io/devcontainers/features/node:1": {
+			"version": 22
+		}
+	}
+	// Features to add to the dev container. More info: https://containers.dev/features.
+	// "features": {},
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	// "forwardPorts": [],
-	// Use 'postCreateCommand' to run commands after the container is created.
-	// "postCreateCommand": "yarn install",
-	// Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-	// "remoteUser": "node"
+	// Configure tool-specific properties.
+	// "customizations": {},
+	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
+	// "remoteUser": "root"
 }

.github/workflows/publish.yml

@@ -11,7 +11,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 14
+          node-version: 22
           registry-url: 'https://registry.npmjs.org'  
       - run: npm ci
       - run: npm publish

.github/workflows/tests.yml

@@ -13,15 +13,17 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x, 14.x, 16.x]
+        node-version: [18.x, 20.x, 22.x]
 
     steps:
       - uses: actions/checkout@v2
       - name: Use Node.js ${{ matrix.node-version }}
         uses: actions/setup-node@v2
         with:
           node-version: ${{ matrix.node-version }}
+      - run: sudo apt-get -y install --no-install-recommends chromium-driver build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev
       - run: npm ci
+      - run: npx puppeteer browsers install chrome
       - run: npm run build
       - run: npm run lint
       - run: npm test

examples/testsuite/index.ts

@@ -1,7 +1,27 @@
 import { fitGradient, getPalette } from '../../src/lib';
 import { fitGradient as fitGradientInternal } from '../../src/fitGradient';
 import './index.css';
-import * as index from './unsplash/small/index.json';
+
+// nasty hardcoded index of images to make webpack happy
+const index = {
+  "images": [
+    require("./unsplash/small/abed-ismail-fZXZ1-hbFrY-unsplash.jpg"),
+    require("./unsplash/small/amit-pritam-xO4a2U9jf00-unsplash.jpg"),
+    require("./unsplash/small/bob-brewer-s3dRFddp2lM-unsplash.jpg"),
+    require("./unsplash/small/clement-remond-n5hr-myI-Zo-unsplash.jpg"),
+    require("./unsplash/small/david-clode-zBORpP97apw-unsplash.jpg"),
+    require("./unsplash/small/enguerran-urban-NNfGpEadinQ-unsplash.jpg"),
+    require("./unsplash/small/jeremy-hynes-l_eSPV-eW8o-unsplash.jpg"),
+    require("./unsplash/small/jezael-melgoza-5zEAESyVMzM-unsplash.jpg"),
+    require("./unsplash/small/kevin-chinchilla-tqYpQothXHo-unsplash.jpg"),
+    require("./unsplash/small/nathalia-arantes-WYrvPSf0rlI-unsplash.jpg"),
+    require("./unsplash/small/parsa-mahmoudi-wTsaSE-U7qY-unsplash.jpg"),
+    require("./unsplash/small/sam-ueJJlc4Mclk-unsplash.jpg"),
+    require("./unsplash/small/shio-yang-WlEgMwnNlWY-unsplash.jpg"),
+    require("./unsplash/small/sincerely-media-tpgd1EpaaOE-unsplash.jpg"),
+    require("./unsplash/small/thomas-millot-2JSLLwtM8MU-unsplash.jpg")
+  ]
+};
 
 function processImage(
   imageEl: HTMLImageElement,
@@ -29,7 +49,7 @@ function visualizeLinearRegression(imageEl: HTMLImageElement): HTMLCanvasElement
   const canvas = document.createElement('canvas');
   canvas.width = imageEl.naturalWidth;
   canvas.height = imageEl.naturalHeight;
-  const ctx = canvas.getContext('2d');
+  const ctx = canvas.getContext('2d', { willReadFrequently: true });
   if (!ctx) throw new Error('could not get context');
   ctx.drawImage(imageEl, 0, 0);
   const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
@@ -80,7 +100,7 @@ async function metaDataFromName(name: string) {
     .join(' ');
   const href = `https://unsplash.com/photos/${matches?.[2] || ''}`;
   return {
-    src: (await import(`./unsplash/small/${name}`)).default as string,
+    src: name,
     author,
     href,
   };