mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-15 17:42:15 +08:00
test(playwright): e2e tests now wait for appload event before proceeding (#25054)
* test(playwright): test new method of waiting * test(): rename global variable to avoid collisions
This commit is contained in:
@ -17,59 +17,7 @@
|
|||||||
window.Ionic = window.Ionic || {};
|
window.Ionic = window.Ionic || {};
|
||||||
window.Ionic.config = window.Ionic.config || {};
|
window.Ionic.config = window.Ionic.config || {};
|
||||||
|
|
||||||
/**
|
window.addEventListener('appload', () => {
|
||||||
* Waits for all child Stencil components
|
window.testAppLoaded = true;
|
||||||
* to be ready before resolving.
|
})
|
||||||
* This logic is pulled from the Stencil
|
|
||||||
* core codebase for testing with Puppeteer:
|
|
||||||
* https://github.com/ionic-team/stencil/blob/16b8ea4dabb22024872a38bc58ba1dcf1c7cc25b/src/testing/puppeteer/puppeteer-events.ts#L158-L183
|
|
||||||
*/
|
|
||||||
const allReady = () => {
|
|
||||||
const promises = [];
|
|
||||||
const waitForDidLoad = (promises, elm) => {
|
|
||||||
if (elm != null && elm.nodeType === 1) {
|
|
||||||
for (let i = 0; i < elm.children.length; i++) {
|
|
||||||
const childElm = elm.children[i];
|
|
||||||
if (childElm.tagName.includes('-') && typeof childElm.componentOnReady === 'function') {
|
|
||||||
promises.push(childElm.componentOnReady());
|
|
||||||
}
|
|
||||||
waitForDidLoad(promises, childElm);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
waitForDidLoad(promises, window.document.documentElement);
|
|
||||||
|
|
||||||
return Promise.all(promises).catch((e) => console.error(e));
|
|
||||||
};
|
|
||||||
|
|
||||||
const waitFrame = () => {
|
|
||||||
return new Promise((resolve) => {
|
|
||||||
requestAnimationFrame(resolve);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const stencilReady = () => {
|
|
||||||
return allReady()
|
|
||||||
.then(() => waitFrame())
|
|
||||||
.then(() => allReady())
|
|
||||||
.then(() => {
|
|
||||||
window.stencilAppLoaded = true;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Testing solutions can wait for `window.stencilAppLoaded === true`
|
|
||||||
* to know when to proceed with the test.
|
|
||||||
*/
|
|
||||||
if (window.document.readyState === 'complete') {
|
|
||||||
stencilReady();
|
|
||||||
} else {
|
|
||||||
document.addEventListener('readystatechange', function (e) {
|
|
||||||
if (e.target.readyState == 'complete') {
|
|
||||||
stencilReady();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -54,7 +54,7 @@ export const test = base.extend<CustomFixtures>({
|
|||||||
const formattedUrl = `${splitUrl[0]}?ionic:_testing=true&ionic:mode=${formattedMode}&rtl=${formattedRtl}`;
|
const formattedUrl = `${splitUrl[0]}?ionic:_testing=true&ionic:mode=${formattedMode}&rtl=${formattedRtl}`;
|
||||||
|
|
||||||
const results = await Promise.all([
|
const results = await Promise.all([
|
||||||
page.waitForFunction(() => (window as any).stencilAppLoaded === true),
|
page.waitForFunction(() => (window as any).testAppLoaded === true),
|
||||||
oldGoTo(formattedUrl),
|
oldGoTo(formattedUrl),
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user