test: add page title test ids to await and await mounting loader components
This commit is contained in:
@@ -2,12 +2,12 @@ const { AuthenticatedPage } = require('../authenticated-page');
|
||||
const { RoleConditionsModal } = require('./role-conditions-modal');
|
||||
|
||||
export class AdminCreateRolePage extends AuthenticatedPage {
|
||||
screenshotPath = '/admin/create-role'
|
||||
screenshotPath = '/admin/create-role';
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Page} page
|
||||
*/
|
||||
constructor (page) {
|
||||
constructor(page) {
|
||||
super(page);
|
||||
this.nameInput = page.getByTestId('name-input');
|
||||
this.descriptionInput = page.getByTestId('description-input');
|
||||
@@ -15,27 +15,28 @@ export class AdminCreateRolePage extends AuthenticatedPage {
|
||||
this.connectionRow = page.getByTestId('Connection-permission-row');
|
||||
this.executionRow = page.getByTestId('Execution-permission-row');
|
||||
this.flowRow = page.getByTestId('Flow-permission-row');
|
||||
this.pageTitle = page.getByTestId('create-role-title');
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {('Connection'|'Execution'|'Flow')} subject
|
||||
* @param {('Connection'|'Execution'|'Flow')} subject
|
||||
*/
|
||||
getRoleConditionsModal (subject) {
|
||||
getRoleConditionsModal(subject) {
|
||||
return new RoleConditionsModal(this.page, subject);
|
||||
}
|
||||
|
||||
async getPermissionConfigs () {
|
||||
async getPermissionConfigs() {
|
||||
const subjects = ['Connection', 'Flow', 'Execution'];
|
||||
const permissionConfigs = [];
|
||||
for (let subject of subjects) {
|
||||
const row = this.getSubjectRow(subject);
|
||||
const actionInputs = await this.getRowInputs(row);
|
||||
Object.keys(actionInputs).forEach(action => {
|
||||
Object.keys(actionInputs).forEach((action) => {
|
||||
permissionConfigs.push({
|
||||
action,
|
||||
locator: actionInputs[action],
|
||||
subject,
|
||||
row
|
||||
row,
|
||||
});
|
||||
});
|
||||
}
|
||||
@@ -43,50 +44,50 @@ export class AdminCreateRolePage extends AuthenticatedPage {
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @param {(
|
||||
* 'Connection' | 'Flow' | 'Execution'
|
||||
* )} subject
|
||||
* )} subject
|
||||
*/
|
||||
getSubjectRow (subject) {
|
||||
const k = `${subject.toLowerCase()}Row`
|
||||
getSubjectRow(subject) {
|
||||
const k = `${subject.toLowerCase()}Row`;
|
||||
if (this[k]) {
|
||||
return this[k]
|
||||
return this[k];
|
||||
} else {
|
||||
throw 'Unknown row'
|
||||
throw 'Unknown row';
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
*/
|
||||
async getRowInputs (row) {
|
||||
async getRowInputs(row) {
|
||||
const inputs = {
|
||||
// settingsButton: row.getByTestId('permission-settings-button')
|
||||
}
|
||||
};
|
||||
for (let input of ['create', 'read', 'update', 'delete', 'publish']) {
|
||||
const testId = `${input}-checkbox`
|
||||
if (await row.getByTestId(testId).count() > 0) {
|
||||
const testId = `${input}-checkbox`;
|
||||
if ((await row.getByTestId(testId).count()) > 0) {
|
||||
inputs[input] = row.getByTestId(testId).locator('input');
|
||||
}
|
||||
}
|
||||
return inputs
|
||||
return inputs;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
*/
|
||||
async clickPermissionSettings (row) {
|
||||
async clickPermissionSettings(row) {
|
||||
await row.getByTestId('permission-settings-button').click();
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {string} subject
|
||||
*
|
||||
* @param {string} subject
|
||||
* @param {'create'|'read'|'update'|'delete'|'publish'} action
|
||||
* @param {boolean} val
|
||||
* @param {boolean} val
|
||||
*/
|
||||
async updateAction (subject, action, val) {
|
||||
async updateAction(subject, action, val) {
|
||||
const row = await this.getSubjectRow(subject);
|
||||
const inputs = await this.getRowInputs(row);
|
||||
if (inputs[action]) {
|
||||
@@ -100,7 +101,7 @@ export class AdminCreateRolePage extends AuthenticatedPage {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
throw new Error(`${subject} does not have action ${action}`)
|
||||
throw new Error(`${subject} does not have action ${action}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -7,24 +7,25 @@ export class AdminCreateUserPage extends AuthenticatedPage {
|
||||
/**
|
||||
* @param {import('@playwright/test').Page} page
|
||||
*/
|
||||
constructor (page) {
|
||||
constructor(page) {
|
||||
super(page);
|
||||
this.fullNameInput = page.getByTestId('full-name-input');
|
||||
this.emailInput = page.getByTestId('email-input');
|
||||
this.passwordInput = page.getByTestId('password-input');
|
||||
this.roleInput = page.getByTestId('role.id-autocomplete');
|
||||
this.createButton = page.getByTestId('create-button');
|
||||
this.pageTitle = page.getByTestId('create-user-title');
|
||||
}
|
||||
|
||||
seed (seed) {
|
||||
seed(seed) {
|
||||
faker.seed(seed || 0);
|
||||
}
|
||||
|
||||
generateUser () {
|
||||
generateUser() {
|
||||
return {
|
||||
fullName: faker.person.fullName(),
|
||||
email: faker.internet.email().toLowerCase(),
|
||||
password: faker.internet.password()
|
||||
}
|
||||
password: faker.internet.password(),
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -5,5 +5,6 @@ export class AdminEditRolePage extends AdminCreateRolePage {
|
||||
super(page);
|
||||
delete this.createButton;
|
||||
this.updateButton = page.getByTestId('update-button');
|
||||
this.pageTitle = page.getByTestId('edit-role-title');
|
||||
}
|
||||
}
|
@@ -15,6 +15,7 @@ export class AdminEditUserPage extends AuthenticatedPage {
|
||||
this.emailInput = page.getByTestId('email-input');
|
||||
this.roleInput = page.getByTestId('role.id-autocomplete');
|
||||
this.updateButton = page.getByTestId('update-button');
|
||||
this.pageTitle = page.getByTestId('edit-user-title');
|
||||
}
|
||||
|
||||
generateUser () {
|
||||
|
@@ -14,6 +14,7 @@ export class AdminRolesPage extends AuthenticatedPage {
|
||||
this.deleteRoleModal = new DeleteRoleModal(page);
|
||||
this.roleRow = page.getByTestId('role-row');
|
||||
this.rolesLoader = page.getByTestId('roles-list-loader');
|
||||
this.pageTitle = page.getByTestId('roles-page-title');
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -28,8 +29,9 @@ export class AdminRolesPage extends AuthenticatedPage {
|
||||
await this.drawerMenuButton.click();
|
||||
}
|
||||
await this.roleDrawerLink.click();
|
||||
await this.isMounted();
|
||||
await this.rolesLoader.waitFor({
|
||||
state: 'detached',
|
||||
state: 'detached'
|
||||
});
|
||||
}
|
||||
|
||||
|
@@ -10,7 +10,7 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
/**
|
||||
* @param {import('@playwright/test').Page} page
|
||||
*/
|
||||
constructor (page) {
|
||||
constructor(page) {
|
||||
super(page);
|
||||
this.createUserButton = page.getByTestId('create-user');
|
||||
this.userRow = page.getByTestId('user-row');
|
||||
@@ -20,14 +20,16 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
this.nextPageButton = page.getByTestId('next-page-button');
|
||||
this.lastPageButton = page.getByTestId('last-page-button');
|
||||
this.usersLoader = page.getByTestId('users-list-loader');
|
||||
this.pageTitle = page.getByTestId('users-page-title');
|
||||
}
|
||||
|
||||
async navigateTo () {
|
||||
async navigateTo() {
|
||||
await this.profileMenuButton.click();
|
||||
await this.adminMenuItem.click();
|
||||
await this.isMounted();
|
||||
if (await this.usersLoader.isVisible()) {
|
||||
await this.usersLoader.waitFor({
|
||||
state: 'detached'
|
||||
state: 'detached',
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -35,48 +37,48 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
/**
|
||||
* @param {string} email
|
||||
*/
|
||||
async getUserRowByEmail (email) {
|
||||
async getUserRowByEmail(email) {
|
||||
return this.userRow.filter({
|
||||
has: this.page.getByTestId('user-email').filter({
|
||||
hasText: email
|
||||
})
|
||||
hasText: email,
|
||||
}),
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
*/
|
||||
async getRowData (row) {
|
||||
async getRowData(row) {
|
||||
return {
|
||||
fullName: await row.getByTestId('user-full-name').textContent(),
|
||||
email: await row.getByTestId('user-email').textContent(),
|
||||
role: await row.getByTestId('user-role').textContent()
|
||||
}
|
||||
role: await row.getByTestId('user-role').textContent(),
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
*/
|
||||
async clickEditUser (row) {
|
||||
async clickEditUser(row) {
|
||||
await row.getByTestId('user-edit').click();
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
* @param {import('@playwright/test').Locator} row
|
||||
*/
|
||||
async clickDeleteUser (row) {
|
||||
async clickDeleteUser(row) {
|
||||
await row.getByTestId('delete-button').click();
|
||||
return this.deleteUserModal;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} email
|
||||
* @param {string} email
|
||||
* @returns {import('@playwright/test').Locator | null}
|
||||
*/
|
||||
async findUserPageWithEmail (email) {
|
||||
async findUserPageWithEmail(email) {
|
||||
if (await this.usersLoader.isVisible()) {
|
||||
await this.usersLoader.waitFor({
|
||||
state: 'detached'
|
||||
state: 'detached',
|
||||
});
|
||||
}
|
||||
// start at the first page
|
||||
@@ -88,10 +90,11 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
while (true) {
|
||||
if (await this.usersLoader.isVisible()) {
|
||||
await this.usersLoader.waitFor({
|
||||
state: 'detached'
|
||||
state: 'detached',
|
||||
});
|
||||
}
|
||||
const rowLocator = await this.getUserRowByEmail(email);
|
||||
console.log('rowLocator.count', email, await rowLocator.count());
|
||||
if ((await rowLocator.count()) === 1) {
|
||||
return rowLocator;
|
||||
}
|
||||
@@ -103,7 +106,7 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
}
|
||||
}
|
||||
|
||||
async getTotalRows () {
|
||||
async getTotalRows() {
|
||||
return await this.page.evaluate(() => {
|
||||
const node = document.querySelector('[data-total-count]');
|
||||
if (node) {
|
||||
@@ -116,7 +119,7 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
});
|
||||
}
|
||||
|
||||
async getRowsPerPage () {
|
||||
async getRowsPerPage() {
|
||||
return await this.page.evaluate(() => {
|
||||
const node = document.querySelector('[data-rows-per-page]');
|
||||
if (node) {
|
||||
@@ -128,4 +131,4 @@ export class AdminUsersPage extends AuthenticatedPage {
|
||||
return 0;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -12,7 +12,9 @@ export class AuthenticatedPage extends BasePage {
|
||||
|
||||
this.profileMenuButton = this.page.getByTestId('profile-menu-button');
|
||||
this.adminMenuItem = this.page.getByRole('menuitem', { name: 'Admin' });
|
||||
this.userInterfaceDrawerItem = this.page.getByTestId('user-interface-drawer-link');
|
||||
this.userInterfaceDrawerItem = this.page.getByTestId(
|
||||
'user-interface-drawer-link'
|
||||
);
|
||||
this.appBar = this.page.getByTestId('app-bar');
|
||||
this.drawerMenuButton = this.page.getByTestId('drawer-menu-button');
|
||||
this.goToDashboardButton = this.page.getByTestId('go-back-drawer-link');
|
||||
|
@@ -15,45 +15,46 @@ export class BasePage {
|
||||
constructor(page) {
|
||||
this.page = page;
|
||||
this.snackbar = page.locator('*[data-test^="snackbar"]');
|
||||
this.pageTitle = this.page.getByTestId('page-title');
|
||||
}
|
||||
|
||||
/**
|
||||
* Finds the latest snackbar message and extracts relevant data
|
||||
* @param {string | undefined} testId
|
||||
* @param {string | undefined} testId
|
||||
* @returns {(
|
||||
* null | {
|
||||
* variant: SnackbarVariant,
|
||||
* text: string,
|
||||
* dataset: { [key: string]: string }
|
||||
* }
|
||||
* )}
|
||||
* )}
|
||||
*/
|
||||
async getSnackbarData (testId) {
|
||||
async getSnackbarData(testId) {
|
||||
if (!testId) {
|
||||
testId = 'snackbar';
|
||||
}
|
||||
const snack = this.page.getByTestId(testId);
|
||||
return {
|
||||
variant: await snack.getAttribute('data-snackbar-variant'),
|
||||
text: await snack.evaluate(node => node.innerText),
|
||||
dataset: await snack.evaluate(node => {
|
||||
function getChildren (n) {
|
||||
text: await snack.evaluate((node) => node.innerText),
|
||||
dataset: await snack.evaluate((node) => {
|
||||
function getChildren(n) {
|
||||
return [n].concat(
|
||||
...Array.from(n.children).map(c => getChildren(c))
|
||||
...Array.from(n.children).map((c) => getChildren(c))
|
||||
);
|
||||
}
|
||||
const datasets = getChildren(node).map(
|
||||
n => Object.assign({}, n.dataset)
|
||||
const datasets = getChildren(node).map((n) =>
|
||||
Object.assign({}, n.dataset)
|
||||
);
|
||||
return Object.assign({}, ...datasets);
|
||||
})
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes all snackbars, should be replaced later
|
||||
*/
|
||||
async closeSnackbar () {
|
||||
async closeSnackbar() {
|
||||
const snackbars = await this.snackbar.all();
|
||||
for (const snackbar of snackbars) {
|
||||
await snackbar.click();
|
||||
@@ -78,4 +79,8 @@ export class BasePage {
|
||||
|
||||
return await this.page.screenshot({ path: computedPath, ...restOptions });
|
||||
}
|
||||
|
||||
async isMounted() {
|
||||
await this.pageTitle.waitFor({ state: 'attached' });
|
||||
}
|
||||
}
|
||||
|
@@ -5,12 +5,12 @@ export class LoginPage extends BasePage {
|
||||
static defaultEmail = process.env.LOGIN_EMAIL;
|
||||
static defaultPassword = process.env.LOGIN_PASSWORD;
|
||||
|
||||
static setDefaultLogin (email, password) {
|
||||
static setDefaultLogin(email, password) {
|
||||
this.defaultEmail = email;
|
||||
this.defaultPassword = password;
|
||||
}
|
||||
|
||||
static resetDefaultLogin () {
|
||||
static resetDefaultLogin() {
|
||||
this.defaultEmail = process.env.LOGIN_EMAIL;
|
||||
this.defaultPassword = process.env.LOGIN_PASSWORD;
|
||||
}
|
||||
@@ -25,6 +25,7 @@ export class LoginPage extends BasePage {
|
||||
this.emailTextField = this.page.getByTestId('email-text-field');
|
||||
this.passwordTextField = this.page.getByTestId('password-text-field');
|
||||
this.loginButton = this.page.getByTestId('login-button');
|
||||
this.pageTitle = this.page.getByTestId('login-form-title');
|
||||
}
|
||||
|
||||
async open() {
|
||||
|
@@ -22,6 +22,7 @@ test.describe('Role management page', () => {
|
||||
await test.step('Create a new role', async () => {
|
||||
await adminRolesPage.navigateTo();
|
||||
await adminRolesPage.createRoleButton.click();
|
||||
await adminCreateRolePage.isMounted();
|
||||
await adminCreateRolePage.nameInput.fill('Create Edit Test');
|
||||
await adminCreateRolePage.descriptionInput.fill('Test description');
|
||||
await adminCreateRolePage.createButton.click();
|
||||
@@ -54,6 +55,7 @@ test.describe('Role management page', () => {
|
||||
|
||||
await test.step('Edit the role', async () => {
|
||||
await adminRolesPage.clickEditRole(roleRow);
|
||||
await adminEditRolePage.isMounted();
|
||||
await adminEditRolePage.nameInput.fill('Create Update Test');
|
||||
await adminEditRolePage.descriptionInput.fill('Update test description');
|
||||
await adminEditRolePage.updateButton.click();
|
||||
@@ -70,6 +72,7 @@ test.describe('Role management page', () => {
|
||||
roleRow = await test.step(
|
||||
'Make sure changes reflected on roles page',
|
||||
async () => {
|
||||
await adminRolesPage.isMounted();
|
||||
const roleRow = await adminRolesPage.getRoleRowByName(
|
||||
'Create Update Test'
|
||||
);
|
||||
@@ -110,6 +113,8 @@ test.describe('Role management page', () => {
|
||||
// This test breaks right now
|
||||
test.skip('Make sure create/edit role page is scrollable', async ({
|
||||
adminRolesPage,
|
||||
adminEditRolePage,
|
||||
adminCreateRolePage,
|
||||
page,
|
||||
}) => {
|
||||
const initViewportSize = page.viewportSize;
|
||||
@@ -121,6 +126,7 @@ test.describe('Role management page', () => {
|
||||
await test.step('Ensure create role page is scrollable', async () => {
|
||||
await adminRolesPage.navigateTo(true);
|
||||
await adminRolesPage.createRoleButton.click();
|
||||
await adminCreateRolePage.isMounted();
|
||||
|
||||
const initScrollTop = await page.evaluate(() => {
|
||||
return document.documentElement.scrollTop;
|
||||
@@ -138,6 +144,7 @@ test.describe('Role management page', () => {
|
||||
await adminRolesPage.navigateTo(true);
|
||||
const adminRow = await adminRolesPage.getRoleRowByName('Admin');
|
||||
await adminRolesPage.clickEditRole(adminRow);
|
||||
await adminEditRolePage.isMounted();
|
||||
|
||||
const initScrollTop = await page.evaluate(() => {
|
||||
return document.documentElement.scrollTop;
|
||||
@@ -166,6 +173,7 @@ test.describe('Role management page', () => {
|
||||
await adminRolesPage.navigateTo();
|
||||
await test.step('Create a new role', async () => {
|
||||
await adminRolesPage.createRoleButton.click();
|
||||
await adminCreateRolePage.isMounted();
|
||||
await adminCreateRolePage.nameInput.fill('Delete Role');
|
||||
await adminCreateRolePage.createButton.click();
|
||||
await adminCreateRolePage.snackbar.waitFor({
|
||||
@@ -268,6 +276,7 @@ test.describe('Role management page', () => {
|
||||
await adminRolesPage.navigateTo();
|
||||
await test.step('Create a new role', async () => {
|
||||
await adminRolesPage.createRoleButton.click();
|
||||
await adminCreateRolePage.isMounted();
|
||||
await adminCreateRolePage.nameInput.fill('Cannot Delete Role');
|
||||
await adminCreateRolePage.createButton.click();
|
||||
await adminCreateRolePage.snackbar.waitFor({
|
||||
@@ -282,6 +291,7 @@ test.describe('Role management page', () => {
|
||||
await test.step('Create a new user with this role', async () => {
|
||||
await adminUsersPage.navigateTo();
|
||||
await adminUsersPage.createUserButton.click();
|
||||
await adminCreateUserPage.isMounted();
|
||||
await adminCreateUserPage.fullNameInput.fill('User Delete Role Test');
|
||||
await adminCreateUserPage.emailInput.fill(
|
||||
'user-delete-role-test@automatisch.io'
|
||||
@@ -306,6 +316,7 @@ test.describe('Role management page', () => {
|
||||
const row = await adminUsersPage.findUserPageWithEmail(
|
||||
'user-delete-role-test@automatisch.io'
|
||||
);
|
||||
// await test.waitForTimeout(10000);
|
||||
const modal = await adminUsersPage.clickDeleteUser(row);
|
||||
await modal.deleteButton.click();
|
||||
await adminUsersPage.snackbar.waitFor({
|
||||
@@ -348,6 +359,7 @@ test('Accessibility of role management page', async ({
|
||||
await test.step('Create the basic test role', async () => {
|
||||
await adminRolesPage.navigateTo();
|
||||
await adminRolesPage.createRoleButton.click();
|
||||
await adminCreateRolePage.isMounted();
|
||||
await adminCreateRolePage.nameInput.fill('Basic Test');
|
||||
await adminCreateRolePage.createButton.click();
|
||||
await adminCreateRolePage.snackbar.waitFor({
|
||||
@@ -363,6 +375,7 @@ test('Accessibility of role management page', async ({
|
||||
await test.step('Create a new user with the basic role', async () => {
|
||||
await adminUsersPage.navigateTo();
|
||||
await adminUsersPage.createUserButton.click();
|
||||
await adminCreateUserPage.isMounted();
|
||||
await adminCreateUserPage.fullNameInput.fill('Role Test');
|
||||
await adminCreateUserPage.emailInput.fill('basic-role-test@automatisch.io');
|
||||
await adminCreateUserPage.passwordInput.fill('sample');
|
||||
@@ -378,7 +391,7 @@ test('Accessibility of role management page', async ({
|
||||
'snackbar-create-user-success'
|
||||
);
|
||||
await expect(snackbar.variant).toBe('success');
|
||||
await adminCreateRolePage.closeSnackbar();
|
||||
await adminCreateUserPage.closeSnackbar();
|
||||
});
|
||||
|
||||
await test.step('Logout and login to the basic role user', async () => {
|
||||
@@ -386,6 +399,7 @@ test('Accessibility of role management page', async ({
|
||||
await page.getByTestId('logout-item').click();
|
||||
// await page.reload({ waitUntil: 'networkidle' });
|
||||
const loginPage = new LoginPage(page);
|
||||
// await loginPage.isMounted();
|
||||
await loginPage.login('basic-role-test@automatisch.io', 'sample');
|
||||
await expect(loginPage.loginButton).not.toBeVisible();
|
||||
await expect(page).toHaveURL('/flows');
|
||||
@@ -414,6 +428,7 @@ test('Accessibility of role management page', async ({
|
||||
await page.getByTestId('profile-menu-button').click();
|
||||
await page.getByTestId('logout-item').click();
|
||||
const loginPage = new LoginPage(page);
|
||||
await loginPage.isMounted();
|
||||
await loginPage.login();
|
||||
});
|
||||
|
||||
@@ -423,6 +438,7 @@ test('Accessibility of role management page', async ({
|
||||
'basic-role-test@automatisch.io'
|
||||
);
|
||||
await adminUsersPage.clickEditUser(row);
|
||||
await adminEditUserPage.isMounted();
|
||||
await adminEditUserPage.roleInput.click();
|
||||
await adminEditUserPage.page.getByRole('option', { name: 'Admin' }).click();
|
||||
await adminEditUserPage.updateButton.click();
|
||||
|
@@ -11,15 +11,21 @@ import DeleteIcon from '@mui/icons-material/Delete';
|
||||
type ListLoaderProps = {
|
||||
rowsNumber: number;
|
||||
columnsNumber: number;
|
||||
'data-test'?: string;
|
||||
};
|
||||
|
||||
const ListLoader = ({ rowsNumber, columnsNumber }: ListLoaderProps) => {
|
||||
const ListLoader = ({
|
||||
rowsNumber,
|
||||
columnsNumber,
|
||||
'data-test': dataTest,
|
||||
}: ListLoaderProps) => {
|
||||
return (
|
||||
<>
|
||||
{[...Array(rowsNumber)].map((row, index) => (
|
||||
<TableRow
|
||||
key={index}
|
||||
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
|
||||
data-test={dataTest && index === 0 ? dataTest : undefined}
|
||||
>
|
||||
{[...Array(columnsNumber)].map((cell, index) => (
|
||||
<TableCell key={index} scope="row">
|
||||
|
@@ -44,6 +44,7 @@ function LoginForm() {
|
||||
<Typography
|
||||
variant="h3"
|
||||
align="center"
|
||||
data-test="login-form-title"
|
||||
sx={{
|
||||
borderBottom: '1px solid',
|
||||
borderColor: (theme) => theme.palette.text.disabled,
|
||||
@@ -78,13 +79,15 @@ function LoginForm() {
|
||||
sx={{ mb: 1 }}
|
||||
/>
|
||||
|
||||
{isCloud && <Link
|
||||
component={RouterLink}
|
||||
to={URLS.FORGOT_PASSWORD}
|
||||
underline="none"
|
||||
>
|
||||
{formatMessage('loginForm.forgotPasswordText')}
|
||||
</Link>}
|
||||
{isCloud && (
|
||||
<Link
|
||||
component={RouterLink}
|
||||
to={URLS.FORGOT_PASSWORD}
|
||||
underline="none"
|
||||
>
|
||||
{formatMessage('loginForm.forgotPasswordText')}
|
||||
</Link>
|
||||
)}
|
||||
|
||||
<LoadingButton
|
||||
type="submit"
|
||||
@@ -98,13 +101,15 @@ function LoginForm() {
|
||||
{formatMessage('loginForm.submit')}
|
||||
</LoadingButton>
|
||||
|
||||
{isCloud && <Typography variant="body1" align="center" mt={3}>
|
||||
{formatMessage('loginForm.noAccount')}
|
||||
|
||||
<Link component={RouterLink} to={URLS.SIGNUP} underline="none">
|
||||
{formatMessage('loginForm.signUp')}
|
||||
</Link>
|
||||
</Typography>}
|
||||
{isCloud && (
|
||||
<Typography variant="body1" align="center" mt={3}>
|
||||
{formatMessage('loginForm.noAccount')}
|
||||
|
||||
<Link component={RouterLink} to={URLS.SIGNUP} underline="none">
|
||||
{formatMessage('loginForm.signUp')}
|
||||
</Link>
|
||||
</Typography>
|
||||
)}
|
||||
</Form>
|
||||
</Paper>
|
||||
);
|
||||
|
@@ -4,5 +4,5 @@ import Typography, { TypographyProps } from '@mui/material/Typography';
|
||||
type PageTitleProps = TypographyProps;
|
||||
|
||||
export default function PageTitle(props: PageTitleProps): React.ReactElement {
|
||||
return <Typography variant="h3" {...props} />;
|
||||
return <Typography variant="h3" data-test="page-title" {...props} />;
|
||||
}
|
||||
|
@@ -44,8 +44,8 @@ export default function CreateRole(): React.ReactElement {
|
||||
enqueueSnackbar(formatMessage('createRole.successfullyCreated'), {
|
||||
variant: 'success',
|
||||
SnackbarProps: {
|
||||
'data-test': 'snackbar-create-role-success'
|
||||
}
|
||||
'data-test': 'snackbar-create-role-success',
|
||||
},
|
||||
});
|
||||
|
||||
navigate(URLS.ROLES);
|
||||
@@ -58,7 +58,9 @@ export default function CreateRole(): React.ReactElement {
|
||||
<Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid item xs={12} sx={{ mb: [2, 5] }}>
|
||||
<PageTitle>{formatMessage('createRolePage.title')}</PageTitle>
|
||||
<PageTitle data-test="create-role-title">
|
||||
{formatMessage('createRolePage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} justifyContent="flex-end" sx={{ pt: 5 }}>
|
||||
|
@@ -50,7 +50,7 @@ export default function CreateUser(): React.ReactElement {
|
||||
persist: true,
|
||||
SnackbarProps: {
|
||||
'data-test': 'snackbar-create-user-success',
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
navigate(URLS.USERS);
|
||||
@@ -63,7 +63,9 @@ export default function CreateUser(): React.ReactElement {
|
||||
<Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid item xs={12} sx={{ mb: [2, 5] }}>
|
||||
<PageTitle>{formatMessage('createUserPage.title')}</PageTitle>
|
||||
<PageTitle data-test="create-user-title">
|
||||
{formatMessage('createUserPage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} justifyContent="flex-end" sx={{ pt: 5 }}>
|
||||
|
@@ -54,8 +54,8 @@ export default function EditRole(): React.ReactElement {
|
||||
enqueueSnackbar(formatMessage('editRole.successfullyUpdated'), {
|
||||
variant: 'success',
|
||||
SnackbarProps: {
|
||||
'data-test': 'snackbar-edit-role-success'
|
||||
}
|
||||
'data-test': 'snackbar-edit-role-success',
|
||||
},
|
||||
});
|
||||
|
||||
navigate(URLS.ROLES);
|
||||
@@ -70,7 +70,9 @@ export default function EditRole(): React.ReactElement {
|
||||
<Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid item xs={12} sx={{ mb: [2, 5] }}>
|
||||
<PageTitle>{formatMessage('editRolePage.title')}</PageTitle>
|
||||
<PageTitle data-test="edit-role-title">
|
||||
{formatMessage('editRolePage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} justifyContent="flex-end" sx={{ pt: 5 }}>
|
||||
|
@@ -57,8 +57,8 @@ export default function EditUser(): React.ReactElement {
|
||||
variant: 'success',
|
||||
SnackbarProps: {
|
||||
'data-test': 'snackbar-edit-user-success',
|
||||
persist: true
|
||||
}
|
||||
persist: true,
|
||||
},
|
||||
});
|
||||
|
||||
navigate(URLS.USERS);
|
||||
@@ -71,7 +71,9 @@ export default function EditUser(): React.ReactElement {
|
||||
<Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid item xs={12} sx={{ mb: [2, 5] }}>
|
||||
<PageTitle>{formatMessage('editUserPage.title')}</PageTitle>
|
||||
<PageTitle data-test="edit-user-title">
|
||||
{formatMessage('editUserPage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} justifyContent="flex-end" sx={{ pt: 5 }}>
|
||||
|
@@ -18,16 +18,12 @@ function RolesPage() {
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid container sx={{ mb: [0, 3] }} columnSpacing={1.5} rowSpacing={3}>
|
||||
<Grid container item xs sm alignItems="center">
|
||||
<PageTitle>{formatMessage('rolesPage.title')}</PageTitle>
|
||||
<PageTitle data-test="roles-page-title">
|
||||
{formatMessage('rolesPage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid
|
||||
container
|
||||
item
|
||||
xs="auto"
|
||||
sm="auto"
|
||||
alignItems="center"
|
||||
>
|
||||
<Grid container item xs="auto" sm="auto" alignItems="center">
|
||||
<ConditionalIconButton
|
||||
type="submit"
|
||||
variant="contained"
|
||||
|
@@ -18,16 +18,12 @@ function UsersPage() {
|
||||
<Grid container item xs={12} sm={10} md={9}>
|
||||
<Grid container sx={{ mb: [0, 3] }} columnSpacing={1.5} rowSpacing={3}>
|
||||
<Grid container item xs sm alignItems="center">
|
||||
<PageTitle>{formatMessage('usersPage.title')}</PageTitle>
|
||||
<PageTitle data-test="users-page-title">
|
||||
{formatMessage('usersPage.title')}
|
||||
</PageTitle>
|
||||
</Grid>
|
||||
|
||||
<Grid
|
||||
container
|
||||
item
|
||||
xs="auto"
|
||||
sm="auto"
|
||||
alignItems="center"
|
||||
>
|
||||
<Grid container item xs="auto" sm="auto" alignItems="center">
|
||||
<ConditionalIconButton
|
||||
type="submit"
|
||||
variant="contained"
|
||||
|
Reference in New Issue
Block a user