@noego/forge 0.1.17 → 0.1.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/forge.js +1 -1
- package/dist-ssr/test.cjs +3 -0
- package/dist-ssr/test.cjs.map +1 -1
- package/dist-ssr/test.d.ts +4 -0
- package/dist-ssr/test.js +3 -0
- package/dist-ssr/test.js.map +1 -1
- package/package.json +1 -1
package/bin/forge.js
CHANGED
package/dist-ssr/test.cjs
CHANGED
|
@@ -209,6 +209,9 @@ class ImageRenderer {
|
|
|
209
209
|
error instanceof Error ? error : void 0
|
|
210
210
|
);
|
|
211
211
|
}
|
|
212
|
+
if (options == null ? void 0 : options.beforeCapture) {
|
|
213
|
+
await options.beforeCapture(page);
|
|
214
|
+
}
|
|
212
215
|
const screenshotOptions = {
|
|
213
216
|
type: this.config.format,
|
|
214
217
|
fullPage: (options == null ? void 0 : options.fullPage) ?? true
|
package/dist-ssr/test.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"test.cjs","sources":["../src/test/allow_cli.ts","../src/test/index.ts"],"sourcesContent":["export class ForgeCLIRequiredError extends Error {\n name = 'ForgeCLIRequiredError' as const;\n constructor() {\n super(\n 'This file must be run with the forge CLI, not directly with tsx/node.\\n\\n' +\n 'Usage:\\n' +\n ' npx forge test/ui/your-test.ts\\n' +\n ' npx forge \"test/ui/**/*.test.ts\"\\n\\n' +\n 'The forge CLI provides the necessary Svelte loader for rendering components.'\n );\n }\n}\n\n//We need to throw on import so that this crashes right away\nif (!process.env.FORGE_CLI) {\n throw new ForgeCLIRequiredError();\n}","import './allow_cli';\n// Type-only import - erased at runtime, won't trigger module loading\nimport type { StaticRenderer } from '../static/index';\nimport * as fs from 'fs';\nimport * as path from 'path';\n\nexport type { StaticRenderer };\n\n\n\n// ─────────────────────────────────────────────────────────────\n// Error Classes\n// ─────────────────────────────────────────────────────────────\n\n\n\nexport class PlaywrightNotInstalledError extends Error {\n name = 'PlaywrightNotInstalledError' as const;\n constructor() {\n super(\n 'ImageRenderer requires Playwright. Install it with:\\n' +\n ' npm install playwright\\n' +\n ' npx playwright install chromium'\n );\n }\n}\n\nexport class BrowserLaunchError extends Error {\n name = 'BrowserLaunchError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\nexport class RenderTimeoutError extends Error {\n name = 'RenderTimeoutError' as const;\n constructor(timeoutMs: number) {\n super(`Render timed out after ${timeoutMs}ms`);\n }\n}\n\nexport class RenderError extends Error {\n name = 'RenderError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface ImageRendererConfig {\n /** Output directory for screenshots */\n outputDir: string;\n /** Default width (default: 1920) */\n width?: number;\n /** Default height (default: 1080) */\n height?: number;\n /** Device scale factor for retina (default: 1) */\n deviceScaleFactor?: number;\n /** Image format (default: 'png') */\n format?: 'png' | 'jpeg';\n /** JPEG quality 0-100 (default: 80) */\n quality?: number;\n /** Wait condition (default: 'networkidle') */\n waitUntil?: 'load' | 'domcontentloaded' | 'networkidle';\n /** Timeout in ms (default: 10000) */\n timeoutMs?: number;\n /** Custom HTML template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n template?: string;\n\n // Static renderer config (one of these)\n /** Pre-created StaticRenderer instance */\n staticRenderer?: StaticRenderer;\n /** OR: Path to stitch.yaml */\n stitchConfig?: string;\n /** Component directory (required if stitchConfig provided) */\n componentDir?: string;\n /** Asset path mappings (e.g., { '/images': ['public/images'] }) */\n assets?: Record<string, string[]>;\n}\n\nexport interface CaptureOptions {\n /** View component data */\n view?: any;\n /** Layout data (one object per layout) */\n layout?: any[];\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n}\n\nexport interface CaptureHtmlOptions {\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n}\n\ninterface CaptureResult {\n /** Raw image buffer */\n buffer: Buffer;\n /** Path where image was saved */\n path: string;\n}\n\n// ─────────────────────────────────────────────────────────────\n// Playwright Loader\n// ─────────────────────────────────────────────────────────────\n\ntype PlaywrightModule = typeof import('playwright');\n\nasync function loadPlaywright(): Promise<PlaywrightModule> {\n try {\n const playwright = await import('playwright');\n return playwright;\n } catch {\n throw new PlaywrightNotInstalledError();\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Content Type Helper\n// ─────────────────────────────────────────────────────────────\n\n/**\n * Determines the MIME content type for a file based on its extension.\n * The browser needs this to know how to handle the response\n * (e.g., render an image vs execute JavaScript).\n */\nfunction getContentType(filePath: string): string {\n const ext = path.extname(filePath).toLowerCase();\n const types: Record<string, string> = {\n // Images\n '.png': 'image/png',\n '.jpg': 'image/jpeg',\n '.jpeg': 'image/jpeg',\n '.gif': 'image/gif',\n '.svg': 'image/svg+xml',\n '.webp': 'image/webp',\n // Stylesheets & Scripts\n '.css': 'text/css',\n '.js': 'application/javascript',\n '.json': 'application/json',\n // Fonts\n '.woff': 'font/woff',\n '.woff2': 'font/woff2',\n '.ttf': 'font/ttf',\n };\n // Fallback for unknown extensions\n return types[ext] || 'application/octet-stream';\n}\n\n// ─────────────────────────────────────────────────────────────\n// ImageRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class ImageRenderer {\n private browser: any;\n private staticRenderer: StaticRenderer;\n private config: Required<Omit<ImageRendererConfig, 'staticRenderer' | 'stitchConfig' | 'componentDir' | 'template' | 'assets'>> & {\n outputDir: string;\n template?: string;\n assets?: Record<string, string[]>;\n };\n\n constructor(\n browser: any,\n staticRenderer: StaticRenderer,\n config: ImageRendererConfig\n ) {\n this.browser = browser;\n this.staticRenderer = staticRenderer;\n this.config = {\n outputDir: config.outputDir,\n width: config.width ?? 1920,\n height: config.height ?? 1080,\n deviceScaleFactor: config.deviceScaleFactor ?? 1,\n format: config.format ?? 'png',\n quality: config.quality ?? 80,\n waitUntil: config.waitUntil ?? 'networkidle',\n timeoutMs: config.timeoutMs ?? 10000,\n template: config.template,\n assets: config.assets,\n };\n }\n\n /**\n * Capture a route and save to outputDir\n */\n async capture(\n name: string,\n route: string,\n options?: CaptureOptions\n ): Promise<CaptureResult> {\n // Render route to HTML using StaticRenderer\n const { view, layout } = options ?? {};\n const renderResult = await this.staticRenderer.renderToPage({\n route,\n data: { view, layout },\n template: this.config.template,\n });\n\n // Capture the HTML\n return this.captureHtmlInternal(name, renderResult, options);\n }\n\n /**\n * Capture raw HTML and save to outputDir\n */\n async captureHtml(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n return this.captureHtmlInternal(name, html, options);\n }\n\n /**\n * Internal method to capture HTML to image\n */\n private async captureHtmlInternal(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n const width = options?.width ?? this.config.width;\n const height = options?.height ?? this.config.height;\n\n let context: any;\n let page: any;\n\n try {\n // Create new context with viewport\n context = await this.browser.newContext({\n viewport: { width, height },\n deviceScaleFactor: this.config.deviceScaleFactor,\n });\n\n // Create page\n page = await context.newPage();\n\n // Route Interception Strategy\n // ===========================\n // We use page.goto() with a fake URL instead of page.setContent() because:\n // - setContent() has no base URL, so relative paths like \"/images/...\" can't resolve\n // - goto() with route interception allows all requests (HTML + assets) to be handled\n\n const FAKE_BASE_URL = 'http://forge-renderer/';\n\n // Route the base URL to return the HTML content\n await page.route(FAKE_BASE_URL, async (route: any) => {\n await route.fulfill({\n body: html,\n contentType: 'text/html',\n });\n });\n\n // Asset Route Interception\n // ========================\n // Intercept requests for assets and serve them from the filesystem\n if (this.config.assets) {\n // Loop through each URL path mapping (e.g., '/images' -> ['ui/resources/images'])\n for (const [urlPath, fsPaths] of Object.entries(this.config.assets)) {\n // Register a route handler for all requests matching this URL pattern\n await page.route(`**${urlPath}/**`, async (route: any) => {\n // Extract the relative path from the full URL\n const url = new URL(route.request().url());\n const relativePath = url.pathname.replace(urlPath, '');\n\n // Try each filesystem path in order (supports fallback directories)\n for (const fsPath of fsPaths) {\n // Build the full filesystem path\n const filePath = path.join(fsPath, relativePath);\n\n try {\n // Read the file from disk\n const body = await fs.promises.readFile(filePath);\n\n // Determine the MIME type based on file extension\n const contentType = getContentType(filePath);\n\n // Respond to the browser with the file contents\n await route.fulfill({ body, contentType });\n return; // File found, stop searching\n } catch {\n // File not found in this path, try the next one\n }\n }\n\n // No file found in any path - abort the request\n await route.abort('filenotfound');\n });\n }\n }\n\n // Navigate to fake URL (which returns our HTML via route interception)\n const waitUntilMapping = {\n 'load': 'load',\n 'domcontentloaded': 'domcontentloaded',\n 'networkidle': 'networkidle',\n } as const;\n\n try {\n await page.goto(FAKE_BASE_URL, {\n waitUntil: waitUntilMapping[this.config.waitUntil],\n timeout: this.config.timeoutMs,\n });\n } catch (error) {\n if (error instanceof Error && error.message.includes('timeout')) {\n throw new RenderTimeoutError(this.config.timeoutMs);\n }\n throw new RenderError(\n 'Failed to render HTML content',\n error instanceof Error ? error : undefined\n );\n }\n\n // Take screenshot\n const screenshotOptions: {\n type: 'png' | 'jpeg';\n quality?: number;\n fullPage: boolean;\n } = {\n type: this.config.format,\n fullPage: options?.fullPage ?? true,\n };\n\n // Quality only applies to JPEG\n if (this.config.format === 'jpeg') {\n screenshotOptions.quality = this.config.quality;\n }\n\n const screenshot = await page.screenshot(screenshotOptions);\n const buffer = Buffer.from(screenshot);\n\n // Generate filename: {name}@{width}x{height}.{format}\n const filename = `${name}@${width}x${height}.${this.config.format}`;\n const outputPath = path.join(this.config.outputDir, filename);\n\n // Ensure output directory exists\n await fs.promises.mkdir(this.config.outputDir, { recursive: true });\n\n // Write file\n await fs.promises.writeFile(outputPath, buffer);\n\n return { buffer, path: outputPath };\n\n } finally {\n // Cleanup context and page (browser stays open)\n if (page) {\n await page.close().catch(() => {});\n }\n if (context) {\n await context.close().catch(() => {});\n }\n }\n }\n\n /**\n * Close browser and clean up resources\n */\n async close(): Promise<void> {\n if (this.browser) {\n await this.browser.close().catch(() => {});\n }\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createImageRenderer(\n config: ImageRendererConfig\n): Promise<ImageRenderer> {\n\n // Load Playwright dynamically\n const playwright = await loadPlaywright();\n\n // Launch browser\n let browser: any;\n try {\n browser = await playwright.chromium.launch({\n headless: true,\n });\n } catch (error) {\n throw new BrowserLaunchError(\n 'Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium',\n error instanceof Error ? error : undefined\n );\n }\n\n // Get or create StaticRenderer\n let staticRenderer: StaticRenderer;\n if (config.staticRenderer) {\n staticRenderer = config.staticRenderer;\n } else if (config.stitchConfig && config.componentDir) {\n // Dynamic import to avoid loading Svelte at module resolution time\n const { createStaticRenderer } = await import('../static/index');\n staticRenderer = await createStaticRenderer({\n stitchConfig: config.stitchConfig,\n componentDir: config.componentDir,\n });\n } else {\n throw new Error(\n 'ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir'\n );\n }\n\n return new ImageRenderer(browser, staticRenderer, config);\n}\n"],"names":["path","fs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"test.cjs","sources":["../src/test/allow_cli.ts","../src/test/index.ts"],"sourcesContent":["export class ForgeCLIRequiredError extends Error {\n name = 'ForgeCLIRequiredError' as const;\n constructor() {\n super(\n 'This file must be run with the forge CLI, not directly with tsx/node.\\n\\n' +\n 'Usage:\\n' +\n ' npx forge test/ui/your-test.ts\\n' +\n ' npx forge \"test/ui/**/*.test.ts\"\\n\\n' +\n 'The forge CLI provides the necessary Svelte loader for rendering components.'\n );\n }\n}\n\n//We need to throw on import so that this crashes right away\nif (!process.env.FORGE_CLI) {\n throw new ForgeCLIRequiredError();\n}","import './allow_cli';\n// Type-only import - erased at runtime, won't trigger module loading\nimport type { StaticRenderer } from '../static/index';\nimport * as fs from 'fs';\nimport * as path from 'path';\n\nexport type { StaticRenderer };\n\n\n\n// ─────────────────────────────────────────────────────────────\n// Error Classes\n// ─────────────────────────────────────────────────────────────\n\n\n\nexport class PlaywrightNotInstalledError extends Error {\n name = 'PlaywrightNotInstalledError' as const;\n constructor() {\n super(\n 'ImageRenderer requires Playwright. Install it with:\\n' +\n ' npm install playwright\\n' +\n ' npx playwright install chromium'\n );\n }\n}\n\nexport class BrowserLaunchError extends Error {\n name = 'BrowserLaunchError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\nexport class RenderTimeoutError extends Error {\n name = 'RenderTimeoutError' as const;\n constructor(timeoutMs: number) {\n super(`Render timed out after ${timeoutMs}ms`);\n }\n}\n\nexport class RenderError extends Error {\n name = 'RenderError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface ImageRendererConfig {\n /** Output directory for screenshots */\n outputDir: string;\n /** Default width (default: 1920) */\n width?: number;\n /** Default height (default: 1080) */\n height?: number;\n /** Device scale factor for retina (default: 1) */\n deviceScaleFactor?: number;\n /** Image format (default: 'png') */\n format?: 'png' | 'jpeg';\n /** JPEG quality 0-100 (default: 80) */\n quality?: number;\n /** Wait condition (default: 'networkidle') */\n waitUntil?: 'load' | 'domcontentloaded' | 'networkidle';\n /** Timeout in ms (default: 10000) */\n timeoutMs?: number;\n /** Custom HTML template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n template?: string;\n\n // Static renderer config (one of these)\n /** Pre-created StaticRenderer instance */\n staticRenderer?: StaticRenderer;\n /** OR: Path to stitch.yaml */\n stitchConfig?: string;\n /** Component directory (required if stitchConfig provided) */\n componentDir?: string;\n /** Asset path mappings (e.g., { '/images': ['public/images'] }) */\n assets?: Record<string, string[]>;\n}\n\nexport interface CaptureOptions {\n /** View component data */\n view?: any;\n /** Layout data (one object per layout) */\n layout?: any[];\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n /** Callback executed after page load, before screenshot. Receives the Playwright page object. */\n beforeCapture?: (page: any) => Promise<void>;\n}\n\nexport interface CaptureHtmlOptions {\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n /** Callback executed after page load, before screenshot. Receives the Playwright page object. */\n beforeCapture?: (page: any) => Promise<void>;\n}\n\ninterface CaptureResult {\n /** Raw image buffer */\n buffer: Buffer;\n /** Path where image was saved */\n path: string;\n}\n\n// ─────────────────────────────────────────────────────────────\n// Playwright Loader\n// ─────────────────────────────────────────────────────────────\n\ntype PlaywrightModule = typeof import('playwright');\n\nasync function loadPlaywright(): Promise<PlaywrightModule> {\n try {\n const playwright = await import('playwright');\n return playwright;\n } catch {\n throw new PlaywrightNotInstalledError();\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Content Type Helper\n// ─────────────────────────────────────────────────────────────\n\n/**\n * Determines the MIME content type for a file based on its extension.\n * The browser needs this to know how to handle the response\n * (e.g., render an image vs execute JavaScript).\n */\nfunction getContentType(filePath: string): string {\n const ext = path.extname(filePath).toLowerCase();\n const types: Record<string, string> = {\n // Images\n '.png': 'image/png',\n '.jpg': 'image/jpeg',\n '.jpeg': 'image/jpeg',\n '.gif': 'image/gif',\n '.svg': 'image/svg+xml',\n '.webp': 'image/webp',\n // Stylesheets & Scripts\n '.css': 'text/css',\n '.js': 'application/javascript',\n '.json': 'application/json',\n // Fonts\n '.woff': 'font/woff',\n '.woff2': 'font/woff2',\n '.ttf': 'font/ttf',\n };\n // Fallback for unknown extensions\n return types[ext] || 'application/octet-stream';\n}\n\n// ─────────────────────────────────────────────────────────────\n// ImageRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class ImageRenderer {\n private browser: any;\n private staticRenderer: StaticRenderer;\n private config: Required<Omit<ImageRendererConfig, 'staticRenderer' | 'stitchConfig' | 'componentDir' | 'template' | 'assets'>> & {\n outputDir: string;\n template?: string;\n assets?: Record<string, string[]>;\n };\n\n constructor(\n browser: any,\n staticRenderer: StaticRenderer,\n config: ImageRendererConfig\n ) {\n this.browser = browser;\n this.staticRenderer = staticRenderer;\n this.config = {\n outputDir: config.outputDir,\n width: config.width ?? 1920,\n height: config.height ?? 1080,\n deviceScaleFactor: config.deviceScaleFactor ?? 1,\n format: config.format ?? 'png',\n quality: config.quality ?? 80,\n waitUntil: config.waitUntil ?? 'networkidle',\n timeoutMs: config.timeoutMs ?? 10000,\n template: config.template,\n assets: config.assets,\n };\n }\n\n /**\n * Capture a route and save to outputDir\n */\n async capture(\n name: string,\n route: string,\n options?: CaptureOptions\n ): Promise<CaptureResult> {\n // Render route to HTML using StaticRenderer\n const { view, layout } = options ?? {};\n const renderResult = await this.staticRenderer.renderToPage({\n route,\n data: { view, layout },\n template: this.config.template,\n });\n\n // Capture the HTML\n return this.captureHtmlInternal(name, renderResult, options);\n }\n\n /**\n * Capture raw HTML and save to outputDir\n */\n async captureHtml(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n return this.captureHtmlInternal(name, html, options);\n }\n\n /**\n * Internal method to capture HTML to image\n */\n private async captureHtmlInternal(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n const width = options?.width ?? this.config.width;\n const height = options?.height ?? this.config.height;\n\n let context: any;\n let page: any;\n\n try {\n // Create new context with viewport\n context = await this.browser.newContext({\n viewport: { width, height },\n deviceScaleFactor: this.config.deviceScaleFactor,\n });\n\n // Create page\n page = await context.newPage();\n\n // Route Interception Strategy\n // ===========================\n // We use page.goto() with a fake URL instead of page.setContent() because:\n // - setContent() has no base URL, so relative paths like \"/images/...\" can't resolve\n // - goto() with route interception allows all requests (HTML + assets) to be handled\n\n const FAKE_BASE_URL = 'http://forge-renderer/';\n\n // Route the base URL to return the HTML content\n await page.route(FAKE_BASE_URL, async (route: any) => {\n await route.fulfill({\n body: html,\n contentType: 'text/html',\n });\n });\n\n // Asset Route Interception\n // ========================\n // Intercept requests for assets and serve them from the filesystem\n if (this.config.assets) {\n // Loop through each URL path mapping (e.g., '/images' -> ['ui/resources/images'])\n for (const [urlPath, fsPaths] of Object.entries(this.config.assets)) {\n // Register a route handler for all requests matching this URL pattern\n await page.route(`**${urlPath}/**`, async (route: any) => {\n // Extract the relative path from the full URL\n const url = new URL(route.request().url());\n const relativePath = url.pathname.replace(urlPath, '');\n\n // Try each filesystem path in order (supports fallback directories)\n for (const fsPath of fsPaths) {\n // Build the full filesystem path\n const filePath = path.join(fsPath, relativePath);\n\n try {\n // Read the file from disk\n const body = await fs.promises.readFile(filePath);\n\n // Determine the MIME type based on file extension\n const contentType = getContentType(filePath);\n\n // Respond to the browser with the file contents\n await route.fulfill({ body, contentType });\n return; // File found, stop searching\n } catch {\n // File not found in this path, try the next one\n }\n }\n\n // No file found in any path - abort the request\n await route.abort('filenotfound');\n });\n }\n }\n\n // Navigate to fake URL (which returns our HTML via route interception)\n const waitUntilMapping = {\n 'load': 'load',\n 'domcontentloaded': 'domcontentloaded',\n 'networkidle': 'networkidle',\n } as const;\n\n try {\n await page.goto(FAKE_BASE_URL, {\n waitUntil: waitUntilMapping[this.config.waitUntil],\n timeout: this.config.timeoutMs,\n });\n } catch (error) {\n if (error instanceof Error && error.message.includes('timeout')) {\n throw new RenderTimeoutError(this.config.timeoutMs);\n }\n throw new RenderError(\n 'Failed to render HTML content',\n error instanceof Error ? error : undefined\n );\n }\n\n // Execute beforeCapture callback if provided\n if (options?.beforeCapture) {\n await options.beforeCapture(page);\n }\n\n // Take screenshot\n const screenshotOptions: {\n type: 'png' | 'jpeg';\n quality?: number;\n fullPage: boolean;\n } = {\n type: this.config.format,\n fullPage: options?.fullPage ?? true,\n };\n\n // Quality only applies to JPEG\n if (this.config.format === 'jpeg') {\n screenshotOptions.quality = this.config.quality;\n }\n\n const screenshot = await page.screenshot(screenshotOptions);\n const buffer = Buffer.from(screenshot);\n\n // Generate filename: {name}@{width}x{height}.{format}\n const filename = `${name}@${width}x${height}.${this.config.format}`;\n const outputPath = path.join(this.config.outputDir, filename);\n\n // Ensure output directory exists\n await fs.promises.mkdir(this.config.outputDir, { recursive: true });\n\n // Write file\n await fs.promises.writeFile(outputPath, buffer);\n\n return { buffer, path: outputPath };\n\n } finally {\n // Cleanup context and page (browser stays open)\n if (page) {\n await page.close().catch(() => {});\n }\n if (context) {\n await context.close().catch(() => {});\n }\n }\n }\n\n /**\n * Close browser and clean up resources\n */\n async close(): Promise<void> {\n if (this.browser) {\n await this.browser.close().catch(() => {});\n }\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createImageRenderer(\n config: ImageRendererConfig\n): Promise<ImageRenderer> {\n\n // Load Playwright dynamically\n const playwright = await loadPlaywright();\n\n // Launch browser\n let browser: any;\n try {\n browser = await playwright.chromium.launch({\n headless: true,\n });\n } catch (error) {\n throw new BrowserLaunchError(\n 'Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium',\n error instanceof Error ? error : undefined\n );\n }\n\n // Get or create StaticRenderer\n let staticRenderer: StaticRenderer;\n if (config.staticRenderer) {\n staticRenderer = config.staticRenderer;\n } else if (config.stitchConfig && config.componentDir) {\n // Dynamic import to avoid loading Svelte at module resolution time\n const { createStaticRenderer } = await import('../static/index');\n staticRenderer = await createStaticRenderer({\n stitchConfig: config.stitchConfig,\n componentDir: config.componentDir,\n });\n } else {\n throw new Error(\n 'ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir'\n );\n }\n\n return new ImageRenderer(browser, staticRenderer, config);\n}\n"],"names":["path","fs"],"mappings":"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"}
|
package/dist-ssr/test.d.ts
CHANGED
|
@@ -19,6 +19,8 @@ export declare interface CaptureHtmlOptions {
|
|
|
19
19
|
height?: number;
|
|
20
20
|
/** Capture full page (default: true) */
|
|
21
21
|
fullPage?: boolean;
|
|
22
|
+
/** Callback executed after page load, before screenshot. Receives the Playwright page object. */
|
|
23
|
+
beforeCapture?: (page: any) => Promise<void>;
|
|
22
24
|
}
|
|
23
25
|
|
|
24
26
|
export declare interface CaptureOptions {
|
|
@@ -32,6 +34,8 @@ export declare interface CaptureOptions {
|
|
|
32
34
|
height?: number;
|
|
33
35
|
/** Capture full page (default: true) */
|
|
34
36
|
fullPage?: boolean;
|
|
37
|
+
/** Callback executed after page load, before screenshot. Receives the Playwright page object. */
|
|
38
|
+
beforeCapture?: (page: any) => Promise<void>;
|
|
35
39
|
}
|
|
36
40
|
|
|
37
41
|
declare interface CaptureResult {
|
package/dist-ssr/test.js
CHANGED
|
@@ -168,6 +168,9 @@ class ImageRenderer {
|
|
|
168
168
|
error instanceof Error ? error : void 0
|
|
169
169
|
);
|
|
170
170
|
}
|
|
171
|
+
if (options == null ? void 0 : options.beforeCapture) {
|
|
172
|
+
await options.beforeCapture(page);
|
|
173
|
+
}
|
|
171
174
|
const screenshotOptions = {
|
|
172
175
|
type: this.config.format,
|
|
173
176
|
fullPage: (options == null ? void 0 : options.fullPage) ?? true
|
package/dist-ssr/test.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"test.js","sources":["../src/test/allow_cli.ts","../src/test/index.ts"],"sourcesContent":["export class ForgeCLIRequiredError extends Error {\n name = 'ForgeCLIRequiredError' as const;\n constructor() {\n super(\n 'This file must be run with the forge CLI, not directly with tsx/node.\\n\\n' +\n 'Usage:\\n' +\n ' npx forge test/ui/your-test.ts\\n' +\n ' npx forge \"test/ui/**/*.test.ts\"\\n\\n' +\n 'The forge CLI provides the necessary Svelte loader for rendering components.'\n );\n }\n}\n\n//We need to throw on import so that this crashes right away\nif (!process.env.FORGE_CLI) {\n throw new ForgeCLIRequiredError();\n}","import './allow_cli';\n// Type-only import - erased at runtime, won't trigger module loading\nimport type { StaticRenderer } from '../static/index';\nimport * as fs from 'fs';\nimport * as path from 'path';\n\nexport type { StaticRenderer };\n\n\n\n// ─────────────────────────────────────────────────────────────\n// Error Classes\n// ─────────────────────────────────────────────────────────────\n\n\n\nexport class PlaywrightNotInstalledError extends Error {\n name = 'PlaywrightNotInstalledError' as const;\n constructor() {\n super(\n 'ImageRenderer requires Playwright. Install it with:\\n' +\n ' npm install playwright\\n' +\n ' npx playwright install chromium'\n );\n }\n}\n\nexport class BrowserLaunchError extends Error {\n name = 'BrowserLaunchError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\nexport class RenderTimeoutError extends Error {\n name = 'RenderTimeoutError' as const;\n constructor(timeoutMs: number) {\n super(`Render timed out after ${timeoutMs}ms`);\n }\n}\n\nexport class RenderError extends Error {\n name = 'RenderError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface ImageRendererConfig {\n /** Output directory for screenshots */\n outputDir: string;\n /** Default width (default: 1920) */\n width?: number;\n /** Default height (default: 1080) */\n height?: number;\n /** Device scale factor for retina (default: 1) */\n deviceScaleFactor?: number;\n /** Image format (default: 'png') */\n format?: 'png' | 'jpeg';\n /** JPEG quality 0-100 (default: 80) */\n quality?: number;\n /** Wait condition (default: 'networkidle') */\n waitUntil?: 'load' | 'domcontentloaded' | 'networkidle';\n /** Timeout in ms (default: 10000) */\n timeoutMs?: number;\n /** Custom HTML template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n template?: string;\n\n // Static renderer config (one of these)\n /** Pre-created StaticRenderer instance */\n staticRenderer?: StaticRenderer;\n /** OR: Path to stitch.yaml */\n stitchConfig?: string;\n /** Component directory (required if stitchConfig provided) */\n componentDir?: string;\n /** Asset path mappings (e.g., { '/images': ['public/images'] }) */\n assets?: Record<string, string[]>;\n}\n\nexport interface CaptureOptions {\n /** View component data */\n view?: any;\n /** Layout data (one object per layout) */\n layout?: any[];\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n}\n\nexport interface CaptureHtmlOptions {\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n}\n\ninterface CaptureResult {\n /** Raw image buffer */\n buffer: Buffer;\n /** Path where image was saved */\n path: string;\n}\n\n// ─────────────────────────────────────────────────────────────\n// Playwright Loader\n// ─────────────────────────────────────────────────────────────\n\ntype PlaywrightModule = typeof import('playwright');\n\nasync function loadPlaywright(): Promise<PlaywrightModule> {\n try {\n const playwright = await import('playwright');\n return playwright;\n } catch {\n throw new PlaywrightNotInstalledError();\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Content Type Helper\n// ─────────────────────────────────────────────────────────────\n\n/**\n * Determines the MIME content type for a file based on its extension.\n * The browser needs this to know how to handle the response\n * (e.g., render an image vs execute JavaScript).\n */\nfunction getContentType(filePath: string): string {\n const ext = path.extname(filePath).toLowerCase();\n const types: Record<string, string> = {\n // Images\n '.png': 'image/png',\n '.jpg': 'image/jpeg',\n '.jpeg': 'image/jpeg',\n '.gif': 'image/gif',\n '.svg': 'image/svg+xml',\n '.webp': 'image/webp',\n // Stylesheets & Scripts\n '.css': 'text/css',\n '.js': 'application/javascript',\n '.json': 'application/json',\n // Fonts\n '.woff': 'font/woff',\n '.woff2': 'font/woff2',\n '.ttf': 'font/ttf',\n };\n // Fallback for unknown extensions\n return types[ext] || 'application/octet-stream';\n}\n\n// ─────────────────────────────────────────────────────────────\n// ImageRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class ImageRenderer {\n private browser: any;\n private staticRenderer: StaticRenderer;\n private config: Required<Omit<ImageRendererConfig, 'staticRenderer' | 'stitchConfig' | 'componentDir' | 'template' | 'assets'>> & {\n outputDir: string;\n template?: string;\n assets?: Record<string, string[]>;\n };\n\n constructor(\n browser: any,\n staticRenderer: StaticRenderer,\n config: ImageRendererConfig\n ) {\n this.browser = browser;\n this.staticRenderer = staticRenderer;\n this.config = {\n outputDir: config.outputDir,\n width: config.width ?? 1920,\n height: config.height ?? 1080,\n deviceScaleFactor: config.deviceScaleFactor ?? 1,\n format: config.format ?? 'png',\n quality: config.quality ?? 80,\n waitUntil: config.waitUntil ?? 'networkidle',\n timeoutMs: config.timeoutMs ?? 10000,\n template: config.template,\n assets: config.assets,\n };\n }\n\n /**\n * Capture a route and save to outputDir\n */\n async capture(\n name: string,\n route: string,\n options?: CaptureOptions\n ): Promise<CaptureResult> {\n // Render route to HTML using StaticRenderer\n const { view, layout } = options ?? {};\n const renderResult = await this.staticRenderer.renderToPage({\n route,\n data: { view, layout },\n template: this.config.template,\n });\n\n // Capture the HTML\n return this.captureHtmlInternal(name, renderResult, options);\n }\n\n /**\n * Capture raw HTML and save to outputDir\n */\n async captureHtml(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n return this.captureHtmlInternal(name, html, options);\n }\n\n /**\n * Internal method to capture HTML to image\n */\n private async captureHtmlInternal(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n const width = options?.width ?? this.config.width;\n const height = options?.height ?? this.config.height;\n\n let context: any;\n let page: any;\n\n try {\n // Create new context with viewport\n context = await this.browser.newContext({\n viewport: { width, height },\n deviceScaleFactor: this.config.deviceScaleFactor,\n });\n\n // Create page\n page = await context.newPage();\n\n // Route Interception Strategy\n // ===========================\n // We use page.goto() with a fake URL instead of page.setContent() because:\n // - setContent() has no base URL, so relative paths like \"/images/...\" can't resolve\n // - goto() with route interception allows all requests (HTML + assets) to be handled\n\n const FAKE_BASE_URL = 'http://forge-renderer/';\n\n // Route the base URL to return the HTML content\n await page.route(FAKE_BASE_URL, async (route: any) => {\n await route.fulfill({\n body: html,\n contentType: 'text/html',\n });\n });\n\n // Asset Route Interception\n // ========================\n // Intercept requests for assets and serve them from the filesystem\n if (this.config.assets) {\n // Loop through each URL path mapping (e.g., '/images' -> ['ui/resources/images'])\n for (const [urlPath, fsPaths] of Object.entries(this.config.assets)) {\n // Register a route handler for all requests matching this URL pattern\n await page.route(`**${urlPath}/**`, async (route: any) => {\n // Extract the relative path from the full URL\n const url = new URL(route.request().url());\n const relativePath = url.pathname.replace(urlPath, '');\n\n // Try each filesystem path in order (supports fallback directories)\n for (const fsPath of fsPaths) {\n // Build the full filesystem path\n const filePath = path.join(fsPath, relativePath);\n\n try {\n // Read the file from disk\n const body = await fs.promises.readFile(filePath);\n\n // Determine the MIME type based on file extension\n const contentType = getContentType(filePath);\n\n // Respond to the browser with the file contents\n await route.fulfill({ body, contentType });\n return; // File found, stop searching\n } catch {\n // File not found in this path, try the next one\n }\n }\n\n // No file found in any path - abort the request\n await route.abort('filenotfound');\n });\n }\n }\n\n // Navigate to fake URL (which returns our HTML via route interception)\n const waitUntilMapping = {\n 'load': 'load',\n 'domcontentloaded': 'domcontentloaded',\n 'networkidle': 'networkidle',\n } as const;\n\n try {\n await page.goto(FAKE_BASE_URL, {\n waitUntil: waitUntilMapping[this.config.waitUntil],\n timeout: this.config.timeoutMs,\n });\n } catch (error) {\n if (error instanceof Error && error.message.includes('timeout')) {\n throw new RenderTimeoutError(this.config.timeoutMs);\n }\n throw new RenderError(\n 'Failed to render HTML content',\n error instanceof Error ? error : undefined\n );\n }\n\n // Take screenshot\n const screenshotOptions: {\n type: 'png' | 'jpeg';\n quality?: number;\n fullPage: boolean;\n } = {\n type: this.config.format,\n fullPage: options?.fullPage ?? true,\n };\n\n // Quality only applies to JPEG\n if (this.config.format === 'jpeg') {\n screenshotOptions.quality = this.config.quality;\n }\n\n const screenshot = await page.screenshot(screenshotOptions);\n const buffer = Buffer.from(screenshot);\n\n // Generate filename: {name}@{width}x{height}.{format}\n const filename = `${name}@${width}x${height}.${this.config.format}`;\n const outputPath = path.join(this.config.outputDir, filename);\n\n // Ensure output directory exists\n await fs.promises.mkdir(this.config.outputDir, { recursive: true });\n\n // Write file\n await fs.promises.writeFile(outputPath, buffer);\n\n return { buffer, path: outputPath };\n\n } finally {\n // Cleanup context and page (browser stays open)\n if (page) {\n await page.close().catch(() => {});\n }\n if (context) {\n await context.close().catch(() => {});\n }\n }\n }\n\n /**\n * Close browser and clean up resources\n */\n async close(): Promise<void> {\n if (this.browser) {\n await this.browser.close().catch(() => {});\n }\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createImageRenderer(\n config: ImageRendererConfig\n): Promise<ImageRenderer> {\n\n // Load Playwright dynamically\n const playwright = await loadPlaywright();\n\n // Launch browser\n let browser: any;\n try {\n browser = await playwright.chromium.launch({\n headless: true,\n });\n } catch (error) {\n throw new BrowserLaunchError(\n 'Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium',\n error instanceof Error ? error : undefined\n );\n }\n\n // Get or create StaticRenderer\n let staticRenderer: StaticRenderer;\n if (config.staticRenderer) {\n staticRenderer = config.staticRenderer;\n } else if (config.stitchConfig && config.componentDir) {\n // Dynamic import to avoid loading Svelte at module resolution time\n const { createStaticRenderer } = await import('../static/index');\n staticRenderer = await createStaticRenderer({\n stitchConfig: config.stitchConfig,\n componentDir: config.componentDir,\n });\n } else {\n throw new Error(\n 'ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir'\n );\n }\n\n return new ImageRenderer(browser, staticRenderer, config);\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"test.js","sources":["../src/test/allow_cli.ts","../src/test/index.ts"],"sourcesContent":["export class ForgeCLIRequiredError extends Error {\n name = 'ForgeCLIRequiredError' as const;\n constructor() {\n super(\n 'This file must be run with the forge CLI, not directly with tsx/node.\\n\\n' +\n 'Usage:\\n' +\n ' npx forge test/ui/your-test.ts\\n' +\n ' npx forge \"test/ui/**/*.test.ts\"\\n\\n' +\n 'The forge CLI provides the necessary Svelte loader for rendering components.'\n );\n }\n}\n\n//We need to throw on import so that this crashes right away\nif (!process.env.FORGE_CLI) {\n throw new ForgeCLIRequiredError();\n}","import './allow_cli';\n// Type-only import - erased at runtime, won't trigger module loading\nimport type { StaticRenderer } from '../static/index';\nimport * as fs from 'fs';\nimport * as path from 'path';\n\nexport type { StaticRenderer };\n\n\n\n// ─────────────────────────────────────────────────────────────\n// Error Classes\n// ─────────────────────────────────────────────────────────────\n\n\n\nexport class PlaywrightNotInstalledError extends Error {\n name = 'PlaywrightNotInstalledError' as const;\n constructor() {\n super(\n 'ImageRenderer requires Playwright. Install it with:\\n' +\n ' npm install playwright\\n' +\n ' npx playwright install chromium'\n );\n }\n}\n\nexport class BrowserLaunchError extends Error {\n name = 'BrowserLaunchError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\nexport class RenderTimeoutError extends Error {\n name = 'RenderTimeoutError' as const;\n constructor(timeoutMs: number) {\n super(`Render timed out after ${timeoutMs}ms`);\n }\n}\n\nexport class RenderError extends Error {\n name = 'RenderError' as const;\n constructor(message: string, public cause?: Error) {\n super(message);\n }\n}\n\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface ImageRendererConfig {\n /** Output directory for screenshots */\n outputDir: string;\n /** Default width (default: 1920) */\n width?: number;\n /** Default height (default: 1080) */\n height?: number;\n /** Device scale factor for retina (default: 1) */\n deviceScaleFactor?: number;\n /** Image format (default: 'png') */\n format?: 'png' | 'jpeg';\n /** JPEG quality 0-100 (default: 80) */\n quality?: number;\n /** Wait condition (default: 'networkidle') */\n waitUntil?: 'load' | 'domcontentloaded' | 'networkidle';\n /** Timeout in ms (default: 10000) */\n timeoutMs?: number;\n /** Custom HTML template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n template?: string;\n\n // Static renderer config (one of these)\n /** Pre-created StaticRenderer instance */\n staticRenderer?: StaticRenderer;\n /** OR: Path to stitch.yaml */\n stitchConfig?: string;\n /** Component directory (required if stitchConfig provided) */\n componentDir?: string;\n /** Asset path mappings (e.g., { '/images': ['public/images'] }) */\n assets?: Record<string, string[]>;\n}\n\nexport interface CaptureOptions {\n /** View component data */\n view?: any;\n /** Layout data (one object per layout) */\n layout?: any[];\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n /** Callback executed after page load, before screenshot. Receives the Playwright page object. */\n beforeCapture?: (page: any) => Promise<void>;\n}\n\nexport interface CaptureHtmlOptions {\n /** Override width */\n width?: number;\n /** Override height */\n height?: number;\n /** Capture full page (default: true) */\n fullPage?: boolean;\n /** Callback executed after page load, before screenshot. Receives the Playwright page object. */\n beforeCapture?: (page: any) => Promise<void>;\n}\n\ninterface CaptureResult {\n /** Raw image buffer */\n buffer: Buffer;\n /** Path where image was saved */\n path: string;\n}\n\n// ─────────────────────────────────────────────────────────────\n// Playwright Loader\n// ─────────────────────────────────────────────────────────────\n\ntype PlaywrightModule = typeof import('playwright');\n\nasync function loadPlaywright(): Promise<PlaywrightModule> {\n try {\n const playwright = await import('playwright');\n return playwright;\n } catch {\n throw new PlaywrightNotInstalledError();\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Content Type Helper\n// ─────────────────────────────────────────────────────────────\n\n/**\n * Determines the MIME content type for a file based on its extension.\n * The browser needs this to know how to handle the response\n * (e.g., render an image vs execute JavaScript).\n */\nfunction getContentType(filePath: string): string {\n const ext = path.extname(filePath).toLowerCase();\n const types: Record<string, string> = {\n // Images\n '.png': 'image/png',\n '.jpg': 'image/jpeg',\n '.jpeg': 'image/jpeg',\n '.gif': 'image/gif',\n '.svg': 'image/svg+xml',\n '.webp': 'image/webp',\n // Stylesheets & Scripts\n '.css': 'text/css',\n '.js': 'application/javascript',\n '.json': 'application/json',\n // Fonts\n '.woff': 'font/woff',\n '.woff2': 'font/woff2',\n '.ttf': 'font/ttf',\n };\n // Fallback for unknown extensions\n return types[ext] || 'application/octet-stream';\n}\n\n// ─────────────────────────────────────────────────────────────\n// ImageRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class ImageRenderer {\n private browser: any;\n private staticRenderer: StaticRenderer;\n private config: Required<Omit<ImageRendererConfig, 'staticRenderer' | 'stitchConfig' | 'componentDir' | 'template' | 'assets'>> & {\n outputDir: string;\n template?: string;\n assets?: Record<string, string[]>;\n };\n\n constructor(\n browser: any,\n staticRenderer: StaticRenderer,\n config: ImageRendererConfig\n ) {\n this.browser = browser;\n this.staticRenderer = staticRenderer;\n this.config = {\n outputDir: config.outputDir,\n width: config.width ?? 1920,\n height: config.height ?? 1080,\n deviceScaleFactor: config.deviceScaleFactor ?? 1,\n format: config.format ?? 'png',\n quality: config.quality ?? 80,\n waitUntil: config.waitUntil ?? 'networkidle',\n timeoutMs: config.timeoutMs ?? 10000,\n template: config.template,\n assets: config.assets,\n };\n }\n\n /**\n * Capture a route and save to outputDir\n */\n async capture(\n name: string,\n route: string,\n options?: CaptureOptions\n ): Promise<CaptureResult> {\n // Render route to HTML using StaticRenderer\n const { view, layout } = options ?? {};\n const renderResult = await this.staticRenderer.renderToPage({\n route,\n data: { view, layout },\n template: this.config.template,\n });\n\n // Capture the HTML\n return this.captureHtmlInternal(name, renderResult, options);\n }\n\n /**\n * Capture raw HTML and save to outputDir\n */\n async captureHtml(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n return this.captureHtmlInternal(name, html, options);\n }\n\n /**\n * Internal method to capture HTML to image\n */\n private async captureHtmlInternal(\n name: string,\n html: string,\n options?: CaptureHtmlOptions\n ): Promise<CaptureResult> {\n const width = options?.width ?? this.config.width;\n const height = options?.height ?? this.config.height;\n\n let context: any;\n let page: any;\n\n try {\n // Create new context with viewport\n context = await this.browser.newContext({\n viewport: { width, height },\n deviceScaleFactor: this.config.deviceScaleFactor,\n });\n\n // Create page\n page = await context.newPage();\n\n // Route Interception Strategy\n // ===========================\n // We use page.goto() with a fake URL instead of page.setContent() because:\n // - setContent() has no base URL, so relative paths like \"/images/...\" can't resolve\n // - goto() with route interception allows all requests (HTML + assets) to be handled\n\n const FAKE_BASE_URL = 'http://forge-renderer/';\n\n // Route the base URL to return the HTML content\n await page.route(FAKE_BASE_URL, async (route: any) => {\n await route.fulfill({\n body: html,\n contentType: 'text/html',\n });\n });\n\n // Asset Route Interception\n // ========================\n // Intercept requests for assets and serve them from the filesystem\n if (this.config.assets) {\n // Loop through each URL path mapping (e.g., '/images' -> ['ui/resources/images'])\n for (const [urlPath, fsPaths] of Object.entries(this.config.assets)) {\n // Register a route handler for all requests matching this URL pattern\n await page.route(`**${urlPath}/**`, async (route: any) => {\n // Extract the relative path from the full URL\n const url = new URL(route.request().url());\n const relativePath = url.pathname.replace(urlPath, '');\n\n // Try each filesystem path in order (supports fallback directories)\n for (const fsPath of fsPaths) {\n // Build the full filesystem path\n const filePath = path.join(fsPath, relativePath);\n\n try {\n // Read the file from disk\n const body = await fs.promises.readFile(filePath);\n\n // Determine the MIME type based on file extension\n const contentType = getContentType(filePath);\n\n // Respond to the browser with the file contents\n await route.fulfill({ body, contentType });\n return; // File found, stop searching\n } catch {\n // File not found in this path, try the next one\n }\n }\n\n // No file found in any path - abort the request\n await route.abort('filenotfound');\n });\n }\n }\n\n // Navigate to fake URL (which returns our HTML via route interception)\n const waitUntilMapping = {\n 'load': 'load',\n 'domcontentloaded': 'domcontentloaded',\n 'networkidle': 'networkidle',\n } as const;\n\n try {\n await page.goto(FAKE_BASE_URL, {\n waitUntil: waitUntilMapping[this.config.waitUntil],\n timeout: this.config.timeoutMs,\n });\n } catch (error) {\n if (error instanceof Error && error.message.includes('timeout')) {\n throw new RenderTimeoutError(this.config.timeoutMs);\n }\n throw new RenderError(\n 'Failed to render HTML content',\n error instanceof Error ? error : undefined\n );\n }\n\n // Execute beforeCapture callback if provided\n if (options?.beforeCapture) {\n await options.beforeCapture(page);\n }\n\n // Take screenshot\n const screenshotOptions: {\n type: 'png' | 'jpeg';\n quality?: number;\n fullPage: boolean;\n } = {\n type: this.config.format,\n fullPage: options?.fullPage ?? true,\n };\n\n // Quality only applies to JPEG\n if (this.config.format === 'jpeg') {\n screenshotOptions.quality = this.config.quality;\n }\n\n const screenshot = await page.screenshot(screenshotOptions);\n const buffer = Buffer.from(screenshot);\n\n // Generate filename: {name}@{width}x{height}.{format}\n const filename = `${name}@${width}x${height}.${this.config.format}`;\n const outputPath = path.join(this.config.outputDir, filename);\n\n // Ensure output directory exists\n await fs.promises.mkdir(this.config.outputDir, { recursive: true });\n\n // Write file\n await fs.promises.writeFile(outputPath, buffer);\n\n return { buffer, path: outputPath };\n\n } finally {\n // Cleanup context and page (browser stays open)\n if (page) {\n await page.close().catch(() => {});\n }\n if (context) {\n await context.close().catch(() => {});\n }\n }\n }\n\n /**\n * Close browser and clean up resources\n */\n async close(): Promise<void> {\n if (this.browser) {\n await this.browser.close().catch(() => {});\n }\n }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createImageRenderer(\n config: ImageRendererConfig\n): Promise<ImageRenderer> {\n\n // Load Playwright dynamically\n const playwright = await loadPlaywright();\n\n // Launch browser\n let browser: any;\n try {\n browser = await playwright.chromium.launch({\n headless: true,\n });\n } catch (error) {\n throw new BrowserLaunchError(\n 'Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium',\n error instanceof Error ? error : undefined\n );\n }\n\n // Get or create StaticRenderer\n let staticRenderer: StaticRenderer;\n if (config.staticRenderer) {\n staticRenderer = config.staticRenderer;\n } else if (config.stitchConfig && config.componentDir) {\n // Dynamic import to avoid loading Svelte at module resolution time\n const { createStaticRenderer } = await import('../static/index');\n staticRenderer = await createStaticRenderer({\n stitchConfig: config.stitchConfig,\n componentDir: config.componentDir,\n });\n } else {\n throw new Error(\n 'ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir'\n );\n }\n\n return new ImageRenderer(browser, staticRenderer, config);\n}\n"],"names":[],"mappings":"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"}
|