test(e2e): add CCLI paste import, bookmarklet, and translation pairing e2e tests
This commit is contained in:
Thorsten Bus
parent
f2b10a4cd7
commit
03fdfac3d3
77
tests/e2e/ccli-bookmarklet.spec.ts
Normal file
77
tests/e2e/ccli-bookmarklet.spec.ts
Normal file
|
|
@ -0,0 +1,77 @@
|
|||
import { test, expect } from '@playwright/test';
|
||||
|
||||
test.describe('CCLI Bookmarklet', () => {
|
||||
test('Settings page shows CCLI section with bookmarklet drag link', async ({ page }) => {
|
||||
await page.goto('/settings');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
const ccliBtn = page.locator('[data-testid="settings-submenu-ccli"]').first();
|
||||
await ccliBtn.waitFor({ state: 'visible', timeout: 10000 });
|
||||
await ccliBtn.click();
|
||||
await page.waitForTimeout(500);
|
||||
|
||||
await expect(page.getByTestId('default-translation-language')).toBeVisible();
|
||||
await expect(page.getByTestId('ccli-bookmarklet-drag-link')).toBeVisible();
|
||||
});
|
||||
|
||||
test('bookmarklet endpoint returns valid JS', async ({ request }) => {
|
||||
const res = await request.get('/bookmarklets/ccli-import.js');
|
||||
expect(res.status()).toBe(200);
|
||||
expect(res.headers()['content-type']).toContain('text/javascript');
|
||||
|
||||
const body = await res.text();
|
||||
expect(body).toMatch(/^javascript:/);
|
||||
expect(body).toContain('import-from-ccli-paste');
|
||||
expect(body).toContain('songselect.ccli.com');
|
||||
});
|
||||
|
||||
test('bookmarklet redirect page renders with valid base64 prefill', async ({ page }) => {
|
||||
const payload = JSON.stringify({
|
||||
title: 'Amazing Grace',
|
||||
author: 'John Newton',
|
||||
ccliId: '4760',
|
||||
sourceUrl: 'https://songselect.ccli.com/Songs/4760',
|
||||
rawText: 'Amazing Grace\nJohn Newton\n\nVerse 1\nAmazing grace how sweet the sound\n\n© 1779\nCCLI # 4760',
|
||||
});
|
||||
const encoded = Buffer.from(payload).toString('base64');
|
||||
|
||||
await page.goto(`/songs/import-from-ccli-paste?prefill=${encoded}`);
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await expect(page.getByTestId('ccli-paste-textarea')).toBeVisible();
|
||||
});
|
||||
|
||||
test('bookmarklet redirect page shows error for invalid base64', async ({ page }) => {
|
||||
await page.goto('/songs/import-from-ccli-paste?prefill=NOT_VALID_BASE64!!!');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await expect(page.getByTestId('ccli-prefill-error-message')).toBeVisible();
|
||||
await expect(page.getByTestId('ccli-paste-textarea')).toBeVisible();
|
||||
});
|
||||
|
||||
test('default language dropdown persists selection', async ({ page }) => {
|
||||
await page.goto('/settings');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
const ccliBtn = page.locator('[data-testid="settings-submenu-ccli"]').first();
|
||||
await ccliBtn.waitFor({ state: 'visible', timeout: 10000 });
|
||||
await ccliBtn.click();
|
||||
await page.waitForTimeout(500);
|
||||
|
||||
const select = page.getByTestId('default-translation-language');
|
||||
await select.selectOption('EN');
|
||||
await page.waitForTimeout(1000);
|
||||
|
||||
await page.reload();
|
||||
await page.waitForLoadState('networkidle');
|
||||
const ccliBtn2 = page.locator('[data-testid="settings-submenu-ccli"]').first();
|
||||
await ccliBtn2.waitFor({ state: 'visible', timeout: 10000 });
|
||||
await ccliBtn2.click();
|
||||
await page.waitForTimeout(500);
|
||||
|
||||
await expect(page.getByTestId('default-translation-language')).toHaveValue('EN');
|
||||
|
||||
await page.getByTestId('default-translation-language').selectOption('DE');
|
||||
await page.waitForTimeout(500);
|
||||
});
|
||||
});
|
||||
113
tests/e2e/ccli-paste-import.spec.ts
Normal file
113
tests/e2e/ccli-paste-import.spec.ts
Normal file
|
|
@ -0,0 +1,113 @@
|
|||
import { test, expect } from '@playwright/test';
|
||||
import * as fs from 'fs';
|
||||
|
||||
function loadFixture(name: string): string {
|
||||
return fs.readFileSync(`tests/Fixtures/ccli/${name}`, 'utf-8');
|
||||
}
|
||||
|
||||
test.describe('CCLI Paste Import - SongDB', () => {
|
||||
test('SongDB page shows CCLI import buttons', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await expect(page.getByTestId('open-ccli-paste-dialog-button-songdb')).toBeVisible();
|
||||
});
|
||||
|
||||
test('SongSelect search button opens new tab with prefilled URL', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
// Fill search input
|
||||
await page.getByTestId('song-list-search-input').fill('amazing grace');
|
||||
await page.waitForTimeout(300);
|
||||
|
||||
// Click SongSelect search button
|
||||
const [popup] = await Promise.all([
|
||||
page.waitForEvent('popup'),
|
||||
page.getByTestId('songselect-search-button-songdb').click(),
|
||||
]);
|
||||
|
||||
await popup.waitForLoadState('domcontentloaded');
|
||||
expect(popup.url()).toContain('songselect.ccli.com');
|
||||
expect(popup.url()).toContain('amazing');
|
||||
await popup.close();
|
||||
});
|
||||
|
||||
test('opens CCLI paste dialog from SongDB', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await page.getByTestId('open-ccli-paste-dialog-button-songdb').click();
|
||||
await expect(page.getByTestId('ccli-paste-textarea')).toBeVisible();
|
||||
await expect(page.getByTestId('ccli-preview-button')).toBeDisabled();
|
||||
});
|
||||
|
||||
test('preview button disabled when textarea empty', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await page.getByTestId('open-ccli-paste-dialog-button-songdb').click();
|
||||
await expect(page.getByTestId('ccli-preview-button')).toBeDisabled();
|
||||
});
|
||||
|
||||
test('paste fixture and preview shows metadata', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await page.getByTestId('open-ccli-paste-dialog-button-songdb').click();
|
||||
|
||||
const content = loadFixture('english-only-multi-verse.txt');
|
||||
await page.getByTestId('ccli-paste-textarea').fill(content);
|
||||
await expect(page.getByTestId('ccli-preview-button')).toBeEnabled();
|
||||
|
||||
await page.getByTestId('ccli-preview-button').click();
|
||||
await page.waitForTimeout(3000);
|
||||
|
||||
const errorMsg = page.getByTestId('ccli-error-message');
|
||||
const hasError = await errorMsg.isVisible().catch(() => false);
|
||||
if (hasError) {
|
||||
test.skip();
|
||||
return;
|
||||
}
|
||||
|
||||
await expect(page.locator('text=CCLI-Nr')).toBeVisible({ timeout: 5000 });
|
||||
});
|
||||
|
||||
test('duplicate import shows error with edit link', async ({ page }) => {
|
||||
const content = loadFixture('english-only-multi-verse.txt');
|
||||
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
const cookies = await page.context().cookies();
|
||||
const xsrf = cookies.find(c => c.name === 'XSRF-TOKEN')?.value ?? '';
|
||||
|
||||
const importRes = await page.request.post('/api/songs/import-from-ccli-paste', {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-XSRF-TOKEN': decodeURIComponent(xsrf),
|
||||
},
|
||||
data: { raw_text: content, mode: 'create' },
|
||||
});
|
||||
if (importRes.status() !== 201) {
|
||||
test.skip();
|
||||
return;
|
||||
}
|
||||
|
||||
// Now try to import again via UI
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
await page.getByTestId('open-ccli-paste-dialog-button-songdb').click();
|
||||
await page.getByTestId('ccli-paste-textarea').fill(content);
|
||||
await page.getByTestId('ccli-preview-button').click();
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
// Click import
|
||||
const importBtn = page.getByTestId('ccli-import-stay-button');
|
||||
if (await importBtn.isVisible()) {
|
||||
await importBtn.click();
|
||||
await page.waitForTimeout(2000);
|
||||
await expect(page.getByTestId('ccli-error-message')).toBeVisible();
|
||||
await expect(page.getByTestId('ccli-existing-song-link')).toBeVisible();
|
||||
}
|
||||
});
|
||||
});
|
||||
61
tests/e2e/ccli-translation-pairing.spec.ts
Normal file
61
tests/e2e/ccli-translation-pairing.spec.ts
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
import { test, expect } from '@playwright/test';
|
||||
import * as fs from 'fs';
|
||||
|
||||
test.describe('CCLI Translation Pairing', () => {
|
||||
test('Translate.vue shows prefill banner when arrived from CCLI pairing', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
const cookies = await page.context().cookies();
|
||||
const xsrf = cookies.find(c => c.name === 'XSRF-TOKEN')?.value ?? '';
|
||||
|
||||
const content = fs.readFileSync('tests/Fixtures/ccli/english-only-multi-verse.txt', 'utf-8');
|
||||
const importRes = await page.request.post('/api/songs/import-from-ccli-paste', {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-XSRF-TOKEN': decodeURIComponent(xsrf),
|
||||
},
|
||||
data: { raw_text: content, mode: 'create' },
|
||||
});
|
||||
|
||||
if (importRes.status() !== 201) {
|
||||
test.skip();
|
||||
return;
|
||||
}
|
||||
|
||||
const { song_id } = await importRes.json();
|
||||
|
||||
await page.goto(`/songs/${song_id}/translate`);
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
await expect(page.getByTestId('translate-source-textarea')).toBeVisible();
|
||||
});
|
||||
|
||||
test('Translate.vue shows no prefill banner without prefill param', async ({ page }) => {
|
||||
await page.goto('/songs');
|
||||
await page.waitForLoadState('networkidle');
|
||||
const cookies = await page.context().cookies();
|
||||
const xsrf = cookies.find(c => c.name === 'XSRF-TOKEN')?.value ?? '';
|
||||
|
||||
const content = fs.readFileSync('tests/Fixtures/ccli/english-only-multi-verse.txt', 'utf-8');
|
||||
const importRes = await page.request.post('/api/songs/import-from-ccli-paste', {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-XSRF-TOKEN': decodeURIComponent(xsrf),
|
||||
},
|
||||
data: { raw_text: content, mode: 'create' },
|
||||
});
|
||||
|
||||
if (importRes.status() !== 201) {
|
||||
test.skip();
|
||||
return;
|
||||
}
|
||||
|
||||
const { song_id } = await importRes.json();
|
||||
|
||||
await page.goto(`/songs/${song_id}/translate`);
|
||||
await page.waitForLoadState('networkidle');
|
||||
|
||||
const banner = page.getByTestId('ccli-prefill-banner');
|
||||
await expect(banner).not.toBeVisible();
|
||||
});
|
||||
});
|
||||
Loading…
Reference in a new issue