Migrate to skia-canvas

e2e/index.ts

@@ -1,5 +1,5 @@
 import screenshot from "screenshot-desktop";
-import { createCanvas, loadImage } from "canvas";
+import { Canvas, loadImage } from "skia-canvas";
 import { mkdir, unlink, writeFile } from "node:fs/promises";
 import { basename } from "path";
 import { main } from "../src/main.js";
@@ -25,13 +25,13 @@ async function getDiff(
 
   const before = await loadImage(beforeBuffer);
   const after = await loadImage(afterBuffer);
-  const canvas = createCanvas(before.width, before.height);
+  const canvas = new Canvas(before.width, before.height);
   const ctx = canvas.getContext("2d");
   ctx.drawImage(before, 0, 0);
   ctx.globalCompositeOperation = "difference";
   ctx.drawImage(after, 0, 0);
 
-  await writeFile(`e2e-output/${name}-diff.png`, canvas.toBuffer());
+  await writeFile(`e2e-output/${name}-diff.png`, await canvas.toBuffer("png"));
 
   const diffData = ctx.getImageData(0, 0, before.width, before.height).data;
   let diff = 0;

package.json

@@ -30,7 +30,6 @@
     "@types/node": "^22.9.0",
     "@types/screenshot-desktop": "^1.12.3",
     "@types/yargs": "^17.0.33",
-    "canvas": "^2.11.2",
     "eslint": "^9.13.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
@@ -41,14 +40,16 @@
     "prettier": "^3.3.3",
     "rimraf": "^6.0.1",
     "screenshot-desktop": "^1.15.0",
+    "skia-canvas": "^1.0.2",
     "tsx": "^4.19.2",
     "typescript": "^5.6.3",
     "typescript-eslint": "^8.11.0",
     "vitest": "^2.1.4"
   },
   "dependencies": {
     "yargs": "17.7.2"
-  }, "files": [
+  },
+  "files": [
     "dist/**/*"
   ]
 }