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.

Sign up for GitHub

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

Jump to bottom

Improve Playwright tests #168

Merged
merged 6 commits into from
May 30, 2024
Merged

Improve Playwright tests #168

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
befb2fa
Fix Playwright tests
bosschaert May 28, 2024
10abb65
Add test that switches between pages
bosschaert May 28, 2024
a44c354
Fix linting error
bosschaert May 28, 2024
e292e45
Allow local da-collab and da-admin for PW tests
bosschaert May 28, 2024
a8fdbfc
Remove a bunch of timeouts that are not needed any more
bosschaert May 29, 2024
224e6b1
Run the regionaledits test in a unique test folder
bosschaert May 30, 2024
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
6 changes: 3 additions & 3 deletions test/e2e/tests/delete.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ test('Delete multiple old pages', async ({ page }, workerInfo) => {
return;
}

test.setTimeout(40000);
test.setTimeout(80000);

// Open the directory listing
await page.goto(`${ENV}/#/da-sites/da-status/tests`);
Expand Down Expand Up @@ -57,7 +57,7 @@ test('Delete multiple old pages', async ({ page }, workerInfo) => {

// If we're here the page has to be deleted. We'll tick the checkbox next to it in the page
const checkbox = page.locator('li').filter({ hasText: fileName }).locator('input[type="checkbox"][name="item-selected"]');
console.log('checkboxes:', await checkbox.count());
console.log('To be deleted, checked box:', await checkbox.count());
await checkbox.focus();
await page.keyboard.press(' ');
itemsToDelete = true;
Expand All @@ -72,5 +72,5 @@ test('Delete multiple old pages', async ({ page }, workerInfo) => {
await page.getByRole('button', { name: 'Delete' }).click();

// Wait for the delete button to disappear which is when we're done
await expect(page.getByRole('button', { name: 'Delete' })).not.toBeVisible({ timeout: 30000 });
await expect(page.getByRole('button', { name: 'Delete' })).not.toBeVisible({ timeout: 60000 });
});
50 changes: 46 additions & 4 deletions test/e2e/tests/edit.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,7 @@ test('Update Document', async ({ browser, page }, workerInfo) => {
const enteredText = `[${workerInfo.project.name}] Edited by test ${new Date()}`;
await page.locator('div.ProseMirror').fill(enteredText);

// Wait 3 secs
await page.waitForTimeout(3000);
await page.waitForTimeout(1000);
await page.close();

const newPage = await browser.newPage();
Expand All @@ -47,12 +46,12 @@ test('Create Delete Document', async ({ browser, page }, workerInfo) => {
await page.locator('button:text("Create document")').click();
await expect(page.locator('div.ProseMirror')).toBeVisible();
await page.locator('div.ProseMirror').fill('testcontent');
await page.waitForTimeout(1000);

const newPage = await browser.newPage();
await newPage.goto(`${ENV}/#/da-sites/da-status/tests`);

// Wait 1 sec
await newPage.waitForTimeout(4000);
await newPage.waitForTimeout(3000);
await newPage.reload();

await expect(newPage.locator(`a[href="/edit#/da-sites/da-status/tests/${pageName}"]`)).toBeVisible();
Expand All @@ -68,3 +67,46 @@ test('Create Delete Document', async ({ browser, page }, workerInfo) => {
await page.waitForTimeout(1000);
await expect(newPage.locator(`a[href="/edit#/da-sites/da-status/tests/${pageName}"]`)).not.toBeVisible();
});

test('Change document by switching anchors', async ({ page }, workerInfo) => {
test.setTimeout(15000);

const url = getTestPageURL('edit3', workerInfo);
const urlA = `${url}A`;
const urlB = `${url}B`;

await page.goto(urlA);
await expect(page.locator('div.ProseMirror')).toBeVisible();

await page.locator('div.ProseMirror').fill('before table');
await page.getByText('Block', { exact: true }).click();
await page.getByText('columns').fill('mytable');
await page.keyboard.press('Tab');
await page.keyboard.press('k');
await page.keyboard.press('Tab');
await page.keyboard.press('v');
await page.getByText('Edit Block').click();
await page.getByText('Insert row after').click();
await page.keyboard.press('Tab');
await page.keyboard.type('k 2');
await page.keyboard.press('Tab');
await page.keyboard.type('v 2');

await page.waitForTimeout(1000);

await page.goto(urlB);
await expect(page.locator('div.ProseMirror')).toBeVisible();

await page.locator('div.ProseMirror').fill('page B');
await page.waitForTimeout(1000);

await page.goto(urlA);
await expect(page.locator('div.ProseMirror')).toBeVisible();
await expect(page.locator('div.ProseMirror')).toContainText('mytable');
await expect(page.locator('div.ProseMirror')).toContainText('k 2');
await expect(page.locator('div.ProseMirror')).toContainText('v 2');

await page.goto(urlB);
await expect(page.locator('div.ProseMirror')).toBeVisible();
await expect(page.locator('div.ProseMirror')).toContainText('page B');
});
82 changes: 37 additions & 45 deletions test/e2e/tests/regionaledits.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,50 +1,42 @@
import { test, expect } from '@playwright/test';
import path from 'path';
import ENV from '../utils/env.js';
import { getTestFolderURL } from '../utils/page.js';

const deleteTestPage = async () => {
// Delete the document even if the test fails;
const pageName = 'regionaledit.html';
const adminURL = `https://admin.da.live/source/da-sites/da-status/tests/${pageName}`;
await fetch(adminURL, { method: 'DELETE' });
};

test('Regional Edit Document', async ({ page }) => {
test('Regional Edit Document', async ({ page }, workerInfo) => {
test.setTimeout(15000);
await deleteTestPage();

try {
await page.goto(`${ENV}/#/da-sites/da-status/tests`);
await page.getByRole('button', { name: 'New' }).click();
await page.getByRole('button', { name: 'Media' }).click();

const [fileChooser] = await Promise.all([
page.waitForEvent('filechooser'),
page.getByText('Select file').click(),
]);

const htmlFile = path.join(__dirname, '/mocks/regionaledit.html');
console.log(htmlFile);
await fileChooser.setFiles([`${htmlFile}`]);

await page.getByRole('button', { name: 'Upload' }).click();
await page.getByRole('link', { name: 'regionaledit' }).click();

await expect(page.locator('div.loc-color-overlay.loc-langstore')).toBeVisible();
await expect(page.locator('div.loc-color-overlay.loc-regional')).toBeVisible();

expect(page.getByText('Deleted H1 Here', { exact: true })).toBeVisible();
expect(page.getByText('Added H1 Here', { exact: true })).toBeVisible();

await page.locator('div.loc-color-overlay.loc-langstore').hover();
await page.locator('da-loc-deleted').getByText('Delete', { exact: true }).click();
await expect(page.getByText('Deleted H1 Here', { exact: true })).not.toBeVisible();

await page.locator('div.loc-color-overlay.loc-regional').hover();
await page.locator('da-loc-added').getByText('Keep', { exact: true }).click();
await expect(page.getByText('Added H1 Here', { exact: true })).toBeVisible();
await expect(page.locator('div.loc-color-overlay.loc-regional')).not.toBeVisible();
} finally {
deleteTestPage();
}

const folderURL = getTestFolderURL('regionaledit', workerInfo);
await page.goto(folderURL);
await page.getByRole('button', { name: 'New' }).click();
await page.getByRole('button', { name: 'Media' }).click();

const [fileChooser] = await Promise.all([
page.waitForEvent('filechooser'),
page.getByText('Select file').click(),
]);

const htmlFile = path.join(__dirname, '/mocks/regionaledit.html');
console.log(htmlFile);
await fileChooser.setFiles([`${htmlFile}`]);

await page.getByRole('button', { name: 'Upload' }).click();
await page.getByRole('link', { name: 'regionaledit', exact: true }).click();

await expect(page.locator('div.loc-color-overlay.loc-langstore')).toBeVisible();
await expect(page.locator('div.loc-color-overlay.loc-regional')).toBeVisible();

expect(page.getByText('Deleted H1 Here', { exact: true })).toBeVisible();
expect(page.getByText('Added H1 Here', { exact: true })).toBeVisible();

await page.locator('div.loc-color-overlay.loc-langstore').hover();
await page.locator('da-loc-deleted').getByText('Delete', { exact: true }).click();
await expect(page.getByText('Deleted H1 Here', { exact: true })).not.toBeVisible();

await page.locator('div.loc-color-overlay.loc-regional').hover();
await page.locator('da-loc-added').getByText('Keep', { exact: true }).click();
await expect(page.getByText('Added H1 Here', { exact: true })).toBeVisible();
await expect(page.locator('div.loc-color-overlay.loc-regional')).not.toBeVisible();

// Note that the test folder will be automatically cleaned up in subsequent runs
// by the delete.spec.js test
});
2 changes: 1 addition & 1 deletion test/e2e/tests/versions.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ test('Create Version and Restore from it', async ({ page }, workerInfo) => {

// Select 'ver 1' and restore it
await page.getByText('ver 1', { exact: false }).click();
await page.getByRole('button', { name: 'Restore' }).click();
await page.locator('li').filter({ hasText: 'ver 1' }).getByRole('button').click();
await page.locator('div.da-version-action-area').getByText('Restore').click();

// Ensure that the original text is still there
Expand Down
23 changes: 22 additions & 1 deletion test/e2e/utils/page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,20 @@
*/
import ENV from './env.js';

function getQuery() {
const { GITHUB_HEAD_REF: branch } = process.env;
if (branch === 'local') {
return '?da-admin=local&da-collab=local';
}
return '';
}

const QUERY = getQuery();

function getTestURL(type, testIdentifier, workerInfo) {
const dateStamp = Date.now().toString(36);
const pageName = `pw-${testIdentifier}-${dateStamp}-${workerInfo.project.name}`;
return `${ENV}/${type}#/da-sites/da-status/tests/${pageName}`;
return `${ENV}/${type}${QUERY}#/da-sites/da-status/tests/${pageName}`;
}

/**
Expand All @@ -28,6 +38,17 @@ export function getTestPageURL(testIdentifier, workerInfo) {
return getTestURL('edit', testIdentifier, workerInfo);
}

/**
* Returns a URL for a single-use test folder.
*
* @param {string} testIdentifier - A identifier for the test
* @param {object} workerInfo - workerInfo as passed in by Playwright
* @returns {string} The URL for the test page.
*/
export function getTestFolderURL(testIdentifier, workerInfo) {
return getTestURL('', testIdentifier, workerInfo);
}

/**
* Returns a URL for a single-use test sheet.
*
Expand Down
Loading