mirror of
https://github.com/penpot/penpotqa.git
synced 2024-07-06 04:51:46 +00:00
Add tests for dashboard (3rd batch)
This commit is contained in:
parent
c535d3bbc5
commit
21f0fc373f
BIN
fonts/Allura-Regular.otf
Normal file
BIN
fonts/Allura-Regular.otf
Normal file
Binary file not shown.
BIN
fonts/ArialTh.ttf
Normal file
BIN
fonts/ArialTh.ttf
Normal file
Binary file not shown.
BIN
fonts/Pacifico.ttf
Normal file
BIN
fonts/Pacifico.ttf
Normal file
Binary file not shown.
|
@ -72,10 +72,52 @@ exports.DashboardPage = class DashboardPage {
|
||||||
this.projectOptionsMenuButton = page.locator(
|
this.projectOptionsMenuButton = page.locator(
|
||||||
'a[data-test="project-options"] svg[class="icon-actions"]'
|
'a[data-test="project-options"] svg[class="icon-actions"]'
|
||||||
);
|
);
|
||||||
this.projectsSidebarItem = page.locator('li[class="recent-projects "]');
|
this.projectsSidebarItem = page.locator('li:has-text("Projects")');
|
||||||
|
this.draftsSidebarItem = page.locator('li:has-text("Drafts")');
|
||||||
|
this.fontsSidebarItem = page.locator('li:has-text("Fonts")');
|
||||||
this.pinnedProjectsSidebarItem = page.locator(
|
this.pinnedProjectsSidebarItem = page.locator(
|
||||||
'div[data-test="pinned-projects"]'
|
'div[data-test="pinned-projects"]'
|
||||||
);
|
);
|
||||||
|
this.searchInput = page.locator("#search-input");
|
||||||
|
this.uploadFontSelector = page.locator("#font-upload");
|
||||||
|
this.uploadFontButton = page.locator('button:has-text("Upload")');
|
||||||
|
this.fontNameTableCell = page.locator(
|
||||||
|
'div[class="font-item table-row"] div[class="table-field family"]'
|
||||||
|
);
|
||||||
|
this.fontStyleTableCell = page.locator(
|
||||||
|
'div[class="font-item table-row"] div[class="table-field variants"]'
|
||||||
|
);
|
||||||
|
this.fontOptionsMenuButton = page.locator(
|
||||||
|
'div[class="table-field options"] svg[class="icon-actions"]'
|
||||||
|
);
|
||||||
|
this.editFontMenuItem = page.locator('a[data-test="font-edit"]');
|
||||||
|
this.deleteFontMenuItem = page.locator('a[data-test="font-delete"]');
|
||||||
|
this.deleteFontButton = page.locator('input[value="Delete"]');
|
||||||
|
this.fontsTablePlaceholder = page.locator(
|
||||||
|
'div[class="fonts-placeholder"] div[class="label"]'
|
||||||
|
);
|
||||||
|
this.fontNameInput = page.locator(
|
||||||
|
'div[class="font-item table-row"] input[type="text"]'
|
||||||
|
);
|
||||||
|
this.saveFontButton = page.locator('button:has-text("Save")');
|
||||||
|
|
||||||
|
this.searchFontInput = page.locator("input[placeholder='Search font']");
|
||||||
|
|
||||||
|
this.teamSelector = page.locator("div[class='current-team']");
|
||||||
|
|
||||||
|
this.createNewTeamMenuItem = page.locator(
|
||||||
|
"li[data-test='create-new-team']"
|
||||||
|
);
|
||||||
|
|
||||||
|
this.teamNameInput = page.locator("#name");
|
||||||
|
|
||||||
|
this.createNewTeamButton = page.locator("input[value='Create new team']");
|
||||||
|
this.teamMenuItem = page.locator("li[class='team-name']");
|
||||||
|
this.teamOptionsMenuButton = page.locator(
|
||||||
|
'div[class="switch-options"] svg[class="icon-actions"]'
|
||||||
|
);
|
||||||
|
this.deleteTeamMenuItem = page.locator('li[data-test="delete-team"]');
|
||||||
|
this.deleteTeamButton = page.locator('input[value="Delete team"]');
|
||||||
}
|
}
|
||||||
|
|
||||||
async isHeaderDisplayed(title) {
|
async isHeaderDisplayed(title) {
|
||||||
|
@ -165,7 +207,7 @@ exports.DashboardPage = class DashboardPage {
|
||||||
await this.renameFileMenuItem.click();
|
await this.renameFileMenuItem.click();
|
||||||
await this.fileNameInput.type(newFileName);
|
await this.fileNameInput.type(newFileName);
|
||||||
await this.page.keyboard.press("Enter");
|
await this.page.keyboard.press("Enter");
|
||||||
await expect(this.fileNameTitle).toHaveText(newFileName);
|
await this.isFileNameDisplayed(newFileName);
|
||||||
}
|
}
|
||||||
|
|
||||||
async renameFileViaOptionsIcon(newFileName) {
|
async renameFileViaOptionsIcon(newFileName) {
|
||||||
|
@ -175,7 +217,11 @@ exports.DashboardPage = class DashboardPage {
|
||||||
await this.renameFileMenuItem.click();
|
await this.renameFileMenuItem.click();
|
||||||
await this.fileNameInput.type(newFileName);
|
await this.fileNameInput.type(newFileName);
|
||||||
await this.page.keyboard.press("Enter");
|
await this.page.keyboard.press("Enter");
|
||||||
await expect(this.fileNameTitle).toHaveText(newFileName);
|
await this.isFileNameDisplayed(newFileName);
|
||||||
|
}
|
||||||
|
|
||||||
|
async isFileNameDisplayed(fileName) {
|
||||||
|
await expect(this.fileNameTitle).toHaveText(fileName);
|
||||||
}
|
}
|
||||||
|
|
||||||
async duplicateFileViaRightclick() {
|
async duplicateFileViaRightclick() {
|
||||||
|
@ -311,6 +357,12 @@ exports.DashboardPage = class DashboardPage {
|
||||||
case "Projects":
|
case "Projects":
|
||||||
await this.projectsSidebarItem.click();
|
await this.projectsSidebarItem.click();
|
||||||
break;
|
break;
|
||||||
|
case "Drafts":
|
||||||
|
await this.draftsSidebarItem.click();
|
||||||
|
break;
|
||||||
|
case "Fonts":
|
||||||
|
await this.fontsSidebarItem.click();
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
async clickPinUnpinProjectButton() {
|
async clickPinUnpinProjectButton() {
|
||||||
|
@ -323,4 +375,114 @@ exports.DashboardPage = class DashboardPage {
|
||||||
async checkPinnedProjectsSidebarItem(text) {
|
async checkPinnedProjectsSidebarItem(text) {
|
||||||
await expect(this.pinnedProjectsSidebarItem).toHaveText(text);
|
await expect(this.pinnedProjectsSidebarItem).toHaveText(text);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async search(text) {
|
||||||
|
await this.searchInput.type(text);
|
||||||
|
}
|
||||||
|
|
||||||
|
async uploadFont(filePath) {
|
||||||
|
await this.uploadFontSelector.setInputFiles(filePath);
|
||||||
|
await this.uploadFontButton.click();
|
||||||
|
await expect(this.uploadFontButton).not.toBeVisible();
|
||||||
|
}
|
||||||
|
|
||||||
|
async isFontUploaded(fontName, fontStyle) {
|
||||||
|
await expect(this.fontNameTableCell).toHaveText(fontName);
|
||||||
|
await expect(this.fontStyleTableCell).toHaveText(fontStyle);
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteFont() {
|
||||||
|
await this.fontOptionsMenuButton.click();
|
||||||
|
await this.deleteFontMenuItem.click();
|
||||||
|
await this.deleteFontButton.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteFonts() {
|
||||||
|
for (const el of await this.fontOptionsMenuButton.elementHandles()) {
|
||||||
|
await el.click();
|
||||||
|
await this.deleteFontMenuItem.click();
|
||||||
|
await this.deleteFontButton.click();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteFontsIfExist() {
|
||||||
|
const fontRecords = await this.page.$$('div[class="font-item table-row"]');
|
||||||
|
if (fontRecords) await this.deleteFonts();
|
||||||
|
}
|
||||||
|
|
||||||
|
async isFontsTablePlaceholderDisplayed(text) {
|
||||||
|
await expect(this.fontsTablePlaceholder).toHaveText(text);
|
||||||
|
}
|
||||||
|
|
||||||
|
async editFont(newFontName) {
|
||||||
|
await this.fontOptionsMenuButton.click();
|
||||||
|
await this.editFontMenuItem.click();
|
||||||
|
await this.clearInput(this.fontNameInput);
|
||||||
|
await this.fontNameInput.type(newFontName);
|
||||||
|
await this.saveFontButton.click();
|
||||||
|
await expect(this.fontNameTableCell).toHaveText(newFontName);
|
||||||
|
}
|
||||||
|
|
||||||
|
async clearInput(input) {
|
||||||
|
await input.click();
|
||||||
|
let text = await input.inputValue();
|
||||||
|
for (let i = 0; i <= text.length; i++) {
|
||||||
|
await this.page.keyboard.press("Backspace");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async searchFont(fontName) {
|
||||||
|
await this.searchFontInput.type(fontName);
|
||||||
|
await expect(this.fontNameTableCell).toHaveText(fontName);
|
||||||
|
await expect(this.fontNameTableCell).toHaveCount(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
async createTeam(teamName) {
|
||||||
|
await this.teamSelector.click();
|
||||||
|
await this.createNewTeamMenuItem.click();
|
||||||
|
await this.teamNameInput.fill(teamName);
|
||||||
|
await this.createNewTeamButton.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async isTeamSelected(teamName) {
|
||||||
|
await expect(this.teamSelector).toHaveText(teamName);
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteTeam(teamName) {
|
||||||
|
await this.teamSelector.click();
|
||||||
|
for (const el of await this.teamMenuItem.elementHandles()) {
|
||||||
|
const text = (await el.innerText()).valueOf();
|
||||||
|
if (text.includes(teamName)) {
|
||||||
|
await el.click();
|
||||||
|
await this.teamOptionsMenuButton.click();
|
||||||
|
await this.deleteTeamMenuItem.click();
|
||||||
|
await this.deleteTeamButton.click();
|
||||||
|
await expect(this.teamSelector).toHaveText("Your Penpot");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async deleteTeamsIfExist() {
|
||||||
|
await this.teamSelector.click();
|
||||||
|
for (const el of await this.teamMenuItem.elementHandles()) {
|
||||||
|
const text = (await el.innerText()).valueOf();
|
||||||
|
if (!text.includes("Your Penpot")) {
|
||||||
|
await el.click();
|
||||||
|
await this.teamOptionsMenuButton.click();
|
||||||
|
await this.deleteTeamMenuItem.click();
|
||||||
|
await this.deleteTeamButton.click();
|
||||||
|
await expect(this.teamSelector).toHaveText("Your Penpot");
|
||||||
|
await this.teamSelector.click();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
await this.teamSelector.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async isTeamDeleted(teamName) {
|
||||||
|
await this.teamSelector.click();
|
||||||
|
for (const el of await this.teamMenuItem.elementHandles()) {
|
||||||
|
const text = (await el.innerText()).valueOf();
|
||||||
|
expect(text).not.toEqual(teamName);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
const { expect } = require("@playwright/test");
|
const { expect } = require("@playwright/test");
|
||||||
const viewportLocator = 'div[class="viewport"]';
|
|
||||||
exports.MainPage = class MainPage {
|
exports.MainPage = class MainPage {
|
||||||
/**
|
/**
|
||||||
* @param {import('@playwright/test').Page} page
|
* @param {import('@playwright/test').Page} page
|
||||||
|
@ -18,7 +17,7 @@ exports.MainPage = class MainPage {
|
||||||
this.textbox = page.locator(
|
this.textbox = page.locator(
|
||||||
'div[role="textbox"] div[contenteditable="true"]'
|
'div[role="textbox"] div[contenteditable="true"]'
|
||||||
);
|
);
|
||||||
this.viewport = page.locator(viewportLocator);
|
this.viewport = page.locator('div[class="viewport"]');
|
||||||
this.savedChangesIcon = page.locator('div[class="saved"]');
|
this.savedChangesIcon = page.locator('div[class="saved"]');
|
||||||
this.pencilBoxButton = page.locator('div[class="main-icon"]');
|
this.pencilBoxButton = page.locator('div[class="main-icon"]');
|
||||||
}
|
}
|
||||||
|
@ -43,8 +42,8 @@ exports.MainPage = class MainPage {
|
||||||
await this.textbox.fill(text);
|
await this.textbox.fill(text);
|
||||||
}
|
}
|
||||||
|
|
||||||
async uploadImage(imageUrl) {
|
async uploadImage(filePath) {
|
||||||
await this.uploadImageSelector.setInputFiles(imageUrl);
|
await this.uploadImageSelector.setInputFiles(filePath);
|
||||||
}
|
}
|
||||||
|
|
||||||
async clickCreateCurveButton() {
|
async clickCreateCurveButton() {
|
||||||
|
|
|
@ -389,3 +389,30 @@ dashboardTest("Delete project via Options icon", async ({ page }) => {
|
||||||
await dashboardPage.deleteProjectViaOptionsIcon();
|
await dashboardPage.deleteProjectViaOptionsIcon();
|
||||||
await dashboardPage.isProjectTitleDisplayed("Drafts");
|
await dashboardPage.isProjectTitleDisplayed("Drafts");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
dashboardTest("Search file (from Drafts)", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.createFileViaPlaceholder();
|
||||||
|
const mainPage = new MainPage(page);
|
||||||
|
await mainPage.clickPencilBoxButton();
|
||||||
|
await dashboardPage.renameFileViaRightclick("qwe");
|
||||||
|
await dashboardPage.clickSidebarItem("Drafts");
|
||||||
|
await dashboardPage.search("qwe");
|
||||||
|
await dashboardPage.isHeaderDisplayed("Search results");
|
||||||
|
await dashboardPage.isFileNameDisplayed("qwe");
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Search file (from Projects)", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickAddProjectButton();
|
||||||
|
await dashboardPage.setProjectName("TestProject");
|
||||||
|
await dashboardPage.isProjectTitleDisplayed("TestProject");
|
||||||
|
await dashboardPage.createFileViaPlaceholder();
|
||||||
|
const mainPage = new MainPage(page);
|
||||||
|
await mainPage.clickPencilBoxButton();
|
||||||
|
await dashboardPage.renameFileViaRightclick("qaz");
|
||||||
|
await dashboardPage.clickSidebarItem("Projects");
|
||||||
|
await dashboardPage.search("qaz");
|
||||||
|
await dashboardPage.isHeaderDisplayed("Search results");
|
||||||
|
await dashboardPage.isFileNameDisplayed("qaz");
|
||||||
|
});
|
43
tests/dashboard-fonts.spec.js
Normal file
43
tests/dashboard-fonts.spec.js
Normal file
|
@ -0,0 +1,43 @@
|
||||||
|
const { dashboardTest } = require("../fixtures");
|
||||||
|
const { DashboardPage } = require("../pages/dashboard-page");
|
||||||
|
const { test } = require("@playwright/test");
|
||||||
|
|
||||||
|
test.beforeEach(async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickSidebarItem("Fonts");
|
||||||
|
await dashboardPage.deleteFontsIfExist();
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Upload single font", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickSidebarItem("Fonts");
|
||||||
|
await dashboardPage.uploadFont("fonts/Pacifico.ttf");
|
||||||
|
await dashboardPage.isFontUploaded("Pacifico", "Regular");
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Search font", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickSidebarItem("Fonts");
|
||||||
|
await dashboardPage.uploadFont("fonts/ArialTh.ttf");
|
||||||
|
await dashboardPage.uploadFont("fonts/Allura-Regular.otf");
|
||||||
|
await dashboardPage.searchFont("Arial Th");
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Edit font", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickSidebarItem("Fonts");
|
||||||
|
await dashboardPage.uploadFont("fonts/Allura-Regular.otf");
|
||||||
|
await dashboardPage.isFontUploaded("Allura", "Regular");
|
||||||
|
await dashboardPage.editFont("New Test Font");
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Delete font", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.clickSidebarItem("Fonts");
|
||||||
|
await dashboardPage.uploadFont("fonts/Pacifico.ttf");
|
||||||
|
await dashboardPage.isFontUploaded("Pacifico", "Regular");
|
||||||
|
await dashboardPage.deleteFont();
|
||||||
|
await dashboardPage.isFontsTablePlaceholderDisplayed(
|
||||||
|
"You still have no custom fonts installed."
|
||||||
|
);
|
||||||
|
});
|
22
tests/dashboard-teams.spec.js
Normal file
22
tests/dashboard-teams.spec.js
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
const { dashboardTest } = require("../fixtures");
|
||||||
|
const { DashboardPage } = require("../pages/dashboard-page");
|
||||||
|
const { test } = require("@playwright/test");
|
||||||
|
|
||||||
|
test.beforeEach(async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.deleteTeamsIfExist();
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Create a team", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.createTeam("New Test Team");
|
||||||
|
await dashboardPage.isTeamSelected("New Test Team");
|
||||||
|
});
|
||||||
|
|
||||||
|
dashboardTest("Delete a team", async ({ page }) => {
|
||||||
|
const dashboardPage = new DashboardPage(page);
|
||||||
|
await dashboardPage.createTeam("QA Team");
|
||||||
|
await dashboardPage.isTeamSelected("QA Team");
|
||||||
|
await dashboardPage.deleteTeam("QA Team");
|
||||||
|
await dashboardPage.isTeamDeleted("QA Team");
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user