0
156
VistasCan't set id on img Tag using puppeteer
I am trying to set id's to all <img> tags of a page, my loop runs its iterations completely but some of the <img> tags doesn't get the id's as can be seen in the below image:
Here is my code:
const browser = await puppeteer.launch({
args: [
'--no-sandbox',
],
});
const page = await browser.newPage();
await page.setViewport({ width: 1440, height: 10000 })
await page.goto(url, {
waitUntil: 'networkidle2',
timeout: 0,
});
await page.evaluate(() => {
const images = document.getElementsByTagName('img') || []
for (let i = 0; i < images.length; i++) {
document.getElementsByTagName('img')[i].id = `${i}`
document.getElementsByTagName('img')[i].src = document.getElementsByTagName('img')[i].getAttribute('src')?.startsWith('https') ?
document.getElementsByTagName('img')[i].getAttribute('src')! :
`https://leza.notion.site${document.getElementsByTagName('img')[i].getAttribute('src')}`
}
})
Am I missing anything? Any help would be highly appreciated!
I keep getting this warning log
PAGE LOG: %c NOTION%c WARNING %c background: black; color: white; background: black; color: orange font-weight: normal Reverting mutation of attribute src from "/image/https%3A%2F%2Fraw.githubusercontent.com%2Feirikmadland%2Fnotion-icons%2Fmaster%2Fv5%2Ficon3%2Ful-file-search-alt.svg?table=block&id=db9359ba-4fcd-4a24-9744-8514d7810939&userId=&cache=v2" -> "https://leza.notion.site/image/https%3A%2F%2Fraw.githubusercontent.com%2Feirikmadland%2Fnotion-icons%2Fmaster%2Fv5%2Ficon3%2Ful-file-search-alt.svg?table=block&id=db9359ba-4fcd-4a24-9744-8514d7810939&userId=&cache=v2" in component JSHandle@object
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Instead of
await page.evaluate(() => {
const images = document.getElementsByTagName('img') || []
try using:
await page.$eval('.img', (images) => { /* DO STUFF... */ });
So the following code should work:
await page.$eval('.img', (images) => {
for (let i = 0; i < images.length; i++) {
const currentImage = images[i];
const targetImageId = `${i}`;
const currentImageSrc = currentImage.getAttribute('src');
const targetImageSrc = currentImageSrc?.startsWith('https')
? currentImageSrc!
: `https://leza.notion.site${currentImageSrc}`;
currentImage.setAttribute("id", targetImageId);
currentImage.setAttribute("src", targetImageSrc);
}
});
Note that your url will look something like the following, which are probably not correct URLs for the two 1st ones:
<img src="http://www.gravatar.com/avatar/8947787d4067fa6e66e485bfc72233e4?s=48&d=identicon&r=PG&f=1">
https://leza.notion.sitehttp://www.gravatar.com/avatar/8947787d4067fa6e66e485bfc72233e4?s=48&d=identicon&r=PG&f=1
or
<img src="image.png">
https://leza.notion.sitemyimage.png
or
<img src="/image.png">
https://leza.notion.sitemy/image.png
·
Juan Pablo Isaza
Denunciar
Responde la pregunta