How can I take a screenshot of a table using Puppeteer?

user_5131666 0
Viewed 1125

I'm trying to use Puppeteer to take screenshot of commodities and stock prices, the website is this one. The class I wanna take a screenshot is the .trigo one, but I wanna remove the .abas before. The only way that I could make it works was doing like this:

await page.goto('https://www.canalrural.com.br/cotacao/soja/', {waitUntil: 'networkidle2'});
await page.setViewport({width: 800, height: 1640});
await page.$eval('div.trigo > div > div:nth-child(3) > h3', (el) => el.scrollIntoView());
await page.screenshot({
    path: folder + '02 - soja.jpg',
    type: 'jpeg',
    quality: 70
});

But even the height of the Viewport change every time I check it (because they input new information in the tables)... What is the best way to get the .trigo class content, remove the .abas class and take the screenshot? Thank you guys.

puppeteer node.js automation javascript
1 Answers

You can remove the element using an evaluate expression.

await page.evaluate(() => document.getElementById("abas").remove());

And then you can get the element .trigo and call screenshot on that element.

var el = await page.$('.trigo');
await el.screenshot({
    path: folder + '02 - soja.jpg',
    type: 'jpeg',
    quality: 70
});
user_23732490
Related