mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-09-20 06:11:57 +00:00
63 lines
2.8 KiB
JavaScript
63 lines
2.8 KiB
JavaScript
// @ts-check
|
|
const { test, expect } = require("@playwright/test");
|
|
const { timeout } = require("./playwright.config");
|
|
|
|
test("nested suspense resolves", async ({ page }) => {
|
|
// Wait for the dev server to reload
|
|
await page.goto("http://localhost:5050");
|
|
// Then wait for the page to start loading
|
|
await page.goto("http://localhost:5050", { waitUntil: "commit" });
|
|
|
|
// On the client, we should see some loading text
|
|
const main = page.locator("#main");
|
|
await expect(main).toContainText("Loading 0...");
|
|
|
|
// Expect the page to contain the suspense result from the server
|
|
const mainMessageDiv = page.locator("#children-0");
|
|
const mainMessageTitle = page.locator("#title-0");
|
|
await expect(mainMessageTitle).toContainText("The robot says hello world");
|
|
const mainMessageBody = page.locator("#body-0");
|
|
await expect(mainMessageBody).toContainText(
|
|
"The robot becomes sentient and says hello world"
|
|
);
|
|
|
|
// And expect the title to have resolved on the client
|
|
await expect(page).toHaveTitle("The robot says hello world");
|
|
|
|
// And more loading text for the nested suspense
|
|
await expect(mainMessageDiv).toContainText("Loading 1...");
|
|
await expect(mainMessageDiv).toContainText("Loading 2...");
|
|
await expect(mainMessageDiv).toContainText("Loading 3...");
|
|
|
|
const nestedMessageDiv1 = page.locator("#children-1");
|
|
const nestedMessageTitle1 = page.locator("#title-1");
|
|
await expect(nestedMessageTitle1).toContainText("The world says hello back");
|
|
const nestedMessageBody1 = page.locator("#body-1");
|
|
await expect(nestedMessageBody1).toContainText(
|
|
"In a stunning turn of events, the world collectively unites and says hello back"
|
|
);
|
|
|
|
const nestedMessageDiv2 = page.locator("#children-2");
|
|
await expect(nestedMessageDiv2).toBeEmpty();
|
|
const nestedMessageTitle2 = page.locator("#title-2");
|
|
await expect(nestedMessageTitle2).toContainText("Goodbye Robot");
|
|
const nestedMessageBody2 = page.locator("#body-2");
|
|
await expect(nestedMessageBody2).toContainText("The robot says goodbye");
|
|
|
|
const nestedMessageDiv3 = page.locator("#children-3");
|
|
await expect(nestedMessageDiv3).toBeEmpty();
|
|
const nestedMessageTitle3 = page.locator("#title-3");
|
|
await expect(nestedMessageTitle3).toContainText("Goodbye World");
|
|
const nestedMessageBody3 = page.locator("#body-3");
|
|
await expect(nestedMessageBody3).toContainText("The world says goodbye");
|
|
|
|
// Even more loading text for the deeply nested suspense
|
|
await expect(nestedMessageDiv1).toContainText("Loading 4...");
|
|
|
|
const nestedMessageDiv4 = page.locator("#children-4");
|
|
await expect(nestedMessageDiv4).toBeEmpty();
|
|
const nestedMessageTitle4 = page.locator("#title-4");
|
|
await expect(nestedMessageTitle4).toContainText("Hello World");
|
|
const nestedMessageBody4 = page.locator("#body-4");
|
|
await expect(nestedMessageBody4).toContainText("The world says hello again");
|
|
});
|