Automated Test firing document.ready() too soon

I have a page that when I manually interact or use CodeGen, the jQuery loads in the correct order and document.ready() fires to initialize the tGrid without any issues. But when I run the test with show browser or trace view, the javascript files are not loaded in the same order and the document.ready() fires too soon and gives me a Uncaught TypeError: jQuery(...).tGrid is not a function.

It seems that this is a common issue with automation runners and most of the suggestions was to replace document.ready() with window.onload. So will need to make a code change over managing my test.

I got the following code snippet but this looks like we allow the document.ready() to fail and then we replay the event after the everything is loaded. Not even sure this would work....

// Wait for jQuery to be available on the page await page.waitForFunction(() => typeof window.jQuery !== 'undefined');

// Wait for the tGrid plugin to be available on the page await page.waitForFunction(() => typeof window.jQuery.fn.tGrid !== 'undefined');

// Now you can proceed to initialize the tGrid plugin await page.evaluate(() => { $('#Grid').tGrid({ // tGrid configuration options }); });

// Wait for some time to ensure the plugin is initialized (optional, use as needed) await page.waitForTimeout(1000);

Has anyone else worked around this issue?

I have also tried adding waits, waitForResponse which have not changed the issue that the document.ready() fires before everything is loaded. Really interested if anyone has a workaround, this is some legacy code so we are just trying to add coverage until it totally gets rewriten. Thanks for taking the time to have a look.