108 lines
4.7 KiB
JavaScript
108 lines
4.7 KiB
JavaScript
// @ts-check
|
||
import { test, expect } from '@playwright/test';
|
||
import { loadTestUser } from '../utils/testUser.js';
|
||
|
||
test.describe('@p0 Priorities modal — save & persist (current UI)', () => {
|
||
test.setTimeout(15000);
|
||
|
||
test('open → choose answers → Save Answers → reload → same answers present', async ({ page }) => {
|
||
const user = loadTestUser();
|
||
|
||
// --- helpers -------------------------------------------------------------
|
||
async function openExplorer() {
|
||
await page.context().clearCookies();
|
||
await page.goto('/signin', { waitUntil: 'networkidle' });
|
||
await page.getByPlaceholder('Username', { exact: true }).fill(user.username);
|
||
await page.getByPlaceholder('Password', { exact: true }).fill(user.password);
|
||
await page.getByRole('button', { name: /^Sign In$/ }).click();
|
||
await page.waitForURL('**/signin-landing**', { timeout: 15000 });
|
||
await page.goto('/career-explorer', { waitUntil: 'networkidle' });
|
||
await expect(page.getByRole('heading', { name: /Explore Careers - use these tools/i })).toBeVisible();
|
||
}
|
||
|
||
async function openPrioritiesModal() {
|
||
const overlay = page.locator('div.fixed.inset-0');
|
||
// If it’s already up (gate), just use it
|
||
if (await overlay.isVisible({ timeout: 500 }).catch(() => false)) return overlay;
|
||
// Otherwise click "Edit priorities"
|
||
const edit = page.getByRole('button', { name: /Edit priorities/i }).or(page.getByText(/Edit priorities/i));
|
||
await expect(edit).toBeVisible({ timeout: 5000 });
|
||
await edit.click();
|
||
await expect(overlay).toBeVisible({ timeout: 3000 });
|
||
return overlay;
|
||
}
|
||
|
||
// choose valid option in each select (prefer "Very important", then "Yes, very important", etc.)
|
||
async function chooseAnswers(overlay) {
|
||
const dlg = overlay.locator('div[role="dialog"], div.bg-white').first();
|
||
const selects = dlg.locator('select');
|
||
const n = await selects.count();
|
||
const chosen = [];
|
||
for (let i = 0; i < n; i++) {
|
||
const sel = selects.nth(i);
|
||
await expect(sel).toBeVisible();
|
||
const opts = sel.locator('option');
|
||
const m = await opts.count();
|
||
const cand = [];
|
||
for (let j = 0; j < m; j++) {
|
||
const val = (await opts.nth(j).getAttribute('value')) || '';
|
||
if (!val) continue; // skip "Select an answer"
|
||
const txt = ((await opts.nth(j).textContent()) || '').trim();
|
||
cand.push({ val, txt });
|
||
}
|
||
const pickOrder = [/^Very important$/i, /^Yes, very important$/i, /^Somewhat important$/i, /^Not as important$/i];
|
||
let pick = cand.find(c => pickOrder[0].test(c.txt))
|
||
|| cand.find(c => pickOrder[1].test(c.txt))
|
||
|| cand.find(c => pickOrder[2].test(c.txt))
|
||
|| cand.find(c => pickOrder[3].test(c.txt))
|
||
|| cand[0];
|
||
await sel.selectOption(pick.val); // select by VALUE (robust)
|
||
chosen.push(pick.txt); // remember chosen text
|
||
}
|
||
return chosen;
|
||
}
|
||
|
||
async function readSelected(overlay) {
|
||
const dlg = overlay.locator('div[role="dialog"], div.bg-white').first();
|
||
const selects = dlg.locator('select');
|
||
const n = await selects.count();
|
||
const out = [];
|
||
for (let i = 0; i < n; i++) {
|
||
const txt = await selects.nth(i).locator('option:checked').first().textContent();
|
||
out.push((txt || '').trim());
|
||
}
|
||
return out;
|
||
}
|
||
|
||
// --- flow ----------------------------------------------------------------
|
||
await openExplorer();
|
||
|
||
// 1) Open modal (gate or via "Edit priorities")
|
||
let overlay = await openPrioritiesModal();
|
||
|
||
// 2) Make selections and save
|
||
const chosen = await chooseAnswers(overlay);
|
||
await expect(overlay.getByRole('button', { name: /^Save Answers$/i })).toBeEnabled({ timeout: 5000 });
|
||
await overlay.getByRole('button', { name: /^Save Answers$/i }).click();
|
||
await overlay.waitFor({ state: 'hidden', timeout: 5000 }).catch(() => {});
|
||
|
||
// 3) Reload page and re-open modal
|
||
await page.reload({ waitUntil: 'networkidle' });
|
||
overlay = await openPrioritiesModal();
|
||
|
||
// 4) Verify persistence (same number and same labels)
|
||
const persisted = await readSelected(overlay);
|
||
expect(persisted.length).toBe(chosen.length);
|
||
for (let i = 0; i < persisted.length; i++) {
|
||
expect(persisted[i]).toBe(chosen[i]);
|
||
}
|
||
|
||
// Optional: close (re-using Save Answers keeps state)
|
||
const saveAgain = overlay.getByRole('button', { name: /^Save Answers$/i });
|
||
if (await saveAgain.isVisible().catch(() => false)) {
|
||
await saveAgain.click();
|
||
await overlay.waitFor({ state: 'hidden', timeout: 3000 }).catch(() => {});
|
||
}
|
||
});
|
||
});
|