311 lines
11 KiB
JavaScript
311 lines
11 KiB
JavaScript
import assert from 'node:assert/strict';
|
|
import process from 'node:process';
|
|
const { chromium } = await import(
|
|
process.env.PLAYWRIGHT_MODULE ?? 'playwright'
|
|
);
|
|
const browser = await chromium.launch({ channel: 'chrome', headless: true });
|
|
const base = 'http://127.0.0.1:4195';
|
|
const context = await browser.newContext({
|
|
viewport: { width: 1440, height: 1000 },
|
|
});
|
|
const page = await context.newPage();
|
|
page.setDefaultTimeout(10000);
|
|
const errors = [];
|
|
page.on('pageerror', (error) => errors.push(error.message));
|
|
const requests = [];
|
|
page.on('request', (request) => {
|
|
if (['POST', 'PATCH', 'DELETE'].includes(request.method())) {
|
|
requests.push(request);
|
|
}
|
|
});
|
|
const button = (name) => page.getByRole('button', { name, exact: true });
|
|
const dialog = () => page.getByRole('dialog');
|
|
const result = (value) =>
|
|
context.addCookies([
|
|
{ name: 'notification_test_result', value, url: base },
|
|
]);
|
|
const visit = async (query = '?reset') => {
|
|
await result('success');
|
|
await page.goto(base + '/projects/1/settings/notifications' + query);
|
|
await page
|
|
.getByRole('heading', { name: 'Notifications', exact: true })
|
|
.waitFor();
|
|
};
|
|
const closed = () => dialog().waitFor({ state: 'hidden' });
|
|
const state = (value) =>
|
|
dialog().locator(`[data-form-state="${value}"]`).waitFor();
|
|
const noOverflow = async () =>
|
|
assert.equal(
|
|
await page.evaluate(
|
|
() => document.documentElement.scrollWidth <= window.innerWidth,
|
|
),
|
|
true,
|
|
);
|
|
const submit = async (label, method, path, expected) => {
|
|
const sent = page.waitForRequest((request) => request.method() === method);
|
|
await dialog().getByRole('button', { name: label, exact: true }).click();
|
|
const request = await sent;
|
|
assert.equal(new URL(request.url()).pathname, path);
|
|
assert.deepEqual(request.postDataJSON(), expected);
|
|
};
|
|
try {
|
|
for (const width of [1440, 768, 390, 320]) {
|
|
await page.setViewportSize({ width, height: 1000 });
|
|
for (const theme of ['light', 'dark']) {
|
|
await page.emulateMedia({ colorScheme: theme });
|
|
await visit();
|
|
await noOverflow();
|
|
const trigger = button('Edit Release alerts');
|
|
await trigger.focus();
|
|
await page.keyboard.press('Enter');
|
|
await dialog().waitFor();
|
|
assert.equal(
|
|
await page.getByLabel('Name', { exact: true }).inputValue(),
|
|
'Release alerts',
|
|
);
|
|
const secret = page.getByLabel('Replace delivery URL (optional)');
|
|
assert.equal(await secret.inputValue(), '');
|
|
assert.equal(await secret.getAttribute('type'), 'password');
|
|
assert.equal(
|
|
await page
|
|
.getByLabel('Values (comma or newline separated)')
|
|
.inputValue(),
|
|
'CORE-1, CORE-2',
|
|
);
|
|
assert.equal(
|
|
await page
|
|
.getByLabel('User mentions (@username)', { exact: true })
|
|
.isChecked(),
|
|
true,
|
|
);
|
|
await page
|
|
.getByText('Available template variables', { exact: true })
|
|
.click();
|
|
await dialog().getByText('$url', { exact: true }).waitFor();
|
|
await noOverflow();
|
|
assert.equal(
|
|
await dialog().evaluate(
|
|
(el) => el.scrollWidth <= el.clientWidth + 1,
|
|
),
|
|
true,
|
|
);
|
|
if (
|
|
process.env.NOTIFICATION_SCREENSHOTS &&
|
|
[1440, 390].includes(width)
|
|
) {
|
|
await page.screenshot({
|
|
path: `${process.env.NOTIFICATION_SCREENSHOTS}/kan45-${width}-${theme}.png`,
|
|
});
|
|
}
|
|
await page.keyboard.press('Escape');
|
|
await closed();
|
|
assert.equal(
|
|
await trigger.evaluate((el) => el === document.activeElement),
|
|
true,
|
|
);
|
|
}
|
|
}
|
|
await page.setViewportSize({ width: 1280, height: 1000 });
|
|
await visit();
|
|
await button('Add notification').click();
|
|
assert.equal(
|
|
await page.getByLabel('Channel', { exact: true }).inputValue(),
|
|
'webhook',
|
|
);
|
|
assert.equal(
|
|
await page
|
|
.getByLabel('Discord message template', { exact: true })
|
|
.count(),
|
|
0,
|
|
);
|
|
await page.getByLabel('Name', { exact: true }).fill('New webhook');
|
|
await page
|
|
.getByLabel('Delivery URL', { exact: true })
|
|
.fill('https://hooks.example.test/new-secret');
|
|
await page
|
|
.getByLabel('Trigger', { exact: true })
|
|
.selectOption('ticket_assignee_changed');
|
|
await page.getByLabel('Enabled', { exact: true }).uncheck();
|
|
await button('Add filter').click();
|
|
await page
|
|
.getByLabel('Attribute', { exact: true })
|
|
.selectOption('actor.name');
|
|
await page.getByLabel('Operator', { exact: true }).selectOption('exists');
|
|
assert.equal(await page.getByLabel('Value', { exact: true }).count(), 0);
|
|
const payload = {
|
|
name: 'New webhook',
|
|
event_type: 'ticket_assignee_changed',
|
|
channel: 'webhook',
|
|
enabled: false,
|
|
delivery_url: 'https://hooks.example.test/new-secret',
|
|
channel_configuration: {},
|
|
message_template: null,
|
|
filters: [{ attribute: 'actor.name', operator: 'exists', value: null }],
|
|
};
|
|
await submit('Save', 'POST', '/projects/1/settings/notifications', payload);
|
|
await closed();
|
|
await button('Edit New webhook').waitFor();
|
|
assert.equal(
|
|
await page
|
|
.locator('body')
|
|
.textContent()
|
|
.then((text) => text.includes('new-secret')),
|
|
false,
|
|
);
|
|
await button('Edit New webhook').click();
|
|
assert.equal(
|
|
await page.getByLabel('Replace delivery URL (optional)').inputValue(),
|
|
'',
|
|
);
|
|
await button('Remove filter 1').click();
|
|
await page.getByLabel('Channel', { exact: true }).selectOption('discord');
|
|
await page
|
|
.getByRole('textbox', { name: 'Discord message template', exact: true })
|
|
.fill('$ticket_key: $url');
|
|
await page.getByLabel('Role mentions (@role)', { exact: true }).check();
|
|
await button('Add filter').click();
|
|
await page
|
|
.getByLabel('Attribute', { exact: true })
|
|
.selectOption('ticket.key');
|
|
await page.getByLabel('Operator', { exact: true }).selectOption('in');
|
|
await page
|
|
.getByLabel('Values (comma or newline separated)')
|
|
.fill(' CORE-1,\n CORE-3, ');
|
|
const edited = {
|
|
...payload,
|
|
channel: 'discord',
|
|
delivery_url: null,
|
|
channel_configuration: { allowed_mentions: ['roles'] },
|
|
message_template: '$ticket_key: $url',
|
|
filters: [
|
|
{
|
|
attribute: 'ticket.key',
|
|
operator: 'in',
|
|
value: ['CORE-1', 'CORE-3'],
|
|
},
|
|
],
|
|
};
|
|
await result('validation');
|
|
await submit(
|
|
'Save',
|
|
'PATCH',
|
|
'/projects/1/settings/notifications/100',
|
|
edited,
|
|
);
|
|
await state('validation');
|
|
await page.getByText('Enter a valid URL.', { exact: true }).waitFor();
|
|
await page
|
|
.getByText('Choose at least one ticket.', { exact: true })
|
|
.waitFor();
|
|
await page
|
|
.getByText('This mention type is not supported.', { exact: true })
|
|
.waitFor();
|
|
assert.equal(
|
|
await page.getByLabel('Name', { exact: true }).inputValue(),
|
|
'New webhook',
|
|
);
|
|
await result('server');
|
|
await submit(
|
|
'Save',
|
|
'PATCH',
|
|
'/projects/1/settings/notifications/100',
|
|
edited,
|
|
);
|
|
await state('server');
|
|
await result('forbidden');
|
|
await submit(
|
|
'Try again',
|
|
'PATCH',
|
|
'/projects/1/settings/notifications/100',
|
|
edited,
|
|
);
|
|
await state('server');
|
|
await result('success');
|
|
await submit(
|
|
'Try again',
|
|
'PATCH',
|
|
'/projects/1/settings/notifications/100',
|
|
edited,
|
|
);
|
|
await closed();
|
|
await button('Edit New webhook').click();
|
|
await page.getByLabel('Role mentions (@role)', { exact: true }).uncheck();
|
|
await button('Remove filter 1').click();
|
|
await page
|
|
.getByLabel('Replace delivery URL (optional)')
|
|
.fill('https://hooks.example.test/replacement');
|
|
await page.route('**/notifications/100', (route) => route.abort('failed'));
|
|
await button('Save').click();
|
|
await state('network');
|
|
await page.unroute('**/notifications/100');
|
|
await submit(
|
|
'Try again',
|
|
'PATCH',
|
|
'/projects/1/settings/notifications/100',
|
|
{
|
|
...edited,
|
|
delivery_url: 'https://hooks.example.test/replacement',
|
|
channel_configuration: { allowed_mentions: [] },
|
|
filters: [],
|
|
},
|
|
);
|
|
await closed();
|
|
await button('Edit New webhook').click();
|
|
await page.getByLabel('Channel', { exact: true }).selectOption('webhook');
|
|
await submit('Save', 'PATCH', '/projects/1/settings/notifications/100', {
|
|
...edited,
|
|
channel: 'webhook',
|
|
channel_configuration: {},
|
|
message_template: null,
|
|
filters: [],
|
|
});
|
|
await closed();
|
|
// Dismissing a dirty dialog asks before clearing a secret; reopening starts clean.
|
|
await button('Edit New webhook').click();
|
|
await page
|
|
.getByLabel('Replace delivery URL (optional)')
|
|
.fill('discard-this-secret');
|
|
page.once('dialog', (prompt) => prompt.dismiss());
|
|
await button('Cancel').click();
|
|
assert.equal(await dialog().isVisible(), true);
|
|
page.once('dialog', (prompt) => prompt.accept());
|
|
await button('Cancel').click();
|
|
await closed();
|
|
await button('Edit Release alerts').click();
|
|
assert.equal(
|
|
await page.getByLabel('Replace delivery URL (optional)').inputValue(),
|
|
'',
|
|
);
|
|
assert.equal(
|
|
await page.getByLabel('Name', { exact: true }).inputValue(),
|
|
'Release alerts',
|
|
);
|
|
await button('Cancel').click();
|
|
await closed();
|
|
const before = requests.length;
|
|
await button('Delete New webhook').click();
|
|
await dialog()
|
|
.getByText(/This cannot be undone/)
|
|
.waitFor();
|
|
await button('Cancel').click();
|
|
await closed();
|
|
assert.equal(requests.length, before);
|
|
await button('Delete New webhook').click();
|
|
await submit(
|
|
'Delete notification',
|
|
'DELETE',
|
|
'/projects/1/settings/notifications/100',
|
|
{},
|
|
);
|
|
await closed();
|
|
assert.equal(await button('Edit New webhook').count(), 0);
|
|
await visit('?reset&empty');
|
|
await page.getByRole('heading', { name: 'No notifications yet' }).waitFor();
|
|
assert.deepEqual(errors, []);
|
|
console.log(
|
|
'Notification browser checks passed: CRUD, filters, channels, secrets, validation, retries, keyboard, responsive layouts and themes.',
|
|
);
|
|
} finally {
|
|
await browser.close();
|
|
}
|