Skip to content

Commit

Permalink
e2e-tests: headlamp.spec: Add test for pagination
Browse files Browse the repository at this point in the history 
So we can see it updates which page it is on.

Signed-off-by: René Dudfield <[email protected]>
  • Loading branch information
@illume
illume committed Mar 13, 2024
1 parent f17a2b2 commit 2acb53d
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 31 deletions.
60 changes: 41 additions & 19 deletions e2e-tests/tests/headlamp.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,35 @@
import { test, expect } from '@playwright/test';
import { HeadlampPage } from './headlampPage';
import { ServicesPage } from './servicesPage';
import { SecurityPage } from './securityPage';
import { test, expect } from "@playwright/test";
import { HeadlampPage } from "./headlampPage";
import { ServicesPage } from "./servicesPage";
import { SecurityPage } from "./securityPage";

// --- Plugins tests start --- //
test('GET /plugins/list returns plugins list', async ({ page }) => {
const response: any = await page.goto('/plugins');
test("GET /plugins/list returns plugins list", async ({ page }) => {
const response: any = await page.goto("/plugins");
expect(response).toBeTruthy();

const json = await response.json();
expect(json.length).toBeGreaterThan(0);
expect(json.some(str => str.includes('plugins/'))).toBeTruthy();
expect(json.some((str) => str.includes("plugins/"))).toBeTruthy();
});
// --- Plugin tests end --- //

// --- Headlamp tests start --- //
test('headlamp is there and so is minikube', async ({ page }) => {
test("headlamp is there and so is minikube", async ({ page }) => {
const headlampPage = new HeadlampPage(page);

await headlampPage.authenticate();
await headlampPage.hasURLContaining(/.*main/);
});

test('main page should have Network tab', async ({ page }) => {
test("main page should have Network tab", async ({ page }) => {
const headlampPage = new HeadlampPage(page);

await headlampPage.authenticate();
await headlampPage.hasNetworkTab();
});

test('service page should have headlamp service', async ({ page }) => {
test("service page should have headlamp service", async ({ page }) => {
const headlampPage = new HeadlampPage(page);
const servicesPage = new ServicesPage(page);

Expand All @@ -38,10 +38,10 @@ test('service page should have headlamp service', async ({ page }) => {
await servicesPage.clickOnServicesSection();

// Check if there is text "headlamp" on the page
await headlampPage.checkPageContent('headlamp');
await headlampPage.checkPageContent("headlamp");
});

test('headlamp service page should contain port', async ({ page }) => {
test("headlamp service page should contain port", async ({ page }) => {
const headlampPage = new HeadlampPage(page);
const servicesPage = new ServicesPage(page);

Expand All @@ -51,17 +51,17 @@ test('headlamp service page should contain port', async ({ page }) => {
await servicesPage.goToParticularService("headlamp");

// Check if there is text "TCP" on the page
await headlampPage.checkPageContent('TCP');
await headlampPage.checkPageContent("TCP");
});

test('main page should have Security tab', async ({ page }) => {
test("main page should have Security tab", async ({ page }) => {
const headlampPage = new HeadlampPage(page);

await headlampPage.authenticate();
await headlampPage.hasSecurityTab();
});

test('Service account tab should have headlamp-admin', async ({ page }) => {
test("Service account tab should have headlamp-admin", async ({ page }) => {
const headlampPage = new HeadlampPage(page);
const securityPage = new SecurityPage(page);

Expand All @@ -70,20 +70,42 @@ test('Service account tab should have headlamp-admin', async ({ page }) => {
await securityPage.clickOnServiceAccountsSection();

// Check if there is text "headlamp-admin" on the page
await headlampPage.checkPageContent('headlamp-admin');
await headlampPage.checkPageContent("headlamp-admin");
});

test('Logout the user', async ({ page }) => {
test("Logout the user", async ({ page }) => {
const headlampPage = new HeadlampPage(page);

await headlampPage.authenticate();
await headlampPage.logout();
});

test('404 page is present', async ({ page }) => {
test("404 page is present", async ({ page }) => {
const headlampPage = new HeadlampPage(page);

await headlampPage.authenticate();
await headlampPage.navigateTopage('/404test', /Whoops! This page doesn't exist/);
await headlampPage.navigateTopage(
"/404test",
/Whoops! This page doesn't exist/
);
});

test("pagination goes to next page", async ({ page }) => {
const headlampPage = new HeadlampPage(page);
await headlampPage.authenticate();

const securityPage = new SecurityPage(page);
await securityPage.navigateToSecurity();
await securityPage.clickOnServiceAccountsSection();

headlampPage.clickOnRolesSection();
const rowsDisplayed1 = headlampPage.getRowsDisplayed();

headlampPage.clickNextPageRows();

const rowsDisplayed2 = headlampPage.getRowsDisplayed();

expect(rowsDisplayed1).not.toBe(rowsDisplayed2);
});

// --- Headlamp tests end --- //
41 changes: 29 additions & 12 deletions e2e-tests/tests/headlampPage.ts
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import { Page, expect } from '@playwright/test';
import { Page, expect } from "@playwright/test";

export class HeadlampPage {
constructor(private page: Page) { }
constructor(private page: Page) {}

async authenticate() {
await this.page.goto('/');
await this.page.goto("/");

await this.page.waitForSelector('h1:has-text("Authentication")');

// Expects the URL to contain c/main/token
this.hasURLContaining(/.*token/);

const token = process.env.HEADLAMP_TOKEN || '';
const token = process.env.HEADLAMP_TOKEN || "";
this.hasToken(token);

// Fill in the token
Expand All @@ -33,17 +33,17 @@ export class HeadlampPage {
}

async hasToken(token: string) {
expect(token).not.toBe('');
expect(token).not.toBe("");
}

async hasNetworkTab() {
const networkTab = this.page.locator('span:has-text("Network")').first();
expect(await networkTab.textContent()).toBe('Network');
expect(await networkTab.textContent()).toBe("Network");
}

async hasSecurityTab() {
const networkTab = this.page.locator('span:has-text("Security")').first();
expect(await networkTab.textContent()).toBe('Security');
expect(await networkTab.textContent()).toBe("Security");
}

async checkPageContent(text: string) {
Expand All @@ -58,7 +58,7 @@ export class HeadlampPage {

async navigateTopage(page: string, title: RegExp) {
await this.page.goto(page);
await this.page.waitForLoadState('load');
await this.page.waitForLoadState("load");
await this.hasTitleContaining(title);
}

Expand All @@ -69,16 +69,16 @@ export class HeadlampPage {
// Wait for the logout option to be visible and click on it
await this.page.waitForSelector('a.MuiMenuItem-root:has-text("Log out")');
await this.page.click('a.MuiMenuItem-root:has-text("Log out")');
await this.page.waitForLoadState('load');
await this.page.waitForLoadState("load");

// Expects the URL to contain c/main/token
await this.hasURLContaining(/.*token/);
}

async tableHasHeaders(tableSelector: string, expectedHeaders: string[]) {
// Get all table headers
const headers = await this.page.$$eval(`${tableSelector} th`, ths =>
ths.map(th => {
const headers = await this.page.$$eval(`${tableSelector} th`, (ths) =>
ths.map((th) => {
if (th && th.textContent) {
return th.textContent.trim();
}
Expand All @@ -95,6 +95,23 @@ export class HeadlampPage {

async clickOnPlugin(pluginName: string) {
await this.page.click(`a:has-text("${pluginName}")`);
await this.page.waitForLoadState('load');
await this.page.waitForLoadState("load");
}

async clickOnRolesSection() {
await this.page.click('span:has-text("Roles")');
await this.page.waitForSelector('span:has-text("Roles")');
await this.page.waitForSelector('p:has-text("Rows per page")');
}

async clickNextPageRows() {
const nextPageButton = this.page.getByTitle("Next page");
await nextPageButton.click();
}

async getRowsDisplayed() {
const paginationCaption = this.page.locator("p:has-text(' of ')");
const captionText = await paginationCaption.textContent();
return captionText;
}
}

0 comments on commit 2acb53d

Please sign in to comment.