(frontend) enhance document interaction tests

- Updated test cases to improve accessibility by replacing 'more_vert'
with 'more_horiz' for action buttons across various components.
- Refactored document deletion confirmation messages to use consistent
heading roles for better visibility.
- Simplified keyboard interactions in document table content tests for
improved clarity.
- Adjusted visibility checks for the share button to utilize more
descriptive labels.
- Cleaned up test code for maintainability and consistency.
This commit is contained in:
Nathan Panchout
2024-12-23 10:32:42 +01:00
committed by Anthony LC
parent 7c696fc1ec
commit 81e9fc49fe
7 changed files with 30 additions and 25 deletions

View File

@@ -113,7 +113,7 @@ test.describe('Document grid item options', () => {
await removeButton.click(); await removeButton.click();
await expect( await expect(
page.locator('h2').getByText(`Deleting the document "${docs[0].title}"`), page.getByRole('heading', { name: 'Delete a doc' }),
).toBeVisible(); ).toBeVisible();
await page await page

View File

@@ -94,7 +94,13 @@ test.describe('Doc Header', () => {
.click(); .click();
await expect( await expect(
page.locator('h2').getByText(`Deleting the document "${randomDoc}"`), page.getByRole('heading', { name: 'Delete a doc' }),
).toBeVisible();
await expect(
page.getByText(
`Are you sure you want to delete the document "${randomDoc}"?`,
),
).toBeVisible(); ).toBeVisible();
await page await page
@@ -167,7 +173,7 @@ test.describe('Doc Header', () => {
).toBeVisible(); ).toBeVisible();
await expect(invitationCard.getByLabel('doc-role-dropdown')).toBeVisible(); await expect(invitationCard.getByLabel('doc-role-dropdown')).toBeVisible();
await invitationCard.getByRole('button', { name: 'more_vert' }).click(); await invitationCard.getByRole('button', { name: 'more_horiz' }).click();
await expect( await expect(
page.getByRole('button', { page.getByRole('button', {
@@ -183,9 +189,9 @@ test.describe('Doc Header', () => {
).toBeVisible(); ).toBeVisible();
await expect(memberCard.getByLabel('doc-role-dropdown')).toBeVisible(); await expect(memberCard.getByLabel('doc-role-dropdown')).toBeVisible();
await expect( await expect(
memberCard.getByRole('button', { name: 'more_vert' }), memberCard.getByRole('button', { name: 'more_horiz' }),
).toBeVisible(); ).toBeVisible();
await memberCard.getByRole('button', { name: 'more_vert' }).click(); await memberCard.getByRole('button', { name: 'more_horiz' }).click();
await expect( await expect(
page.getByRole('button', { page.getByRole('button', {
@@ -245,14 +251,14 @@ test.describe('Doc Header', () => {
).toBeVisible(); ).toBeVisible();
await expect(invitationCard.getByLabel('doc-role-text')).toBeVisible(); await expect(invitationCard.getByLabel('doc-role-text')).toBeVisible();
await expect( await expect(
invitationCard.getByRole('button', { name: 'more_vert' }), invitationCard.getByRole('button', { name: 'more_horiz' }),
).toBeHidden(); ).toBeHidden();
const memberCard = shareModal.getByLabel('List members card'); const memberCard = shareModal.getByLabel('List members card');
await expect(memberCard.getByText('test@accesses.test')).toBeVisible(); await expect(memberCard.getByText('test@accesses.test')).toBeVisible();
await expect(memberCard.getByLabel('doc-role-text')).toBeVisible(); await expect(memberCard.getByLabel('doc-role-text')).toBeVisible();
await expect( await expect(
memberCard.getByRole('button', { name: 'more_vert' }), memberCard.getByRole('button', { name: 'more_horiz' }),
).toBeHidden(); ).toBeHidden();
}); });
@@ -307,14 +313,14 @@ test.describe('Doc Header', () => {
).toBeVisible(); ).toBeVisible();
await expect(invitationCard.getByLabel('doc-role-text')).toBeVisible(); await expect(invitationCard.getByLabel('doc-role-text')).toBeVisible();
await expect( await expect(
invitationCard.getByRole('button', { name: 'more_vert' }), invitationCard.getByRole('button', { name: 'more_horiz' }),
).toBeHidden(); ).toBeHidden();
const memberCard = shareModal.getByLabel('List members card'); const memberCard = shareModal.getByLabel('List members card');
await expect(memberCard.getByText('test@accesses.test')).toBeVisible(); await expect(memberCard.getByText('test@accesses.test')).toBeVisible();
await expect(memberCard.getByLabel('doc-role-text')).toBeVisible(); await expect(memberCard.getByLabel('doc-role-text')).toBeVisible();
await expect( await expect(
memberCard.getByRole('button', { name: 'more_vert' }), memberCard.getByRole('button', { name: 'more_horiz' }),
).toBeHidden(); ).toBeHidden();
}); });

View File

@@ -227,7 +227,7 @@ test.describe('Document create member', () => {
await page.getByRole('button', { name: 'Reader' }).click(); await page.getByRole('button', { name: 'Reader' }).click();
const moreActions = userInvitation.getByRole('button', { const moreActions = userInvitation.getByRole('button', {
name: 'more_vert', name: 'more_horiz',
}); });
await moreActions.click(); await moreActions.click();

View File

@@ -182,18 +182,20 @@ test.describe('Document list members', () => {
const emailMyself = `user@${browserName}.e2e`; const emailMyself = `user@${browserName}.e2e`;
const mySelf = list.getByTestId(`doc-share-member-row-${emailMyself}`); const mySelf = list.getByTestId(`doc-share-member-row-${emailMyself}`);
const mySelfMoreActions = mySelf.getByRole('button', { name: 'more_vert' }); const mySelfMoreActions = mySelf.getByRole('button', {
name: 'more_horiz',
});
const userOwnerEmail = await addNewMember(page, 0, 'Owner'); const userOwnerEmail = await addNewMember(page, 0, 'Owner');
const userOwner = list.getByTestId( const userOwner = list.getByTestId(
`doc-share-member-row-${userOwnerEmail}`, `doc-share-member-row-${userOwnerEmail}`,
); );
const userOwnerMoreActions = userOwner.getByRole('button', { const userOwnerMoreActions = userOwner.getByRole('button', {
name: 'more_vert', name: 'more_horiz',
}); });
await page.getByRole('button', { name: 'close' }).first().click(); await page.getByRole('button', { name: 'close' }).first().click();
await page.getByRole('button', { name: 'Share' }).click(); await page.getByRole('button', { name: 'Share' }).first().click();
const userReaderEmail = await addNewMember(page, 0, 'Reader'); const userReaderEmail = await addNewMember(page, 0, 'Reader');
@@ -201,7 +203,7 @@ test.describe('Document list members', () => {
`doc-share-member-row-${userReaderEmail}`, `doc-share-member-row-${userReaderEmail}`,
); );
const userReaderMoreActions = userReader.getByRole('button', { const userReaderMoreActions = userReader.getByRole('button', {
name: 'more_vert', name: 'more_horiz',
}); });
await expect(mySelf).toBeVisible(); await expect(mySelf).toBeVisible();

View File

@@ -31,11 +31,7 @@ test.describe('Doc Table Content', () => {
await page.locator('.bn-block-outer').first().click(); await page.locator('.bn-block-outer').first().click();
await editor.click(); await editor.click();
await page.locator('.bn-block-outer').last().click(); await page.locator('.bn-block-outer').last().click();
await page.keyboard.press('Enter');
// Create space to fill the viewport
for (let i = 0; i < 2; i++) {
await page.keyboard.press('Enter');
}
await editor.locator('.bn-block-outer').last().fill('/'); await editor.locator('.bn-block-outer').last().fill('/');
await page.getByText('Heading 2').click(); await page.getByText('Heading 2').click();
@@ -44,9 +40,7 @@ test.describe('Doc Table Content', () => {
await page.locator('.bn-block-outer').last().click(); await page.locator('.bn-block-outer').last().click();
// Create space to fill the viewport // Create space to fill the viewport
for (let i = 0; i < 2; i++) { await page.keyboard.press('Enter');
await page.keyboard.press('Enter');
}
await editor.locator('.bn-block-outer').last().fill('/'); await editor.locator('.bn-block-outer').last().fill('/');
await page.getByText('Heading 3').click(); await page.getByText('Heading 3').click();
@@ -55,7 +49,7 @@ test.describe('Doc Table Content', () => {
expect(true).toBe(true); expect(true).toBe(true);
const summaryContainer = page.locator('#summaryContainer'); const summaryContainer = page.locator('#summaryContainer');
await summaryContainer.hover(); await summaryContainer.click();
const level1 = summaryContainer.getByText('Level 1'); const level1 = summaryContainer.getByText('Level 1');
const level2 = summaryContainer.getByText('Level 2'); const level2 = summaryContainer.getByText('Level 2');

View File

@@ -30,7 +30,11 @@ test.describe('Doc Version', () => {
await expect(panel).toBeVisible(); await expect(panel).toBeVisible();
await expect(modal.getByText('No versions')).toBeVisible(); await expect(modal.getByText('No versions')).toBeVisible();
const editor = page.locator('.ProseMirror');
await modal.getByRole('button', { name: 'close' }).click(); await modal.getByRole('button', { name: 'close' }).click();
await editor.locator('.bn-block-outer').last().fill('/');
await page.getByText('Heading 1').click();
await page.locator('.ProseMirror.bn-editor').click(); await page.locator('.ProseMirror.bn-editor').click();
await page.locator('.ProseMirror.bn-editor').last().fill('Hello World'); await page.locator('.ProseMirror.bn-editor').last().fill('Hello World');
await goToGridDoc(page, { await goToGridDoc(page, {
@@ -64,7 +68,6 @@ test.describe('Doc Version', () => {
await expect(panel).toBeVisible(); await expect(panel).toBeVisible();
await expect(page.getByText('History', { exact: true })).toBeVisible(); await expect(page.getByText('History', { exact: true })).toBeVisible();
await expect(page.getByRole('status')).toBeVisible();
await expect(page.getByRole('status')).toBeHidden(); await expect(page.getByRole('status')).toBeHidden();
const items = await panel.locator('.version-item').all(); const items = await panel.locator('.version-item').all();
expect(items.length).toBe(1); expect(items.length).toBe(1);

View File

@@ -172,7 +172,7 @@ test.describe('Doc Visibility: Restricted', () => {
await page.goto(urlDoc); await page.goto(urlDoc);
await verifyDocName(page, docTitle); await verifyDocName(page, docTitle);
await expect(page.getByRole('button', { name: 'Share' })).toBeVisible(); await expect(page.getByLabel('Share button')).toBeVisible();
}); });
}); });