tests: Add Tests for New Auto-Saving Feature (#3428)

*  (index.tsx): Add data-testid attribute to the save button for testing purposes
 (auto-save-off.spec.ts): Add end-to-end test for manually saving a flow when auto_save is off

* ⬆️ (auto-save-off.spec.ts): decrease wait time from 5000ms to 3000ms for improved test efficiency

* moving auto-save-off test to scheduled folder
This commit is contained in:
Cristhian Zanforlin Lousa 2024-08-19 16:17:03 -03:00 committed by GitHub
commit 66110f24e2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 157 additions and 0 deletions

View file

@ -259,6 +259,7 @@ export const MenuBar = ({}: {}): JSX.Element => {
disabled={autoSaving || !changesNotSaved || isBuilding}
className={cn("mr-1 h-9 px-2")}
onClick={handleSave}
data-testid="save-flow-button"
>
<IconComponent name={"Save"} className={cn("h-5 w-5")} />
</Button>

View file

@ -0,0 +1,156 @@
import { expect, test } from "@playwright/test";
test("user should be able to manually save a flow when the auto_save is off", async ({
page,
}) => {
// Intercept the request to any base URL ending with /api/v1/config
await page.route("**/api/v1/config", async (route) => {
const response = await route.fetch();
const responseBody = await response.json();
responseBody.auto_saving = false;
route.fulfill({
response,
body: JSON.stringify(responseBody),
headers: {
...response.headers(),
"content-type": "application/json",
},
});
});
await page.goto("/");
await page.locator("span").filter({ hasText: "My Collection" }).isVisible();
await page.waitForTimeout(2000);
let modalCount = 0;
try {
const modalTitleElement = await page?.getByTestId("modal-title");
if (modalTitleElement) {
modalCount = await modalTitleElement.count();
}
} catch (error) {
modalCount = 0;
}
while (modalCount === 0) {
await page.getByText("New Project", { exact: true }).click();
await page.waitForTimeout(3000);
modalCount = await page.getByTestId("modal-title")?.count();
}
await page.waitForSelector('[data-testid="blank-flow"]', {
timeout: 30000,
});
await page.getByTestId("blank-flow").click();
await page.waitForSelector('[data-testid="extended-disclosure"]', {
timeout: 30000,
});
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("NVIDIA");
await page.waitForTimeout(1000);
await page
.getByTestId("modelsNVIDIA")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.waitForSelector('[title="fit view"]', {
timeout: 100000,
});
await page.getByTitle("fit view").click();
expect(await page.getByText("Last saved:").isVisible()).toBeTruthy();
expect(await page.getByTestId("save-flow-button").isEnabled()).toBeTruthy();
await page.waitForSelector("text=loading", {
state: "hidden",
timeout: 100000,
});
await page.getByTestId("icon-ChevronLeft").last().click();
expect(
await page
.getByText("Unsaved changes will be permanently lost.")
.isVisible(),
).toBeTruthy();
await page.getByText("Exit Anyway", { exact: true }).click();
await page.getByText("Untitled document").first().click();
await page.waitForSelector('[data-testid="icon-ChevronLeft"]', {
timeout: 100000,
});
expect(await page.getByText("NVIDIA").isVisible()).toBeFalsy();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("NVIDIA");
await page.waitForTimeout(1000);
await page
.getByTestId("modelsNVIDIA")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.waitForSelector('[title="fit view"]', {
timeout: 100000,
});
await page.getByTitle("fit view").click();
await page.getByTestId("icon-ChevronLeft").last().click();
await page.getByText("Save And Exit", { exact: true }).click();
await page.getByText("Untitled document").first().click();
await page.waitForSelector("text=loading", {
state: "hidden",
timeout: 100000,
});
await page.waitForTimeout(5000);
expect(await page.getByTestId("title-NVIDIA").isVisible()).toBeTruthy();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("NVIDIA");
await page.waitForTimeout(1000);
await page
.getByTestId("modelsNVIDIA")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.waitForSelector('[title="fit view"]', {
timeout: 100000,
});
await page.getByTitle("fit view").click();
await page.getByTestId("save-flow-button").click();
await page.getByTestId("icon-ChevronLeft").last().click();
await page.getByText("Untitled document").first().click();
await page.waitForSelector('[data-testid="icon-ChevronLeft"]', {
timeout: 100000,
});
await page.waitForTimeout(5000);
const nvidiaNumber = await page.getByTestId("title-NVIDIA").count();
expect(nvidiaNumber).toBe(2);
});