From 473f722dcc163f950b39a00d1215bc703fba5e37 Mon Sep 17 00:00:00 2001 From: Zachary Foster Date: Mon, 2 Nov 2020 14:33:14 -0500 Subject: [PATCH] E2E Test Rewrite (#300) * Adds tables test * Include .env var * Adds asElement on again * Add further loading states * Format * Hope to not lose focus * Adds ID to shared key and modifies value of input directly * Fix tables test * Format * Try uploading screenshots * indent * Fixes connection string * Try wildcard upload path * Rebuilds test structure, assertions, dependencies * Wait longer for container create * format --- .github/workflows/ci.yml | 5 + src/Explorer/Panes/AddCollectionPane.html | 2 +- test/cassandra/container.spec.ts | 117 +++++++++++++++----- test/mongo/container.spec.ts | 128 ++++++++++++++++------ test/sql/container.spec.ts | 124 +++++++++++++++------ test/tables/container.spec.ts | 111 +++++++++++++++++++ test/utils/shared.ts | 4 +- 7 files changed, 388 insertions(+), 103 deletions(-) create mode 100644 test/tables/container.spec.ts diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 78a043e29..53a39150a 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -150,6 +150,11 @@ jobs: PORTAL_RUNNER_CONNECTION_STRING: ${{ secrets.CONNECTION_STRING_SQL }} MONGO_CONNECTION_STRING: ${{ secrets.CONNECTION_STRING_MONGO }} CASSANDRA_CONNECTION_STRING: ${{ secrets.CONNECTION_STRING_CASSANDRA }} + TABLES_CONNECTION_STRING: ${{ secrets.CONNECTION_STRING_TABLE }} + - uses: actions/upload-artifact@v2 + with: + name: screenshots + path: failed-* nuget: name: Publish Nuget if: github.ref == 'refs/heads/master' || contains(github.ref, 'hotfix/') || contains(github.ref, 'release/') diff --git a/src/Explorer/Panes/AddCollectionPane.html b/src/Explorer/Panes/AddCollectionPane.html index 775790fce..9167bcf93 100644 --- a/src/Explorer/Panes/AddCollectionPane.html +++ b/src/Explorer/Panes/AddCollectionPane.html @@ -288,7 +288,7 @@ range of values and is likely to have evenly distributed access patterns.

- { it("creates a collection", async () => { try { - const keyspaceId = generateUniqueName("keyspaceid"); - const tableId = generateUniqueName("tableid"); + const keyspaceId = generateUniqueName("key"); + const tableId = generateUniqueName("tab"); const frame = await login(process.env.CASSANDRA_CONNECTION_STRING); // create new table @@ -31,38 +34,69 @@ describe("Collection Add and Delete Cassandra spec", () => { // open database menu await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - - await frame.waitFor(`div[data-test="${keyspaceId}"]`, { visible: true }); - await frame.waitFor(LOADING_STATE_DELAY); - await frame.waitFor(`div[data-test="${keyspaceId}"]`, { visible: true }); - await frame.click(`div[data-test="${keyspaceId}"]`); - await frame.waitFor(`span[title="${tableId}"]`, { visible: true }); - - // delete container - - // click context menu for container - await frame.waitFor(`div[data-test="${tableId}"] > div > button`, { visible: true }); - await frame.click(`div[data-test="${tableId}"] > div > button`); - - // click delete container - await frame.waitForSelector("body > div.ms-Layer.ms-Layer--fixed"); - await frame.waitFor(RENDER_DELAY); - const elements = await frame.$$('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); - await elements[0].click(); - - // confirm delete container - await frame.type('input[data-test="confirmCollectionId"]', tableId.trim()); - - // click delete - await frame.click('input[data-test="deleteCollection"]'); - await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); await frame.waitFor(LOADING_STATE_DELAY); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - await expect(page).not.toMatchElement(`div[data-test="${tableId}"]`); + const databases = await frame.$$(`div[class="databaseHeader main1 nodeItem "] > div[class="treeNodeHeader "]`); + const selectedDbId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, databases[0]); + + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(CREATE_DELAY); + await frame.waitFor("div[class='rowData'] > span[class='message']"); + + const didCreateContainer = await frame.$$eval("div[class='rowData'] > span[class='message']", elements => { + return elements.some(el => el.textContent.includes("Successfully created")); + }); + + expect(didCreateContainer).toBe(true); + + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(LOADING_STATE_DELAY); + + await clickDBMenu(selectedDbId, frame); + + const collections = await frame.$$( + `div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]` + ); + + if (collections.length) { + await frame.waitFor(`div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]`, { + visible: true + }); + + const textId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, collections[0]); + await frame.waitFor(`div[data-test="${textId}"]`, { visible: true }); + // delete container + + // click context menu for container + await frame.waitFor(`div[data-test="${textId}"] > div > button`, { visible: true }); + await frame.click(`div[data-test="${textId}"] > div > button`); + + // click delete container + await frame.waitFor(RENDER_DELAY); + await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + + // confirm delete container + await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); + await frame.type('input[data-test="confirmCollectionId"]', textId); + + // click delete + await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); + await frame.click('input[data-test="deleteCollection"]'); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + + await expect(page).not.toMatchElement(`div[data-test="${textId}"]`); + } // click context menu for database await frame.waitFor(`div[data-test="${keyspaceId}"] > div > button`); + await frame.waitFor(RENDER_DELAY); const button = await frame.$(`div[data-test="${keyspaceId}"] > div > button`); await button.focus(); await button.asElement().click(); @@ -80,12 +114,35 @@ describe("Collection Add and Delete Cassandra spec", () => { // click delete await frame.click('input[data-test="deleteDatabase"]'); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); await expect(page).not.toMatchElement(`div[data-test="${keyspaceId}"]`); } catch (error) { // eslint-disable-next-line @typescript-eslint/no-explicit-any const testName = (expect as any).getState().currentTestName; - await page.screenshot({ path: `Test Failed ${testName}.png` }); + await page.screenshot({ path: `failed-${testName}.jpg` }); throw error; } }); }); + +async function clickDBMenu(dbId: string, frame: Frame, retries = 0) { + const button = await frame.$(`div[data-test="${dbId}"]`); + await button.focus(); + const handler = await button.asElement(); + await handler.click(); + await ensureMenuIsOpen(dbId, frame, retries); + return button; +} + +async function ensureMenuIsOpen(dbId: string, frame: Frame, retries: number) { + await frame.waitFor(RETRY_DELAY); + const button = await frame.$(`div[data-test="${dbId}"]`); + const classList = await frame.evaluate(button => { + return button.parentElement.classList; + }, button); + if (!Object.values(classList).includes("selected") && retries < 5) { + retries = retries + 1; + await clickDBMenu(dbId, frame, retries); + } +} diff --git a/test/mongo/container.spec.ts b/test/mongo/container.spec.ts index 54febbcf1..b5e0599de 100644 --- a/test/mongo/container.spec.ts +++ b/test/mongo/container.spec.ts @@ -1,17 +1,19 @@ import "expect-puppeteer"; +import { Frame } from "puppeteer"; import { generateUniqueName, login } from "../utils/shared"; jest.setTimeout(300000); - const LOADING_STATE_DELAY = 2500; +const RETRY_DELAY = 5000; +const CREATE_DELAY = 10000; const RENDER_DELAY = 1000; describe("Collection Add and Delete Mongo spec", () => { - it("creates and deletes a collection", async () => { + it("creates a collection", async () => { try { - const dbId = generateUniqueName("TestDatabase"); - const collectionId = generateUniqueName("TestCollection"); - const sharedKey = generateUniqueName("SharedKey"); + const dbId = generateUniqueName("db"); + const collectionId = generateUniqueName("col"); + const sharedKey = `${generateUniqueName()}`; const frame = await login(process.env.MONGO_CONNECTION_STRING); // create new collection @@ -52,39 +54,70 @@ describe("Collection Add and Delete Mongo spec", () => { // validate created // open database menu await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - - await frame.waitFor(`div[data-test="${dbId}"]`), { visible: true }; - await frame.waitFor(LOADING_STATE_DELAY); - await frame.waitFor(`div[data-test="${dbId}"]`), { visible: true }; - await frame.click(`div[data-test="${dbId}"]`); - await frame.waitFor(`div[data-test="${collectionId}"]`, { visible: true }); - - // delete container - - // click context menu for container - await frame.waitFor(`div[data-test="${collectionId}"] > div > button`, { visible: true }); - await frame.click(`div[data-test="${collectionId}"] > div > button`); - - // click delete container - await frame.waitFor(RENDER_DELAY); - await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]', { visible: true }); - await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); - - // confirm delete container - await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); - await frame.type('input[data-test="confirmCollectionId"]', collectionId.trim()); - - // click delete - await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); - await frame.click('input[data-test="deleteCollection"]'); await frame.waitFor(LOADING_STATE_DELAY); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - await expect(page).not.toMatchElement(`div[data-test="${collectionId}"]`); + const databases = await frame.$$(`div[class="databaseHeader main1 nodeItem "] > div[class="treeNodeHeader "]`); + const selectedDbId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, databases[0]); + + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(CREATE_DELAY); + await frame.waitFor("div[class='rowData'] > span[class='message']"); + + const didCreateContainer = await frame.$$eval("div[class='rowData'] > span[class='message']", elements => { + return elements.some(el => el.textContent.includes("Successfully created")); + }); + + expect(didCreateContainer).toBe(true); + + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(LOADING_STATE_DELAY); + + await clickDBMenu(selectedDbId, frame); + + const collections = await frame.$$( + `div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]` + ); + + if (collections.length) { + await frame.waitFor(`div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]`, { + visible: true + }); + + const textId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, collections[0]); + await frame.waitFor(`div[data-test="${textId}"]`, { visible: true }); + // delete container + + // click context menu for container + await frame.waitFor(`div[data-test="${textId}"] > div > button`, { visible: true }); + await frame.click(`div[data-test="${textId}"] > div > button`); + + // click delete container + await frame.waitFor(RENDER_DELAY); + await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + + // confirm delete container + await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); + await frame.type('input[data-test="confirmCollectionId"]', textId); + + // click delete + await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); + await frame.click('input[data-test="deleteCollection"]'); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + + await expect(page).not.toMatchElement(`div[data-test="${textId}"]`); + } // click context menu for database - await frame.waitFor(`div[data-test="${dbId}"] > div > button`); - const button = await frame.$(`div[data-test="${dbId}"] > div > button`); + await frame.waitFor(`div[data-test="${selectedDbId}"] > div > button`); + await frame.waitFor(RENDER_DELAY); + const button = await frame.$(`div[data-test="${selectedDbId}"] > div > button`); await button.focus(); await button.asElement().click(); @@ -96,17 +129,40 @@ describe("Collection Add and Delete Mongo spec", () => { // confirm delete database await frame.waitForSelector('input[data-test="confirmDatabaseId"]', { visible: true }); await frame.waitFor(RENDER_DELAY); - await frame.type('input[data-test="confirmDatabaseId"]', dbId.trim()); + await frame.type('input[data-test="confirmDatabaseId"]', selectedDbId); // click delete await frame.click('input[data-test="deleteDatabase"]'); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - await expect(page).not.toMatchElement(`div[data-test="${dbId}"]`); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await expect(page).not.toMatchElement(`div[data-test="${selectedDbId}"]`); } catch (error) { // eslint-disable-next-line @typescript-eslint/no-explicit-any const testName = (expect as any).getState().currentTestName; - await page.screenshot({ path: `Test Failed ${testName}.png` }); + await page.screenshot({ path: `failed-${testName}.jpg` }); throw error; } }); }); + +async function clickDBMenu(dbId: string, frame: Frame, retries = 0) { + const button = await frame.$(`div[data-test="${dbId}"]`); + await button.focus(); + const handler = await button.asElement(); + await handler.click(); + await ensureMenuIsOpen(dbId, frame, retries); + return button; +} + +async function ensureMenuIsOpen(dbId: string, frame: Frame, retries: number) { + await frame.waitFor(RETRY_DELAY); + const button = await frame.$(`div[data-test="${dbId}"]`); + const classList = await frame.evaluate(button => { + return button.parentElement.classList; + }, button); + if (!Object.values(classList).includes("selected") && retries < 5) { + retries = retries + 1; + await clickDBMenu(dbId, frame, retries); + } +} diff --git a/test/sql/container.spec.ts b/test/sql/container.spec.ts index 6b801c817..ad5d7f251 100644 --- a/test/sql/container.spec.ts +++ b/test/sql/container.spec.ts @@ -1,16 +1,19 @@ import "expect-puppeteer"; +import { Frame } from "puppeteer"; import { generateUniqueName, login } from "../utils/shared"; jest.setTimeout(300000); const LOADING_STATE_DELAY = 2500; +const RETRY_DELAY = 5000; +const CREATE_DELAY = 10000; const RENDER_DELAY = 1000; describe("Collection Add and Delete SQL spec", () => { it("creates a collection", async () => { try { - const dbId = generateUniqueName("TestDatabase"); - const collectionId = generateUniqueName("TestCollection"); - const sharedKey = generateUniqueName("SharedKey"); + const dbId = generateUniqueName("db"); + const collectionId = generateUniqueName("col"); + const sharedKey = `/skey${generateUniqueName()}`; const frame = await login(process.env.PORTAL_RUNNER_CONNECTION_STRING); // create new collection @@ -51,39 +54,69 @@ describe("Collection Add and Delete SQL spec", () => { // validate created // open database menu await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - - await frame.waitFor(`div[data-test="${dbId}"]`), { visible: true }; - await frame.waitFor(LOADING_STATE_DELAY); - await frame.waitFor(`div[data-test="${dbId}"]`), { visible: true }; - await frame.click(`div[data-test="${dbId}"]`); - await frame.waitFor(`div[data-test="${collectionId}"]`, { visible: true }); - - // delete container - - // click context menu for container - await frame.waitFor(`div[data-test="${collectionId}"] > div > button`, { visible: true }); - await frame.click(`div[data-test="${collectionId}"] > div > button`); - - // click delete container - await frame.waitFor(RENDER_DELAY); - await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); - await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); - - // confirm delete container - await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); - await frame.type('input[data-test="confirmCollectionId"]', collectionId); - - // click delete - await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); - await frame.click('input[data-test="deleteCollection"]'); await frame.waitFor(LOADING_STATE_DELAY); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + const databases = await frame.$$(`div[class="databaseHeader main1 nodeItem "] > div[class="treeNodeHeader "]`); + const selectedDbId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, databases[0]); - await expect(page).not.toMatchElement(`div[data-test="${collectionId}"]`); + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(CREATE_DELAY); + await frame.waitFor("div[class='rowData'] > span[class='message']"); + + const didCreateContainer = await frame.$$eval("div[class='rowData'] > span[class='message']", elements => { + return elements.some(el => el.textContent.includes("Successfully created")); + }); + + expect(didCreateContainer).toBe(true); + + await frame.waitFor(`div[data-test="${selectedDbId}"]`), { visible: true }; + await frame.waitFor(LOADING_STATE_DELAY); + + await clickDBMenu(selectedDbId, frame); + + const collections = await frame.$$( + `div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]` + ); + + if (collections.length) { + await frame.waitFor(`div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]`, { + visible: true + }); + + const textId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, collections[0]); + await frame.waitFor(`div[data-test="${textId}"]`, { visible: true }); + // delete container + + // click context menu for container + await frame.waitFor(`div[data-test="${textId}"] > div > button`, { visible: true }); + await frame.click(`div[data-test="${textId}"] > div > button`); + + // click delete container + await frame.waitFor(RENDER_DELAY); + await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + + // confirm delete container + await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); + await frame.type('input[data-test="confirmCollectionId"]', textId); + + // click delete + await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); + await frame.click('input[data-test="deleteCollection"]'); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + + await expect(page).not.toMatchElement(`div[data-test="${textId}"]`); + } // click context menu for database - await frame.waitFor(`div[data-test="${dbId}"] > div > button`); - const button = await frame.$(`div[data-test="${dbId}"] > div > button`); + await frame.waitFor(`div[data-test="${selectedDbId}"] > div > button`); + await frame.waitFor(RENDER_DELAY); + const button = await frame.$(`div[data-test="${selectedDbId}"] > div > button`); await button.focus(); await button.asElement().click(); @@ -95,17 +128,40 @@ describe("Collection Add and Delete SQL spec", () => { // confirm delete database await frame.waitForSelector('input[data-test="confirmDatabaseId"]', { visible: true }); await frame.waitFor(RENDER_DELAY); - await frame.type('input[data-test="confirmDatabaseId"]', dbId.trim()); + await frame.type('input[data-test="confirmDatabaseId"]', selectedDbId); // click delete await frame.click('input[data-test="deleteDatabase"]'); await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); - await expect(page).not.toMatchElement(`div[data-test="${dbId}"]`); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await expect(page).not.toMatchElement(`div[data-test="${selectedDbId}"]`); } catch (error) { // eslint-disable-next-line @typescript-eslint/no-explicit-any const testName = (expect as any).getState().currentTestName; - await page.screenshot({ path: `Test Failed ${testName}.jpg` }); + await page.screenshot({ path: `failed-${testName}.jpg` }); throw error; } }); }); + +async function clickDBMenu(dbId: string, frame: Frame, retries = 0) { + const button = await frame.$(`div[data-test="${dbId}"]`); + await button.focus(); + const handler = await button.asElement(); + await handler.click(); + await ensureMenuIsOpen(dbId, frame, retries); + return button; +} + +async function ensureMenuIsOpen(dbId: string, frame: Frame, retries: number) { + await frame.waitFor(RETRY_DELAY); + const button = await frame.$(`div[data-test="${dbId}"]`); + const classList = await frame.evaluate(button => { + return button.parentElement.classList; + }, button); + if (!Object.values(classList).includes("selected") && retries < 5) { + retries = retries + 1; + await clickDBMenu(dbId, frame, retries); + } +} diff --git a/test/tables/container.spec.ts b/test/tables/container.spec.ts new file mode 100644 index 000000000..0f1c07eef --- /dev/null +++ b/test/tables/container.spec.ts @@ -0,0 +1,111 @@ +import "expect-puppeteer"; +import { Frame } from "puppeteer"; +import { generateUniqueName, login } from "../utils/shared"; + +jest.setTimeout(300000); +const RETRY_DELAY = 5000; +const LOADING_STATE_DELAY = 2500; +const RENDER_DELAY = 1000; + +describe("Collection Add and Delete Tables spec", () => { + it("creates a collection", async () => { + try { + const tableId = generateUniqueName("tab"); + const frame = await login(process.env.TABLES_CONNECTION_STRING); + + // create new collection + await frame.waitFor('button[data-test="New Table"]', { visible: true }); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await frame.click('button[data-test="New Table"]'); + + // type database id + await frame.waitFor('input[data-test="addCollection-newDatabaseId"]'); + const dbInput = await frame.$('input[data-test="addCollection-newDatabaseId"]'); + await dbInput.press("Backspace"); + await dbInput.type(tableId); + + // click submit + await frame.waitFor("#submitBtnAddCollection"); + await frame.click("#submitBtnAddCollection"); + + // validate created + // open database menu + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + + await frame.waitFor(`div[data-test="TablesDB"]`), { visible: true }; + await frame.waitFor(LOADING_STATE_DELAY); + + const didCreateContainer = await frame.$$eval("div[class='rowData'] > span[class='message']", elements => { + return elements.some(el => el.textContent.includes("Successfully created")); + }); + + expect(didCreateContainer).toBe(true); + + await frame.waitFor(`div[data-test="TablesDB"]`), { visible: true }; + await frame.waitFor(LOADING_STATE_DELAY); + + await clickTablesMenu(frame); + + const collections = await frame.$$( + `div[class="collectionHeader main2 nodeItem "] > div[class="treeNodeHeader "]` + ); + const textId = await frame.evaluate(element => { + return element.attributes["data-test"].textContent; + }, collections[0]); + await frame.waitFor(`div[data-test="${textId}"]`, { visible: true }); + + // delete container + + // click context menu for container + await frame.waitFor(`div[data-test="${textId}"] > div > button`, { visible: true }); + await frame.click(`div[data-test="${textId}"] > div > button`); + + // click delete container + await frame.waitFor(RENDER_DELAY); + await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]'); + + // confirm delete container + await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true }); + await frame.type('input[data-test="confirmCollectionId"]', textId); + + // click delete + await frame.waitFor('input[data-test="deleteCollection"]', { visible: true }); + await frame.click('input[data-test="deleteCollection"]'); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + await frame.waitFor(LOADING_STATE_DELAY); + await frame.waitForSelector('div[class="splashScreen"] > div[class="title"]', { visible: true }); + + await expect(page).not.toMatchElement(`div[data-test="${textId}"]`); + } catch (error) { + // eslint-disable-next-line @typescript-eslint/no-explicit-any + const testName = (expect as any).getState().currentTestName; + await page.screenshot({ path: `failed-${testName}.jpg` }); + throw error; + } + }); +}); + +async function clickTablesMenu(frame: Frame, retries = 0) { + const button = await frame.$(`div[data-test="TablesDB"]`); + await button.focus(); + const handler = await button.asElement(); + await handler.click(); + await ensureMenuIsOpen(frame, retries); + return button; +} + +async function ensureMenuIsOpen(frame: Frame, retries: number) { + await frame.waitFor(RETRY_DELAY); + const button = await frame.$(`div[data-test="TablesDB"]`); + const classList = await frame.evaluate(button => { + return button.parentElement.classList; + }, button); + if (!Object.values(classList).includes("selected") && retries < 5) { + retries = retries + 1; + await clickTablesMenu(frame, retries); + } +} diff --git a/test/utils/shared.ts b/test/utils/shared.ts index 458899700..f7c1f3faf 100644 --- a/test/utils/shared.ts +++ b/test/utils/shared.ts @@ -3,7 +3,7 @@ import { Frame } from "puppeteer"; export async function login(connectionString: string): Promise { const prodUrl = "https://localhost:1234/hostedExplorer.html"; - page.goto(prodUrl); + page.goto(prodUrl, { waitUntil: "networkidle2" }); // log in with connection string const handle = await page.waitForSelector("iframe"); @@ -16,6 +16,6 @@ export async function login(connectionString: string): Promise { return frame; } -export function generateUniqueName(baseName: string, length = 8): string { +export function generateUniqueName(baseName = "", length = 4): string { return `${baseName}${crypto.randomBytes(length).toString("hex")}`; }