Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add playwright tests #939

Merged
merged 3 commits into from
May 8, 2024
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
6A: Add/Refactor tests for mobile accessibility
  • Loading branch information
NabinKawan committed May 8, 2024
commit b2c848d44387eabbdce2f8ebb44585143e221eb0
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
const environments = {
frontendUrl: process.env.HOST_URL || "http://localhost:5173",
apiUrl: `${process.env.HOST_URL}/api` || "http://localhost:9999",
frontendUrl: process.env.HOST_URL || "http://localhost:8080",
apiUrl: `${process.env.HOST_URL}/api` || "http://localhost:8080/api",
docsUrl: process.env.DOCS_URL || "https://docs.sanchogov.tools",
networkId: parseInt(process.env.NETWORK_ID) || 0,
oneTimeWalletSetup: process.env.ONE_TIME_WALLET_SETUP === "true" || false,
Original file line number Diff line number Diff line change
@@ -3,7 +3,7 @@
import { importWallet } from "@fixtures/importWallet";
import { ShelleyWallet } from "@helpers/crypto";
import LoginPage from "@pages/loginPage";
import { Page, expect } from "@playwright/test";
import { Page } from "@playwright/test";

const tempDRepAuth = ".auth/tempDRepAuth.json";
const tempUserAuth = ".auth/tempUserAuth.json";
@@ -14,7 +14,7 @@ export async function createTempDRepAuth(page: Page, wallet: ShelleyWallet) {

const loginPage = new LoginPage(page);
await loginPage.login();
await expect(page.getByTestId("disconnect-button")).toBeVisible();
await loginPage.isLoggedIn();

await page.context().storageState({ path: tempDRepAuth });
return tempDRepAuth;
@@ -28,7 +28,7 @@ export async function createTempAdaHolderAuth(

const loginPage = new LoginPage(page);
await loginPage.login();
await expect(page.getByTestId("disconnect-button")).toBeVisible();
await loginPage.isLoggedIn();

await page.context().storageState({ path: tempAdaHolderAuth });
return tempAdaHolderAuth;
@@ -37,7 +37,7 @@ export async function createTempAdaHolderAuth(
export async function createTempUserAuth(page: Page) {
const loginPage = new LoginPage(page);
await loginPage.login();
await expect(page.getByTestId("disconnect-button")).toBeVisible();
await loginPage.isLoggedIn();

await page.context().storageState({ path: tempUserAuth });
return tempUserAuth;
16 changes: 16 additions & 0 deletions tests/govtool-frontend/playwright/lib/helpers/mobile.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { Page } from "@playwright/test";

export function isMobile(page: Page) {
const { width } = page.viewportSize();
if (width <= 414) return true;

return false;
}

export async function openDrawer(page: Page) {
await page.getByRole("img", { name: "drawer-icon" }).click(); //BUG testId
}

export async function openDrawerLoggedIn(page: Page) {
await page.getByTestId("open-drawer-button").click();
}
16 changes: 15 additions & 1 deletion tests/govtool-frontend/playwright/lib/pages/loginPage.ts
Original file line number Diff line number Diff line change
@@ -2,6 +2,7 @@ import {
CIP30Instance,
Cip95Instance,
} from "@cardanoapi/cardano-test-wallet/types";
import { isMobile, openDrawer, openDrawerLoggedIn } from "@helpers/mobile";
import { Page, expect } from "@playwright/test";

export default class LoginPage {
@@ -22,7 +23,14 @@ export default class LoginPage {
async login() {
await this.goto();

await this.connectWalletBtn.click();
if (isMobile(this.page)) {
await openDrawer(this.page);
await this.page
.getByRole("button", { name: "Connect your wallet" }) // BUG testId should be same as connect-wallet-button
.click();
} else {
await this.connectWalletBtn.click();
}
await this.demosWalletBtn.click({ force: true });
await this.acceptSanchoNetInfoBtn.click({ force: true });

@@ -53,10 +61,16 @@ export default class LoginPage {
}

async logout() {
if (isMobile(this.page)) {
await openDrawerLoggedIn(this.page);
}
await this.disconnectWalletBtn.click();
}

async isLoggedIn() {
if (isMobile(this.page)) {
await openDrawerLoggedIn(this.page);
}
await expect(this.disconnectWalletBtn).toBeVisible();
}
}
52 changes: 18 additions & 34 deletions tests/govtool-frontend/playwright/playwright.config.ts
Original file line number Diff line number Diff line change
@@ -27,7 +27,7 @@ export default defineConfig({
/*use Allure Playwright's testPlanFilter() to determine the grep parameter*/
grep: testPlanFilter(),
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: process.env.CI ? [["line"], ["allure-playwright"]] : [["line"]],
reporter: process.env.CI ? [["dot"], ["allure-playwright"]] : [["dot"]],
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
@@ -63,56 +63,40 @@ export default defineConfig({
dependencies: process.env.CI ? ["auth setup", "wallet bootstrap"] : [],
},
{
name: "logged in",
name: "loggedin (desktop)",
use: { ...devices["Desktop Chrome"] },
testMatch: "**/*.loggedin.spec.ts",
dependencies: process.env.CI ? ["auth setup"] : [],
},
{
name: "loggedin (mobile)",
use: { ...devices["Pixel 5"] },
testMatch: "**/*.loggedin.spec.ts",
dependencies: process.env.CI ? ["auth setup"] : [],
},
{
name: "dRep",
use: { ...devices["Desktop Chrome"] },
testMatch: "**/*.dRep.spec.ts",
dependencies: process.env.CI ? ["auth setup", "dRep setup"] : [],
},
{
name: "independent",
name: "independent (desktop)",
use: { ...devices["Desktop Chrome"] },
testIgnore: [
"**/*.tx.spec.ts",
"**/*.loggedin.spec.ts",
"**/*.dRep.spec.ts",
],
},
// {
// name: "cleanup adaHolder",
// testMatch: "**/*.teardown.ts",
// },

/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },

/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
{
name: "independent (mobile)",
use: { ...devices["Pixel 5"] },
testIgnore: [
"**/*.tx.spec.ts",
"**/*.loggedin.spec.ts",
"**/*.dRep.spec.ts",
],
},
],

/* Run your local dev server before starting the tests */
// webServer: {
// command: "cd govtool/frontend && npm run start",
// // url: "http://127.0.0.1:3000",
// reuseExistingServer: !process.env.CI,
// },
});
Original file line number Diff line number Diff line change
@@ -10,7 +10,7 @@ test("2B. Should access delegation to dRep page @smoke @fast", async ({
}) => {
await page.goto("/");

await page.getByTestId("delegate-button").click(); // BUG: testId -> view-dRep-directory
await page.getByTestId("delegate-button").click(); // BUG incorrect test ID
await expect(
page.getByRole("navigation").getByText("DRep Directory")
).toBeVisible();
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { user01Wallet } from "@constants/staticWallets";
import { test } from "@fixtures/walletExtension";
import { isMobile, openDrawerLoggedIn } from "@helpers/mobile";
import removeAllSpaces from "@helpers/removeAllSpaces";
import GovernanceActionsPage from "@pages/governanceActionsPage";
import { expect } from "@playwright/test";
@@ -26,6 +27,9 @@ test("4A.1: Should access Governance Actions page with connecting wallet @smoke
page,
}) => {
await page.goto("/");
if (isMobile(page)) {
await openDrawerLoggedIn(page);
}

await page.getByTestId("governance-actions-link").click();
await expect(page.getByText(/Governance Actions/i)).toHaveCount(2);
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { isMobile, openDrawer } from "@helpers/mobile";
import { expect, test } from "@playwright/test";
import environments from "lib/constants/environments";

@@ -7,9 +8,15 @@ test("6C. Navigation within the dApp @smoke @fast", async ({
}) => {
await page.goto("/");

if (isMobile(page)) {
await openDrawer(page);
}
await page.getByTestId("governance-actions-link").click();
await expect(page).toHaveURL(/\/governance_actions/);

if (isMobile(page)) {
await openDrawer(page);
}
const [guidesPage] = await Promise.all([
context.waitForEvent("page"),
page.getByTestId("guides-link").click(),
@@ -19,13 +26,19 @@ test("6C. Navigation within the dApp @smoke @fast", async ({
`${environments.docsUrl}/about/what-is-sanchonet-govtool`
);

if (isMobile(page)) {
await openDrawer(page);
}
const [faqsPage] = await Promise.all([
context.waitForEvent("page"),
page.getByTestId("faqs-link").click(),
]);

await expect(faqsPage).toHaveURL(`${environments.docsUrl}/faqs`);

if (isMobile(page)) {
await openDrawer(page);
}
await page.getByTestId("dashboard-link").click();
expect(page.url()).toEqual(`${environments.frontendUrl}/`);
});
22 changes: 0 additions & 22 deletions tests/govtool-frontend/playwright/tests/example.spec.ts

This file was deleted.