Change viewport from within PlaywrightCrawler router me...

At a glance

The community member has a custom Actor that takes screenshots of webpages if they meet certain criteria. They currently set the viewport as a pre-navigation hook, but they would like to take screenshots using both the current viewport size (iPhone 14 Pro Max) and a desktop viewport size. The community member asks how they can change the viewport from within the playwrightRouter function.

In the comments, another community member suggests that in the routerHandler method, the community member has access to the Playwright page object, and they can use the page.setViewportSize() method to change the viewport size, as described in the Playwright documentation. However, there is no explicitly marked answer in the comments.

Useful resources

kkennysmithnanic

I have a custom Actor that takes screenshots of webpages if the webpage meets certain criteria. I currently set viewport as a pre-navigation hook, like this:

Plain Text

preNavigationHooks: [
        async ({ page }) => {
            // await page.setViewportSize({ width, height: 1080 });
            await blocker.enableBlockingInPage(page);
            await page.setViewportSize(iPhone14ProMax.viewport);
        },
    ],

But when I find a page that passes my criteria, I would like to take a screenshot of the page using this viewport size AND a desktop viewport size.

How can I change the viewport from within the playwrightRouter function?

2 comments

kkennysmithnanic

Change viewport from within PlaywrightCrawler router method?

PPepa J

Hi in routerHandler method you have acces to the Playwright page object, then check for https://playwright.dev/docs/api/class-page#page-set-viewport-size there is and brief exaplanation on how to use it and what issues may occur.

Add a reply

Apify Discord Mirror

Change viewport from within PlaywrightCrawler router method?