@curiousvlxd/linkedin-badge-renderer 0.1.15 → 0.1.18

package/README.md

@@ -1,11 +1,15 @@
 # linkedin-badge-renderer
 
 <p align="center">
-  <img src="./assets/logo.png" width="200" alt="LinkedIn Badge Renderer Logo" />
+  <img
+    src="https://raw.githubusercontent.com/curiousvlxd/linkedin-badge-renderer/main/assets/logo.png"
+    width="200"
+    alt="LinkedIn Badge Renderer Logo"
+  />
 </p>
 
 <p align="center">
-  <img src="./assets/example.svg" width="400" alt="Generated badge example" />
+  <img src="https://raw.githubusercontent.com/curiousvlxd/linkedin-badge-renderer/main/assets/example.svg" width="400" alt="Generated badge example" />
 </p>
 
 A CLI tool for generating LinkedIn profile badges in SVG, PNG, JPEG, or PDF format.
@@ -117,7 +121,7 @@ jobs:
     with:
       handle: "vladtimchenko"
       format: "svg"
-      out: "dist/linkedin-badge.svg"
+      out: "linkedin-badge.svg"
       theme: "dark"
       size: "large"
       locale: "en_US"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@curiousvlxd/linkedin-badge-renderer",
-  "version": "0.1.15",
+  "version": "0.1.18",
   "type": "module",
   "bin": {
     "linkedin-badge": "src/cli.mjs"

package/src/renderer/formats/pdf.mjs

@@ -8,7 +8,7 @@ import {
 
 export async function renderBadgeArtifacts({ handle, theme, size, locale, orientation, pad }) {
   return await withBrowser(async (browser) => {
-    const context = await createContext(browser);
+    const context = await createContext(browser, theme);
     const page = await context.newPage();
 
     try {
@@ -32,13 +32,18 @@ export async function renderBadgeArtifacts({ handle, theme, size, locale, orient
       await frame.waitForLoadState("load").catch(() => {});
 
       await frame
-        .waitForSelector("img", {
-          state: "visible",
-          timeout: 15000,
+        .waitForSelector(".profile-badge__content, .profile-badge__name, .profile-badge__cta-btn", {
+          timeout: 30000,
         })
         .catch(() => {});
 
-      await frame.waitForTimeout(300);
+      await frame
+        .waitForFunction(() => {
+          const imgs = Array.from(document.images || []);
+          if (!imgs.length) return false;
+          return imgs.every((i) => i.complete && i.naturalWidth > 0);
+        }, { timeout: 30000 })
+        .catch(() => {});
 
       const { badgeInner, cssHrefs } = await extractBadgeFromIframe(frame);
       const renderHtml = buildRenderHtml({ badgeInner, cssHrefs, pad });
@@ -93,4 +98,4 @@ export async function renderBadgeArtifacts({ handle, theme, size, locale, orient
       await context.close().catch(() => {});
     }
   });
-}
+}

package/src/renderer/playwright.mjs

@@ -9,20 +9,14 @@ export async function withBrowser(fn) {
   }
 }
 
-export async function createContext(browser) {
+export async function createContext(browser, theme = "light") {
   return await browser.newContext({
     userAgent:
       "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36",
-
     locale: "en-US",
-
-    viewport: {
-      width: 1920,
-      height: 1080,
-    },
-
+    viewport: { width: 1920, height: 1080 },
     deviceScaleFactor: 1.5,
-    colorScheme: "dark",
+    colorScheme: theme === "dark" ? "dark" : "light",
     reducedMotion: "no-preference",
   });
 }