Conversion into multi images/PPTX takes only the first slide if using Chromium >= v89

[yhatt]

Originally reported in marp-team/marp-vscode#202.

Marp CLI has updated Puppeteer to v7.x in #319. It has a breaking change for page.screenshot(). Marp CLI uses this for taking a image of slides while multi-image conversion and PPTX conversion.

⚠ BREAKING CHANGES

• page.screenshot makes a screenshot with the clip dimensions, not cutting it by the ViewPort size.
• chromium: - page.screenshot cuts screenshot content by the ViewPort size, not ViewPort position.

-- https://github.com/puppeteer/puppeteer/releases/tag/v7.0.0

We have taken screenshots by scrolling contents with fixed viewport position, but this change means that way is no longer working in the latest Chromium.

marp-cli/src/converter.ts

Lines 260 to 278 in 1ffcdf5

	await page.setViewport(tpl.rendered.size)
	await page.goto(uri, { waitUntil: ['domcontentloaded', 'networkidle0'] })
	await page.emulateMediaType('print')
	const screenshot = async (pageNumber?: number) => {
	await page.evaluate(
	`window.scrollTo(0,${
	((pageNumber || 1) - 1) * tpl.rendered.size.height
	})`
	)
	if (opts.type === ConvertType.jpeg)
	return (await page.screenshot({
	quality: opts.quality,
	type: 'jpeg',
	})) as Buffer
	return (await page.screenshot({ type: 'png' })) as Buffer
	}

If trying to take screenshots through the latest Google Chrome Canary (>= v90), every slide pages will have only the first slide.

-- marp-team/marp-vscode#202 (reported by @jehunseo)

[yhatt]

I've confirmed this bug in Chromium r843427, the current stable Chrome 89 (for Puppeteer >= v6.0.0). It can fix by simply following Puppeteer's breaking change: Remove window.scrollTo() and add clip option to Page.screenshot().

However, screenshots may break in a previous Chrome 88 (Chromium r818858 / Puppeteer v5.5.0) if took screenshots with clip option. The outdated version of Chrome might be used by some users (e.g. Chrome Enterprise).