Skip to content

Commit 69d2a13

Browse files
committed
refactor(dotcms-ui-e2e): standardize import styles and improve code readability
1 parent 7afc3ed commit 69d2a13

File tree

15 files changed

+201
-256
lines changed

15 files changed

+201
-256
lines changed
Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
11
import { Locator, Page } from '@playwright/test';
22

33
export class BreadcrumbComponent {
4-
constructor(private page: Page) { }
4+
constructor(private page: Page) {}
55

66
getBreadcrumb(): Locator {
77
// TODO: Replace with real data-testid from codegen
88
// Temporary fallback using more generic selectors
9-
return this.page.locator('[data-testid="breadcrumb-crumbs"], .breadcrumb-crumbs, .breadcrumb').first();
9+
return this.page
10+
.locator('[data-testid="breadcrumb-crumbs"], .breadcrumb-crumbs, .breadcrumb')
11+
.first();
1012
}
1113

1214
getTitle(): Locator {
1315
// TODO: Replace with real data-testid from codegen
1416
// Temporary fallback using more generic selectors
15-
return this.page.locator('[data-testid="breadcrumb-title"], .breadcrumb-title, .page-title, h1').first();
17+
return this.page
18+
.locator('[data-testid="breadcrumb-title"], .breadcrumb-title, .page-title, h1')
19+
.first();
1620
}
1721
}

core-web/apps/dotcms-ui-e2e/src/components/sideMenu.component.ts

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { Page, expect } from "@playwright/test";
1+
import { Page, expect } from '@playwright/test';
22

