🚨 render timeout & more

- Puppeteer timeout crash fixed
- Docs updated in `bbpkg.configure`
- Options type set as optional in `BitmapsGenerator.ts`
- Changelogs added in `CHANGELOG.md`

CHANGELOG.md

@@ -10,6 +10,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Bibata Rainbow packages move to own repo
+- puppeteer `svg` element timeout fixed
+- optional options typing in `BitmapGenerator.ts`
 - Format `svg` files
 
 ## [Bibata v1.1.0] - 26 Feb 2021

bitmapper/packages/core/src/BitmapsGenerator.ts

@@ -47,7 +47,7 @@ class BitmapsGenerator {
 		}
 
 		const html = toHTML(content);
-		await page.setContent(html);
+		await page.setContent(html, { timeout: 0 });
 
 		const svg = await page.$("#container svg");
 
@@ -57,11 +57,7 @@ class BitmapsGenerator {
 		return svg;
 	}
 
-	public async generateStatic(
-		browser: Browser,
-		content: string,
-		key: string
-	) {
+	public async generateStatic(browser: Browser, content: string, key: string) {
 		const page = await browser.newPage();
 		const svg = await this.getSvgElement(page, content);
 
@@ -86,15 +82,15 @@ class BitmapsGenerator {
 	}
 
 	private async stopAnimation(page: Page) {
-		//@ts-ignore
-		await page._client.send("Animation.setPlaybackRate", {
+		const client = await page.target().createCDPSession();
+		await client.send("Animation.setPlaybackRate", {
 			playbackRate: 0,
 		});
 	}
 
 	private async resumeAnimation(page: Page, playbackRate: number) {
-		//@ts-ignore
-		await page._client.send("Animation.setPlaybackRate", {
+		const client = await page.target().createCDPSession();
+		await client.send("Animation.setPlaybackRate", {
 			playbackRate,
 		});
 	}
@@ -108,18 +104,18 @@ class BitmapsGenerator {
 		browser: Browser,
 		content: string,
 		key: string,
-		options: {
-			playbackRate: number;
-			diff: number;
-			frameLimit: number;
-			framePadding: number;
-		} = {
-			playbackRate: 0.3,
-			diff: 0,
-			frameLimit: 300,
-			framePadding: 4,
+		options?: {
+			playbackRate?: number;
+			diff?: number;
+			frameLimit?: number;
+			framePadding?: number;
 		}
 	) {
+		const opt = Object.assign(
+			{ playbackRate: 0.1, diff: 0, frameLimit: 300, framePadding: 4 },
+			options
+		);
+
 		const page = await browser.newPage();
 		const svg = await this.getSvgElement(page, content);
 		await this.stopAnimation(page);
@@ -130,22 +126,22 @@ class BitmapsGenerator {
 
 		// Rendering frames till `imgN` matched to `imgN-1` (When Animation is done)
 		while (!breakRendering) {
-			if (index > options.frameLimit) {
+			if (index > opt.frameLimit) {
 				throw new Error("Reached the frame limit.");
 			}
 
-			this.resumeAnimation(page, options.playbackRate);
+			await this.resumeAnimation(page, opt.playbackRate);
 			const img: string | Buffer = await this.screenshot(svg);
-			this.stopAnimation(page);
+			await this.stopAnimation(page);
 
 			if (index > 1) {
 				// @ts-ignore
 				const diff = matchImages(prevImg, img);
-				if (diff <= options.diff) {
+				if (diff <= opt.diff) {
 					breakRendering = !breakRendering;
 				}
 			}
-			const number = frameNumber(index, options.framePadding);
+			const number = frameNumber(index, opt.framePadding);
 			const frame = `${key}-${number}.png`;
 
 			this.saveFrameImage(frame, img);
@@ -153,7 +149,6 @@ class BitmapsGenerator {
 			prevImg = img;
 			++index;
 		}
-
 		await page.close();
 	}
 }

builder/bbpkg/configure.py

@@ -16,7 +16,7 @@ def to_tuple(x: X) -> Tuple[X, X]:
 
 
 def get_config(bitmaps_dir, **kwargs) -> Dict[str, Any]:
-    """Return configuration of `GoogleDot` pointers.
+    """Return configuration of `Bibata` pointers.
 
     ```
     Args: