Switched to playwright... puppeteer is kinda clunky

package.json

@@ -21,8 +21,8 @@
     "astro": "^5.10.1",
     "astro-icon": "^1.1.5",
     "lucide-preact": "^0.525.0",
+    "playwright": "^1.53.2",
     "preact": "^10.26.9",
-    "puppeteer": "^24.11.1",
     "sharp": "^0.34.2",
     "tailwindcss": "^4.1.11"
   },

shell.nix

@@ -15,6 +15,11 @@ pkgs.mkShell {
     echo "pnpm version: $(pnpm --version)"
     echo "Chromium path: ${pkgs.chromium}/bin/chromium"
     
+    # Playwright environment variables
+    export PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=1
+    export PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH="${pkgs.chromium}/bin/chromium"
+    
+    # Keep old Puppeteer vars for compatibility (in case you have other code using it)
     export PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true
     export PUPPETEER_EXECUTABLE_PATH="${pkgs.chromium}/bin/chromium"
     
@@ -25,6 +30,8 @@ pkgs.mkShell {
   '';
 
   # Environment variables
+  PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD = "1";
+  PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH = "${pkgs.chromium}/bin/chromium";
   PUPPETEER_SKIP_CHROMIUM_DOWNLOAD = "true";
   PUPPETEER_EXECUTABLE_PATH = "${pkgs.chromium}/bin/chromium";
 }

src/pages/api/resume/pdf.ts

@@ -1,5 +1,5 @@
 import type { APIRoute } from "astro";
-import puppeteer from "puppeteer";
+import { chromium } from 'playwright';
 import { siteConfig } from "../../../config/data";
 import * as TOML from "@iarna/toml";
 
@@ -411,36 +411,34 @@ export const GET: APIRoute = async ({ request }) => {
 
     const htmlContent = await generateResumeHTML(resumeData);
 
-    const browser = await puppeteer.launch({
+    // Launch browser with Playwright
+    const browser = await chromium.launch({
       headless: true,
-      defaultViewport: null,
-      executablePath: process.env.PUPPETEER_EXECUTABLE_PATH ||
+      executablePath: process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH ||
         (process.env.NODE_ENV === "production" ? "/usr/bin/google-chrome" : undefined),
       args: [
-        "--no-sandbox",
-        "--disable-setuid-sandbox",
-        "--disable-dev-shm-usage",
-        "--disable-accelerated-2d-canvas",
-        "--no-first-run",
-        "--no-zygote",
-        "--disable-gpu",
-      ],
+        '--no-sandbox',
+        '--disable-setuid-sandbox',
+        '--disable-dev-shm-usage',
+        '--disable-gpu',
+        '--disable-web-security',
+        '--disable-features=VizDisplayCompositor'
+      ]
     });
 
     const page = await browser.newPage();
 
-    await page.setContent(htmlContent, { waitUntil: "networkidle0" });
+    await page.setContent(htmlContent, { waitUntil: 'networkidle' });
 
     const pdfBuffer = await page.pdf({
-      format: "A4",
+      format: 'A4',
       margin: {
-        top: "0.2in",
-        bottom: "0.2in",
-        left: "0.2in",
-        right: "0.2in",
+        top: '0.2in',
+        bottom: '0.2in',
+        left: '0.2in',
+        right: '0.2in',
       },
       printBackground: true,
-      preferCSSPageSize: false,
       scale: 0.9,
     });
 
@@ -459,4 +457,4 @@ export const GET: APIRoute = async ({ request }) => {
     console.error("Error generating PDF:", error);
     return new Response("Error generating PDF", { status: 500 });
   }
-};
+};