add DOM elements for sync with puppeteer browser automation - #minor

[mki-c2c]

Experimentation with headless chrome printing via puppeteer has brought the need to detect the end of rendering.

The webviewer acan be opened in an automated browser window (headless) via puppeteer:

const browser = await puppeteer.launch({
    headless: false,
    defaultViewport: {width, height, deviceScaleFactor},
    executablePath: '/usr/bin/google-chrome',
    args: [
        "--no-sandbox",
    ]
});
const page = await browser.newPage();
await page.goto(webviewer_url);

Puppeteer can monitor the DOM and wait until the sync elements appear in the document:

await page.waitForFunction(
    "document.getElementById('maplibre_complete') && document.getElementById('openlayer_complete')",
    {timeout: 10000}
).catch(()=>console.log('timeout after 10s, the web page has not finished rendering'))

Test link

[cypress[bot]]

---

Test summary

210 • 0 • 21 • 0

---

Run details

Project	web-mapviewer
Status	Passed
Commit	d1b29d843a
Started	Aug 20, 2024 4:04 PM
Ended	Aug 20, 2024 4:09 PM
Duration	05:12 💡
OS	Linux Ubuntu -
Browser	Electron 118

View run in Cypress Cloud ➡️

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Cloud