33
export class SideMenuComponent {
4-
constructor(private page: Page) { }
4+
constructor(private page: Page) {}
55

66
async openMenu() {
77
// Based on codegen - click on the right content pane area to activate navigation
@@ -22,10 +22,12 @@ export class SideMenuComponent {
2222
// Check if we need to expand the menu by looking for collapsed state
2323
const menu = this.page.locator("nav[role='navigation']");
2424
if (await menu.isVisible()) {
25-
const classes = await menu.getAttribute("class");
26-
if (classes && classes.includes("collapsed")) {
25+
const classes = await menu.getAttribute('class');
26+
if (classes && classes.includes('collapsed')) {
2727
// Try to find and click expand button or hover over menu area
28-
const expandArea = this.page.locator('.nav-toggle, .menu-toggle, [aria-label*="menu"]').first();
28+
const expandArea = this.page
29+
.locator('.nav-toggle, .menu-toggle, [aria-label*="menu"]')
30+
.first();
2931
if (await expandArea.isVisible()) {
3032
await expandArea.click();
3133
}
@@ -54,7 +56,7 @@ export class SideMenuComponent {
5456
}
5557

5658
// Then click on the tool/link
57-
const toolLink = this.page.getByRole("link", { name: tool });
59+
const toolLink = this.page.getByRole('link', { name: tool });
5860
await expect(toolLink).toBeVisible();
5961
await toolLink.click();
6062
}

core-web/apps/dotcms-ui-e2e/src/models/newContentType.model.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@
33
* @enum {string}
44
*/
55
export enum TYPES {
6-
Text = "text",
7-
SiteOrFolder = "siteOrFolder",
8-
Relationship = "relationship",
6+
Text = 'text',
7+
SiteOrFolder = 'siteOrFolder',
8+
Relationship = 'relationship'
99
}
1010

1111
/**
@@ -44,7 +44,7 @@ export interface SiteorHostField extends GenericField {
4444
export interface RelationshipField extends GenericField {
4545
fieldType: `${TYPES.Relationship}`;
4646
entityToRelate: string;
47-
cardinality: "1-1" | "1-many" | "many-1" | "many-many";
47+
cardinality: '1-1' | '1-many' | 'many-1' | 'many-many';
4848
}
4949

5050
/**
Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
export { BreadcrumbComponent } from "../components/breadcrumb.component";
2-
export { SideMenuComponent } from "../components/sideMenu.component";
3-
export { ContentTypeFormPage } from "./contentTypeForm.page";
4-
export { ListingContentPage } from "./listingContent.page";
5-
export { ListingContentTypesPage } from "./listingContentTypes.page";
6-
export { LoginPage } from "./login.page";
7-
export { NavigationPage } from "./navigation.page";
8-
export { NewEditContentFormPage } from "./newEditContentForm.page";
9-
export { PagesListPage } from "./pagesList.page";
10-
1+
export { BreadcrumbComponent } from '../components/breadcrumb.component';
2+
export { SideMenuComponent } from '../components/sideMenu.component';
3+
export { ContentTypeFormPage } from './contentTypeForm.page';
4+
export { ListingContentPage } from './listingContent.page';
5+
export { ListingContentTypesPage } from './listingContentTypes.page';
6+
export { LoginPage } from './login.page';
7+
export { NavigationPage } from './navigation.page';
8+
export { NewEditContentFormPage } from './newEditContentForm.page';
9+
export { PagesListPage } from './pagesList.page';
Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
1-
import { expect, Page } from "@playwright/test";
1+
import { expect, Page } from '@playwright/test';
22

33
export class ListingContentPage {
4-
private addBtn = this.page.getByTestId("add-content-button");
5-
private addNewContent = this.page.getByTestId("add-new-content-option");
6-
private resultsTable = this.page.getByTestId("content-results-table");
4+
private addBtn = this.page.getByTestId('add-content-button');
5+
private addNewContent = this.page.getByTestId('add-new-content-option');
6+
private resultsTable = this.page.getByTestId('content-results-table');
77

8-
constructor(private page: Page) { }
8+
constructor(private page: Page) {}
99

1010
async goTo(filter?: string) {
11-
const urlPath = "/dotAdmin/#c/content";
11+
const urlPath = '/dotAdmin/#c/content';
1212
const urlParams = new URLSearchParams();
1313

1414
if (filter) {
1515
const filterCapitalize = filter.charAt(0).toUpperCase() + filter.slice(1);
16-
urlParams.set("filter", filterCapitalize);
16+
urlParams.set('filter', filterCapitalize);
1717
}
1818

1919
await this.page.goto(`${urlPath}?${urlParams.toString()}`);
@@ -27,6 +27,6 @@ export class ListingContentPage {
2727
async clickFirstContentRow() {
2828
await expect(this.resultsTable).toBeVisible();
2929

30-
await this.resultsTable.getByTestId("content-row").first().getByRole("link").click();
30+
await this.resultsTable.getByTestId('content-row').first().getByRole('link').click();
3131
}
3232
}
Lines changed: 26 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,96 +1,80 @@
1-
import { APIRequestContext, Page } from "@playwright/test";
2-
import { updateFeatureFlag } from "@requests/updateFeatureFlag";
1+
import { APIRequestContext, Page } from '@playwright/test';
2+
import { updateFeatureFlag } from '@requests/updateFeatureFlag';
33

44
export class ListingContentTypesPage {
55
constructor(
66
private page: Page,
7-
private request: APIRequestContext,
8-
) { }
7+
private request: APIRequestContext
8+
) {}
99

1010
async goToUrl() {
1111
const responsePromise = this.page.waitForResponse((response) => {
1212
return (
1313
response.status() === 200 &&
14-
response.url().includes("/api/v1/contenttype") &&
15-
response.request().method() === "GET"
14+
response.url().includes('/api/v1/contenttype') &&
15+
response.request().method() === 'GET'
1616
);
1717
});
18-
await this.page.goto("/dotAdmin/#/content-types-angular");
18+
await this.page.goto('/dotAdmin/#/content-types-angular');
1919
await responsePromise;
2020
}
2121

2222
async toggleNewContentEditor(boolean: boolean) {
2323
await updateFeatureFlag(this.request, {
24-
key: "DOT_FEATURE_FLAG_NEW_EDIT_PAGE",
25-
value: boolean,
24+
key: 'DOT_FEATURE_FLAG_NEW_EDIT_PAGE',
25+
value: boolean
2626
});
2727
await updateFeatureFlag(this.request, {
28-
key: "DOT_CONTENT_EDITOR2_ENABLED",
29-
value: boolean,
28+
key: 'DOT_CONTENT_EDITOR2_ENABLED',
29+
value: boolean
3030
});
3131
await updateFeatureFlag(this.request, {
32-
key: "DOT_CONTENT_EDITOR2_CONTENT_TYPE",
33-
value: "*",
32+
key: 'DOT_CONTENT_EDITOR2_CONTENT_TYPE',
33+
value: '*'
3434
});
3535
await this.page.reload();
3636
}
3737

3838
async addNewContentType(name: string) {
39-
await this.page.getByTestId("dot-action-button").click();
40-
await this.page
41-
.locator(".p-menu-overlay")
42-
.getByLabel("Content")
43-
.locator("a")
44-
.click();
39+
await this.page.getByTestId('dot-action-button').click();
40+
await this.page.locator('.p-menu-overlay').getByLabel('Content').locator('a').click();
4541
await this.page
4642
.locator('[data-test-id="content-type__new-content-banner"] div')
4743
.nth(2)
4844
.click();
4945

50-
await this.page.getByLabel("Content Name").fill(name);
46+
await this.page.getByLabel('Content Name').fill(name);
5147
const responsePromise = this.page.waitForResponse((response) => {
52-
return (
53-
response.status() === 200 &&
54-
response.url().includes("/api/v1/contenttype")
55-
);
48+
return response.status() === 200 && response.url().includes('/api/v1/contenttype');
5649
});
57-
await this.page.getByTestId("dotDialogAcceptAction").click();
50+
await this.page.getByTestId('dotDialogAcceptAction').click();
5851
await responsePromise;
5952
}
6053

6154
async goToAddNewContentType(contentType: string) {
62-
const capitalized =
63-
contentType.charAt(0).toUpperCase() + contentType.slice(1);
55+
const capitalized = contentType.charAt(0).toUpperCase() + contentType.slice(1);
6456

6557
await this.page
6658
.getByTestId(`row-${capitalized}`)
67-
.getByRole("link", { name: "View (0)" })
59+
.getByRole('link', { name: 'View (0)' })
6860
.click();
6961
await this.page
7062
.locator('iframe[name="detailFrame"]')
7163
.contentFrame()
72-
.locator("#dijit_form_DropDownButton_0")
64+
.locator('#dijit_form_DropDownButton_0')
7365
.click();
7466
await this.page
7567
.locator('iframe[name="detailFrame"]')
7668
.contentFrame()
77-
.getByLabel("▼")
78-
.getByText("Add New Content")
69+
.getByLabel('▼')
70+
.getByText('Add New Content')
7971
.click();
8072
}
8173

8274
async deleteContentType(contentType: string) {
83-
const capitalized =
84-
contentType.charAt(0).toUpperCase() + contentType.slice(1);
75+
const capitalized = contentType.charAt(0).toUpperCase() + contentType.slice(1);
8576

86-
await this.page
87-
.getByTestId(`row-${capitalized}`)
88-
.getByTestId("dot-menu-button")
89-
.click();
90-
await this.page
91-
.locator(".p-menu-overlay")
92-
.getByLabel("Delete")
93-
.locator("a")
94-
.click();
77+
await this.page.getByTestId(`row-${capitalized}`).getByTestId('dot-menu-button').click();
78+
await this.page.locator('.p-menu-overlay').getByLabel('Delete').locator('a').click();
9579
}
9680
}

core-web/apps/dotcms-ui-e2e/src/pages/navigation.page.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,37 @@
1-
import { Page } from "@playwright/test";
1+
import { Page } from '@playwright/test';
22

33
export class NavigationPage {
4-
constructor(private page: Page) { }
4+
constructor(private page: Page) {}
55

66
/**
77
* Navigate to Site Browser page
88
*/
99
async navigateToSiteBrowser() {
10-
await this.page.goto("/dotAdmin/#/c/site-browser");
10+
await this.page.goto('/dotAdmin/#/c/site-browser');
1111
await this.page.waitForLoadState();
1212
}
1313

1414
/**
1515
* Navigate to Pages page
1616
*/
1717
async navigateToPages() {
18-
await this.page.goto("/dotAdmin/#/pages");
18+
await this.page.goto('/dotAdmin/#/pages');
1919
await this.page.waitForLoadState();
2020
}
2121

2222
/**
2323
* Navigate to Containers page
2424
*/
2525
async navigateToContainers() {
26-
await this.page.goto("/dotAdmin/#/containers");
26+
await this.page.goto('/dotAdmin/#/containers');
2727
await this.page.waitForLoadState();
2828
}
2929

3030
/**
3131
* Navigate to Content Types page
3232
*/
3333
async navigateToContentTypes() {
34-
await this.page.goto("/dotAdmin/#/content-types-angular");
34+
await this.page.goto('/dotAdmin/#/content-types-angular');
3535
await this.page.waitForLoadState();
3636
}
3737

core-web/apps/dotcms-ui-e2e/src/pages/newEditContentForm.page.ts

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,35 @@
1-
import { expect, Page } from "@playwright/test";
1+
import { expect, Page } from '@playwright/test';
22

33
export class NewEditContentFormPage {
4-
constructor(private page: Page) { }
4+
constructor(private page: Page) {}
55

66
async fillTextField(text: string) {
7-
const textFieldLocator = this.page.getByTestId("textField");
7+
const textFieldLocator = this.page.getByTestId('textField');
88
await textFieldLocator.fill(text);
99
}
1010

1111
async selectSiteOrFolderField() {
12-
const siteOrFolderFieldLocator = this.page.getByTestId(
13-
"field-siteOrFolderField",
14-
);
12+
const siteOrFolderFieldLocator = this.page.getByTestId('field-siteOrFolderField');
1513
await siteOrFolderFieldLocator.click();
1614

17-
const treeNodeLocator = this.page.locator(".p-treenode");
15+
const treeNodeLocator = this.page.locator('.p-treenode');
1816
const textContent = await treeNodeLocator.first().textContent();
1917
await treeNodeLocator.first().click();
2018

21-
const labelLocator = this.page.locator(".p-treeselect-label");
19+
const labelLocator = this.page.locator('.p-treeselect-label');
2220
await expect(labelLocator).toHaveText(`//${textContent}`);
2321
return textContent;
2422
}
2523

2624
async save() {
27-
const saveButtonLocator = this.page.getByRole("button", {
28-
name: "Save",
25+
const saveButtonLocator = this.page.getByRole('button', {
26+
name: 'Save'
2927
});
3028
await expect(saveButtonLocator).toBeVisible();
3129

3230
const responsePromise = this.page.waitForResponse((response) => {
3331
return (
34-
response.status() === 200 &&
35-
response.url().includes("/api/v1/workflow/actions/")
32+
response.status() === 200 && response.url().includes('/api/v1/workflow/actions/')
3633
);
3734
});
3835
await saveButtonLocator.click();

0 commit comments

Comments
 (0)