Hacky, unstable capture canvas of Bldrs Share

hacky-capture.ts

import { chromium } from 'playwright'

export default class Capture {
    async capture(url: string, filename: string, width: number = 1280, height: number = 720): Promise<void> {
        const browser = await chromium.launch()
        const context = await browser.newContext({
            viewport: {
                width: width,
                height: height,
            },
            deviceScaleFactor: 1,
        })
        await context.addCookies([
            { name: 'isFirstTime', value: 'false', domain: '.bldrs.ai', path: '/' },
        ])

        const page = await context.newPage()
        await page.emulateMedia({ media: 'screen' })
        await page.goto(url)
        await page.waitForNavigation({ waitUntil: 'domcontentloaded' })

        const viewer = await page.waitForSelector('canvas')
        await page.locator('.makeStyles-topLeftContainer-2').evaluate(el => el.style.display = 'none')
        await page.locator('.makeStyles-logoGroup-8').evaluate(el => el.style.display = 'none')
        await page.locator('.makeStyles-operationsGroup-4').evaluate(el => el.style.display = 'none')

        await viewer.screenshot({
            path: 'share.png',
        })
      
        await browser.close()
    }
}

share.png