mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2024-11-25 06:56:38 +00:00
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
This commit is contained in:
parent
5741802c25
commit
473f722dcc
5
.github/workflows/ci.yml
vendored
5
.github/workflows/ci.yml
vendored
@ -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/')
|
||||
|
@ -288,7 +288,7 @@
|
||||
range of values and is likely to have evenly distributed access patterns.</span>
|
||||
</span>
|
||||
</p>
|
||||
<input type="text" data-test="addCollection-partitionKeyValue" aria-required="true" size="40"
|
||||
<input type="text" id="partitionKeyValue" data-test="addCollection-partitionKeyValue" aria-required="true" size="40"
|
||||
class="textfontclr collid" data-bind="textInput: partitionKey,
|
||||
attr: {
|
||||
placeholder: partitionKeyPlaceholder,
|
||||
|
@ -1,15 +1,18 @@
|
||||
import "expect-puppeteer";
|
||||
import { Frame } from "puppeteer";
|
||||
import { generateUniqueName, login } from "../utils/shared";
|
||||
|
||||
jest.setTimeout(300000);
|
||||
const RENDER_DELAY = 400;
|
||||
const RENDER_DELAY = 800;
|
||||
const RETRY_DELAY = 5000;
|
||||
const CREATE_DELAY = 10000;
|
||||
const LOADING_STATE_DELAY = 2500;
|
||||
|
||||
describe("Collection Add and Delete Cassandra spec", () => {
|
||||
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 });
|
||||
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 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="${tableId}"] > div > button`, { visible: true });
|
||||
await frame.click(`div[data-test="${tableId}"] > div > button`);
|
||||
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.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();
|
||||
await frame.waitFor('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]');
|
||||
await frame.click('span[class="treeComponentMenuItemLabel deleteCollectionMenuItemLabel"]');
|
||||
|
||||
// confirm delete container
|
||||
await frame.type('input[data-test="confirmCollectionId"]', tableId.trim());
|
||||
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.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}"]`);
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
@ -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,27 +54,56 @@ 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 });
|
||||
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 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="${collectionId}"] > div > button`, { visible: true });
|
||||
await frame.click(`div[data-test="${collectionId}"] > div > button`);
|
||||
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"]', { visible: true });
|
||||
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.trim());
|
||||
await frame.type('input[data-test="confirmCollectionId"]', textId);
|
||||
|
||||
// click delete
|
||||
await frame.waitFor('input[data-test="deleteCollection"]', { visible: true });
|
||||
@ -80,11 +111,13 @@ describe("Collection Add and Delete Mongo spec", () => {
|
||||
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}"]`);
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
@ -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,18 +54,46 @@ 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 });
|
||||
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 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="${collectionId}"] > div > button`, { visible: true });
|
||||
await frame.click(`div[data-test="${collectionId}"] > div > button`);
|
||||
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);
|
||||
@ -71,7 +102,7 @@ describe("Collection Add and Delete SQL spec", () => {
|
||||
|
||||
// confirm delete container
|
||||
await frame.waitFor('input[data-test="confirmCollectionId"]', { visible: true });
|
||||
await frame.type('input[data-test="confirmCollectionId"]', collectionId);
|
||||
await frame.type('input[data-test="confirmCollectionId"]', textId);
|
||||
|
||||
// click delete
|
||||
await frame.waitFor('input[data-test="deleteCollection"]', { visible: true });
|
||||
@ -79,11 +110,13 @@ describe("Collection Add and Delete SQL spec", () => {
|
||||
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}"]`);
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
111
test/tables/container.spec.ts
Normal file
111
test/tables/container.spec.ts
Normal file
@ -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);
|
||||
}
|
||||
}
|
@ -3,7 +3,7 @@ import { Frame } from "puppeteer";
|
||||
|
||||
export async function login(connectionString: string): Promise<Frame> {
|
||||
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<Frame> {
|
||||
return frame;
|
||||
}
|
||||
|
||||
export function generateUniqueName(baseName: string, length = 8): string {
|
||||
export function generateUniqueName(baseName = "", length = 4): string {
|
||||
return `${baseName}${crypto.randomBytes(length).toString("hex")}`;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user