merge: 최신 main을 개인 기록 시각 글자 크기 보정에 통합
This commit is contained in:
@@ -43,6 +43,7 @@ const inputOptions = {
|
||||
cities: [
|
||||
{ value: 1, label: '업 (아국)' },
|
||||
{ value: 2, label: '허창 (적국)', description: '적국 · 예주 · 대도시' },
|
||||
{ value: 3, label: '단양 (오)' },
|
||||
],
|
||||
nations: [
|
||||
{ value: 1, label: '아국', color: '#008000' },
|
||||
@@ -52,6 +53,18 @@ const inputOptions = {
|
||||
{ value: 1, label: '장수 (아국 · 업)' },
|
||||
{ value: 2, label: '관우 (아국 · 업)' },
|
||||
],
|
||||
generalTargets: {
|
||||
che_포상: [
|
||||
{ value: 1, label: '장수 (아국 · 업)' },
|
||||
{ value: 2, label: '관우 (아국 · 업)' },
|
||||
{ value: 3, label: '여포NPC (아국 · 업)' },
|
||||
],
|
||||
che_몰수: [
|
||||
{ value: 1, label: '장수 (아국 · 업)' },
|
||||
{ value: 2, label: '관우 (아국 · 업)' },
|
||||
{ value: 3, label: '여포NPC (아국 · 업)' },
|
||||
],
|
||||
},
|
||||
crewTypes: [{ value: 1100, label: '보병' }],
|
||||
armTypes: [{ value: 1, label: '보병' }],
|
||||
nationTypes: [{ value: 'che_도적', label: '도적', description: '금 수입 증가, 쌀 수입 감소' }],
|
||||
@@ -182,6 +195,27 @@ const commandTable = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
category: '군사',
|
||||
values: [
|
||||
{
|
||||
key: 'che_출병',
|
||||
name: '출병',
|
||||
reqArg: true,
|
||||
possible: true,
|
||||
status: 'needsInput',
|
||||
inputFields: [
|
||||
{
|
||||
key: 'destCityId',
|
||||
label: '대상 도시',
|
||||
kind: 'select',
|
||||
required: true,
|
||||
optionSource: 'cities',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
nation: [
|
||||
{
|
||||
@@ -312,6 +346,7 @@ const generalContext = {
|
||||
experience: 0,
|
||||
dedication: 0,
|
||||
items: { horse: 'None', weapon: 'None', book: 'None', item: 'None' },
|
||||
turnTime: '2026-08-17T12:00:00.000Z',
|
||||
},
|
||||
city: {
|
||||
id: 1,
|
||||
@@ -366,8 +401,8 @@ const chiefCenter = {
|
||||
maxTurns: 12,
|
||||
chiefs: [12, 10, 8, 6, 11, 9, 7, 5].map((officerLevel) => ({
|
||||
officerLevel,
|
||||
name: officerLevel === 5 ? '장수' : null,
|
||||
npcState: officerLevel === 5 ? 0 : null,
|
||||
name: officerLevel === 5 ? '장수' : `수뇌${officerLevel}`,
|
||||
npcState: officerLevel === 8 ? 2 : 0,
|
||||
turnTime: null,
|
||||
revision: 0,
|
||||
turns: turns(12),
|
||||
@@ -483,7 +518,7 @@ const install = async (page: Page, rejectGeneral = false, commandTableResponse:
|
||||
if (name === 'turns.getCommandTable') return response(commandTableResponse);
|
||||
if (name === 'nation.getChiefCenter') return response(chiefCenter);
|
||||
if (name === 'turns.reserved.getGeneral')
|
||||
return response({ turns: generalTurns, revision: generalRevision });
|
||||
return response({ turns: generalTurns, revision: generalRevision, autorunLimit: 2403 });
|
||||
if (name === 'turns.reserved.getNation') return response({ turns: nationTurns, revision: nationRevision });
|
||||
if (name === 'general.getRecentRecords') return response({ global: [], general: [], history: [] });
|
||||
if (name === 'general.getFrontStatus')
|
||||
@@ -520,7 +555,7 @@ const install = async (page: Page, rejectGeneral = false, commandTableResponse:
|
||||
generalTurns[index] = { index, action: entry.action, args: entry.args ?? {} };
|
||||
}
|
||||
generalRevision += 1;
|
||||
return response({ ok: true, revision: generalRevision, turns: generalTurns });
|
||||
return response({ ok: true, revision: generalRevision, turns: generalTurns, autorunLimit: 2403 });
|
||||
}
|
||||
if (name === 'turns.reserved.setNationBulk') {
|
||||
requests.push(body);
|
||||
@@ -561,7 +596,7 @@ test('renders and accepts every Ref strategy command at mobile width', async ({
|
||||
await button.click();
|
||||
const form = picker.getByTestId('command-argument-form');
|
||||
await expect(form.getByTestId('command-argument-guidance')).toContainText(strategy.guidance);
|
||||
await expect(form.locator('select option')).toHaveCount(2);
|
||||
await expect(form.locator('select option')).toHaveCount(3);
|
||||
await picker.getByRole('button', { name: '명령 다시 선택', exact: true }).click();
|
||||
}
|
||||
await picker.screenshot({ path: test.info().outputPath('all-strategy-commands-mobile.png') });
|
||||
@@ -709,7 +744,7 @@ test('reserves force move, retirement, and resignation from the user command pic
|
||||
await expect(forceMoveForm.getByTestId('command-argument-guidance')).toContainText('선택한 도시로 강행합니다.');
|
||||
await forceMoveForm.locator('select').selectOption('2');
|
||||
await picker.getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(editor.locator('.action-column > div').nth(2)).toHaveText('강행');
|
||||
await expect(editor.locator('.action-column > div').nth(2)).toHaveText('【허창】으로 강행');
|
||||
|
||||
const serialized = JSON.stringify(requests);
|
||||
expect(serialized).toContain('"action":"che_은퇴","args":{}');
|
||||
@@ -778,6 +813,92 @@ test('shows every Ref chief command in the exact category and command order', as
|
||||
await mobilePicker.screenshot({ path: test.info().outputPath('ref-chief-command-list-mobile-500.png') });
|
||||
});
|
||||
|
||||
test('shows all 12 advanced chief turns before the actions and uses the full mobile chief matrix', async ({ page }) => {
|
||||
await install(page);
|
||||
await page.setViewportSize({ width: 500, height: 900 });
|
||||
await page.goto('/che/chief-center');
|
||||
|
||||
const editor = page.locator('[data-command-scope="nation"]:visible');
|
||||
await editor.getByRole('button', { name: '고급 모드', exact: true }).click();
|
||||
await expect(editor.locator('.index-column > button')).toHaveCount(12);
|
||||
await expect(editor.locator('.index-column > button').last()).toHaveText('12');
|
||||
await expect(editor.locator('.advanced-actions')).toContainText('선택한 턴을');
|
||||
await expect(editor.locator('.advanced-actions')).toContainText('명령 선택');
|
||||
|
||||
const frame = page.locator('.chief-overview-frame');
|
||||
await expect(frame.locator('.chief-overview-row')).toHaveCount(2);
|
||||
await expect(frame.locator('.overview-turn-index')).toHaveCount(4);
|
||||
for (const gutter of await frame.locator('.overview-turn-index').all()) {
|
||||
await expect(gutter.locator('span').filter({ hasText: /\d+/u })).toHaveText(
|
||||
Array.from({ length: 12 }, (_, index) => String(index + 1))
|
||||
);
|
||||
}
|
||||
await expect(frame.locator('.compact-name')).toHaveCount(8);
|
||||
|
||||
const geometry = await page.locator('.chief-page').evaluate((element) => {
|
||||
const editorElement = element.querySelector<HTMLElement>('[data-command-scope="nation"]')!;
|
||||
const queue = editorElement.querySelector<HTMLElement>('.queue-grid')!;
|
||||
const lastTurn = editorElement.querySelectorAll<HTMLElement>('.action-column > div')[11]!;
|
||||
const actions = editorElement.querySelector<HTMLElement>('.advanced-actions')!;
|
||||
const overviewFrame = element.querySelector<HTMLElement>('.chief-overview-frame')!;
|
||||
const firstOverviewRow = element.querySelector<HTMLElement>('.chief-overview-row')!;
|
||||
const overviewRows = [...element.querySelectorAll<HTMLElement>('.chief-overview-row')];
|
||||
const gutters = [...firstOverviewRow.querySelectorAll<HTMLElement>('.overview-turn-index')];
|
||||
const cards = [...firstOverviewRow.querySelectorAll<HTMLElement>('.chief-card')];
|
||||
const names = [...overviewFrame.querySelectorAll<HTMLElement>('.compact-name')];
|
||||
const frameRect = overviewFrame.getBoundingClientRect();
|
||||
const editorRect = editorElement.getBoundingClientRect();
|
||||
const actionsRect = actions.getBoundingClientRect();
|
||||
return {
|
||||
editorBottom: editorRect.bottom,
|
||||
editorHeight: editorRect.height,
|
||||
queueBottom: queue.getBoundingClientRect().bottom,
|
||||
lastTurnBottom: lastTurn.getBoundingClientRect().bottom,
|
||||
actionsTop: actionsRect.top,
|
||||
actionsBottom: actionsRect.bottom,
|
||||
frameTop: frameRect.top,
|
||||
frameWidth: frameRect.width,
|
||||
rowWidth: firstOverviewRow.getBoundingClientRect().width,
|
||||
rowEdges: overviewRows.map((item) => ({
|
||||
top: item.getBoundingClientRect().top - frameRect.top,
|
||||
bottom: item.getBoundingClientRect().bottom - frameRect.top,
|
||||
})),
|
||||
gutterWidths: gutters.map((item) => item.getBoundingClientRect().width),
|
||||
gutterEdges: gutters.map((item) => ({
|
||||
left: item.getBoundingClientRect().left - frameRect.left,
|
||||
right: item.getBoundingClientRect().right - frameRect.left,
|
||||
})),
|
||||
cardWidths: cards.map((item) => item.getBoundingClientRect().width),
|
||||
namesInsideFrame: names.every((item) => {
|
||||
const rect = item.getBoundingClientRect();
|
||||
return rect.top >= frameRect.top && rect.bottom <= frameRect.bottom && rect.height > 0;
|
||||
}),
|
||||
documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
|
||||
};
|
||||
});
|
||||
|
||||
expect(geometry.lastTurnBottom).toBeLessThanOrEqual(geometry.actionsTop);
|
||||
expect(geometry.queueBottom).toBeLessThanOrEqual(geometry.actionsTop);
|
||||
expect(geometry.actionsBottom).toBeLessThanOrEqual(geometry.editorBottom);
|
||||
expect(geometry.frameTop).toBeGreaterThanOrEqual(geometry.editorBottom);
|
||||
expect(geometry.editorHeight).toBeGreaterThanOrEqual(404);
|
||||
expect(geometry.frameWidth).toBe(500);
|
||||
expect(geometry.rowWidth).toBe(500);
|
||||
expect(geometry.rowEdges).toEqual([
|
||||
{ top: 0, bottom: 155 },
|
||||
{ top: 155, bottom: 310 },
|
||||
]);
|
||||
expect(geometry.gutterWidths).toEqual([12, 12]);
|
||||
expect(geometry.gutterEdges).toEqual([
|
||||
{ left: 0, right: 12 },
|
||||
{ left: 488, right: 500 },
|
||||
]);
|
||||
expect(geometry.cardWidths).toEqual([119, 119, 119, 119]);
|
||||
expect(geometry.namesInsideFrame).toBe(true);
|
||||
expect(geometry.documentOverflow).toBeLessThanOrEqual(0);
|
||||
await page.screenshot({ path: test.info().outputPath('chief-advanced-mobile-500.png'), fullPage: true });
|
||||
});
|
||||
|
||||
test('enters general and nation command arguments and sends exact values', async ({ page }) => {
|
||||
const requests = await install(page);
|
||||
await page.setViewportSize({ width: 1200, height: 900 });
|
||||
@@ -856,7 +977,9 @@ test('enters general and nation command arguments and sends exact values', async
|
||||
return { width: rect.width, height: rect.height };
|
||||
});
|
||||
await page.getByTestId('command-picker').getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(page.locator('[data-command-scope="general"] .action-column > div').first()).toHaveText('화계');
|
||||
await expect(page.locator('[data-command-scope="general"] .action-column > div').first()).toHaveText(
|
||||
'【허창】에 화계실행'
|
||||
);
|
||||
|
||||
await page.goto('/che/chief-center');
|
||||
await page.getByRole('button', { name: '1턴 명령 입력', exact: true }).click();
|
||||
@@ -866,7 +989,13 @@ test('enters general and nation command arguments and sends exact values', async
|
||||
const chiefForm = chiefPicker.getByTestId('command-argument-form');
|
||||
await chiefForm.getByRole('button', { name: '쌀' }).click();
|
||||
await chiefForm.locator('input[type=number]').fill('300');
|
||||
await chiefForm.locator('select').selectOption('2');
|
||||
const chiefTarget = chiefForm.locator('select');
|
||||
await expect(chiefTarget.locator('option')).toHaveText([
|
||||
'장수 (아국 · 업)',
|
||||
'관우 (아국 · 업)',
|
||||
'여포NPC (아국 · 업)',
|
||||
]);
|
||||
await chiefTarget.selectOption('3');
|
||||
const geometry = await chiefForm.evaluate((element) => {
|
||||
const row = element.querySelector('.argument-row');
|
||||
const rect = element.getBoundingClientRect();
|
||||
@@ -879,12 +1008,14 @@ test('enters general and nation command arguments and sends exact values', async
|
||||
};
|
||||
});
|
||||
await chiefPicker.getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(page.locator('[data-command-scope="nation"] .action-column > div').first()).toHaveText('포상');
|
||||
await expect(page.locator('[data-command-scope="nation"] .action-column > div').first()).toHaveText(
|
||||
'【여포NPC】 쌀 300 포상'
|
||||
);
|
||||
|
||||
expect(JSON.stringify(requests)).toContain('"destCityId":2');
|
||||
expect(JSON.stringify(requests)).toContain('"isGold":false');
|
||||
expect(JSON.stringify(requests)).toContain('"amount":300');
|
||||
expect(JSON.stringify(requests)).toContain('"destGeneralId":2');
|
||||
expect(JSON.stringify(requests)).toContain('"destGeneralId":3');
|
||||
|
||||
expect(mapGeometry.width).toBeGreaterThan(650);
|
||||
expect(mapGeometry.height / mapGeometry.width).toBeCloseTo(5 / 7, 2);
|
||||
@@ -961,7 +1092,9 @@ test('uses a Ref-style full recruitment page without horizontal overflow on desk
|
||||
await infantry.getByRole('button', { name: '절반', exact: true }).click();
|
||||
await page.screenshot({ path: testInfo.outputPath('recruitment-desktop.png') });
|
||||
await picker.getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(page.locator('[data-command-scope="general"] .action-column > div').first()).toHaveText('징병');
|
||||
await expect(page.locator('[data-command-scope="general"] .action-column > div').first()).toHaveText(
|
||||
'【보병】 3500명 징병'
|
||||
);
|
||||
expect(JSON.stringify(requests)).toContain('"crewType":1100');
|
||||
expect(JSON.stringify(requests)).toContain('"amount":3500');
|
||||
|
||||
@@ -1167,6 +1300,53 @@ test('keeps the entered command visible and reports a server validation error',
|
||||
await expect(page.getByTestId('command-argument-form').locator('select')).toHaveValue('2');
|
||||
});
|
||||
|
||||
test('keeps Ref command briefs and autonomous-action state after a turn mutation', async ({ page }) => {
|
||||
await install(page);
|
||||
await page.setViewportSize({ width: 1200, height: 900 });
|
||||
await page.goto('/');
|
||||
|
||||
const editor = page.locator('[data-command-scope="general"]');
|
||||
const status = editor.locator('[data-command-autorun-status]');
|
||||
const firstRow = editor.locator('.action-column > div').first();
|
||||
await expect(status).toHaveText(/자율 행동: 200年 3月 · \d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}까지/u);
|
||||
await expect(firstRow).toContainText('휴식(자율 행동)');
|
||||
expect(await firstRow.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(170, 255, 255)');
|
||||
|
||||
await page.getByRole('button', { name: '1턴 명령 입력', exact: true }).click();
|
||||
const picker = page.getByTestId('command-picker');
|
||||
await picker.getByRole('button', { name: '군사', exact: true }).click();
|
||||
await picker.getByRole('button', { name: '출병', exact: true }).click();
|
||||
await picker.getByTestId('command-argument-form').locator('select').selectOption('3');
|
||||
await picker.getByRole('button', { name: '입력', exact: true }).click();
|
||||
|
||||
await expect(firstRow).toHaveText('【단양】으로 출병');
|
||||
await expect(firstRow).toHaveAttribute('title', /자율 행동/u);
|
||||
expect(await firstRow.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(170, 255, 255)');
|
||||
await expect(status).toHaveText(/자율 행동: 200年 3月 · .*까지/u);
|
||||
|
||||
const desktopGeometry = await editor.evaluate((element) => {
|
||||
const statusElement = element.querySelector<HTMLElement>('[data-command-autorun-status]');
|
||||
const row = element.querySelector<HTMLElement>('.action-column > div');
|
||||
if (!statusElement || !row) throw new Error('autonomous command geometry is missing');
|
||||
return {
|
||||
horizontalOverflow: element.scrollWidth - element.clientWidth,
|
||||
statusWidth: statusElement.getBoundingClientRect().width,
|
||||
editorWidth: element.getBoundingClientRect().width,
|
||||
rowHeight: row.getBoundingClientRect().height,
|
||||
};
|
||||
});
|
||||
expect(desktopGeometry.horizontalOverflow).toBeLessThanOrEqual(0);
|
||||
expect(desktopGeometry.statusWidth).toBeLessThanOrEqual(desktopGeometry.editorWidth);
|
||||
expect(desktopGeometry.rowHeight).toBeGreaterThanOrEqual(20);
|
||||
await page.screenshot({ path: test.info().outputPath('command-brief-autorun-desktop-1200.png'), fullPage: true });
|
||||
|
||||
await page.setViewportSize({ width: 500, height: 900 });
|
||||
await expect(firstRow).toHaveText('【단양】으로 출병');
|
||||
await expect(status).toBeVisible();
|
||||
expect(await editor.evaluate((element) => element.scrollWidth - element.clientWidth)).toBeLessThanOrEqual(0);
|
||||
await page.screenshot({ path: test.info().outputPath('command-brief-autorun-mobile-500.png'), fullPage: true });
|
||||
});
|
||||
|
||||
test('uses drag selection, clipboard paste, and a stored template in advanced mode', async ({ page }) => {
|
||||
const requests = await install(page);
|
||||
await page.goto('/');
|
||||
@@ -1194,7 +1374,7 @@ test('uses drag selection, clipboard paste, and a stored template in advanced mo
|
||||
await blockedFire.click();
|
||||
await picker.getByTestId('command-argument-form').locator('select').selectOption('2');
|
||||
await picker.getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(editor.locator('.action-column > div').nth(2)).toHaveText('화계');
|
||||
await expect(editor.locator('.action-column > div').nth(2)).toHaveText('【허창】에 화계실행');
|
||||
|
||||
await drag(0, 2);
|
||||
await editor.locator('details.selected-menu > summary').click();
|
||||
@@ -1205,7 +1385,7 @@ test('uses drag selection, clipboard paste, and a stored template in advanced mo
|
||||
await expect(editor.locator('.index-column > button.selected')).toHaveCount(15);
|
||||
await editor.locator('details.selected-menu > summary').click();
|
||||
await editor.getByRole('button', { name: '붙여넣기', exact: true }).click();
|
||||
await expect(editor.locator('.action-column > div').nth(5)).toHaveText('화계');
|
||||
await expect(editor.locator('.action-column > div').nth(5)).toHaveText('【허창】에 화계실행');
|
||||
|
||||
await drag(0, 2);
|
||||
page.once('dialog', (dialog) => dialog.accept('화계 세트'));
|
||||
@@ -1284,7 +1464,9 @@ test('keeps the shared main and chief shell geometry and interaction states', as
|
||||
await chiefArgumentForm.locator('input[type=number]').fill('300');
|
||||
await chiefArgumentForm.locator('select').selectOption('2');
|
||||
await page.getByTestId('command-picker').getByRole('button', { name: '입력', exact: true }).click();
|
||||
await expect(page.locator('[data-command-scope="nation"] .action-column > div').first()).toHaveText('포상');
|
||||
await expect(page.locator('[data-command-scope="nation"] .action-column > div').first()).toHaveText(
|
||||
'【관우】 쌀 300 포상'
|
||||
);
|
||||
expect(JSON.stringify(requests)).toContain('"action":"che_포상"');
|
||||
expect(JSON.stringify(requests)).toContain('"destGeneralId":2');
|
||||
const chiefDesktop = await page.locator('.chief-page').evaluate((element) => ({
|
||||
|
||||
@@ -875,6 +875,18 @@ test('current-city wraps dense general names and only shrinks reserved turns', a
|
||||
expect(pageStyle.fontFamily).toContain('Pretendard');
|
||||
expect(pageStyle.fontSize).toBe('14px');
|
||||
|
||||
const controlFonts = await page
|
||||
.locator('.city-page')
|
||||
.evaluate(() =>
|
||||
['#citySelector', '.back-link'].map(
|
||||
(selector) => getComputedStyle(document.querySelector(selector)!).fontFamily
|
||||
)
|
||||
);
|
||||
expect(controlFonts).toHaveLength(2);
|
||||
for (const fontFamily of controlFonts) {
|
||||
expect(fontFamily).toContain('Pretendard');
|
||||
}
|
||||
|
||||
const names = page.locator('.general-names');
|
||||
await expect(names).toHaveCSS('white-space', 'normal');
|
||||
const nameLineCount = await names.locator('span').evaluateAll((elements) => {
|
||||
|
||||
@@ -118,7 +118,8 @@ const persistScreenshot = async (page: Page, name: string, fallbackPath: string)
|
||||
await page.screenshot({ path: resolve(responsiveArtifactDir, `${name}.webp`), fullPage: true });
|
||||
};
|
||||
|
||||
const installFixture = async (page: Page) => {
|
||||
const installFixture = async (page: Page, options: { applicationOpen?: boolean } = {}) => {
|
||||
let joined = false;
|
||||
await page.addInitScript((profile) => {
|
||||
window.localStorage.setItem('sammo-game-token', 'ga_tournament_bracket_playwright');
|
||||
window.localStorage.setItem('sammo-game-profile', profile);
|
||||
@@ -141,7 +142,7 @@ const installFixture = async (page: Page) => {
|
||||
if (operation === 'tournament.getSnapshot') {
|
||||
return response({
|
||||
state: {
|
||||
stage: 0,
|
||||
stage: options.applicationOpen ? 1 : 0,
|
||||
phase: 0,
|
||||
type: 0,
|
||||
auto: false,
|
||||
@@ -151,11 +152,32 @@ const installFixture = async (page: Page) => {
|
||||
nextAt: '2026-08-02T00:00:00.000Z',
|
||||
winnerId: 1,
|
||||
},
|
||||
participants,
|
||||
participants:
|
||||
options.applicationOpen && !joined
|
||||
? []
|
||||
: options.applicationOpen
|
||||
? [
|
||||
{
|
||||
...participants[0],
|
||||
groupId: 0,
|
||||
groupNo: 0,
|
||||
win: 0,
|
||||
draw: 0,
|
||||
lose: 0,
|
||||
gl: 0,
|
||||
seedRank: 0,
|
||||
finalRank: 0,
|
||||
},
|
||||
]
|
||||
: participants,
|
||||
matches,
|
||||
betCount: 16,
|
||||
});
|
||||
}
|
||||
if (operation === 'tournament.join') {
|
||||
joined = true;
|
||||
return response({ ok: true, count: 1 });
|
||||
}
|
||||
if (operation === 'tournament.getBettingSummary') {
|
||||
return response({
|
||||
totals: Object.fromEntries(
|
||||
@@ -245,9 +267,67 @@ test('desktop bracket connects every real general slot to the next round', async
|
||||
expect(geometry.horizontalIdentities).toBe(true);
|
||||
expect(Math.abs(geometry.firstParentY - geometry.firstPairAverageY)).toBeLessThan(1);
|
||||
|
||||
const controls = await page.locator('#tournament-container').evaluate((container) => {
|
||||
const bounds = (selector: string) => container.querySelector<HTMLElement>(selector)!.getBoundingClientRect();
|
||||
const refresh = bounds('.toolbar button:first-child');
|
||||
const join = bounds('.join-button');
|
||||
const close = bounds('.close-button');
|
||||
return {
|
||||
refresh: { width: refresh.width, height: refresh.height },
|
||||
join: { width: join.width, height: join.height },
|
||||
close: { width: close.width, height: close.height },
|
||||
};
|
||||
});
|
||||
expect(controls.refresh).toEqual({ width: 72, height: 44 });
|
||||
expect(controls.join).toEqual({ width: 72, height: 44 });
|
||||
expect(controls.close).toEqual({ width: 88, height: 44 });
|
||||
|
||||
const firstSlot = page.locator('.desktop-bracket-name').first();
|
||||
const oddsContainment = await firstSlot.evaluate((slot) => {
|
||||
const card = slot.getBoundingClientRect();
|
||||
const odds = slot.querySelector<HTMLElement>('.bracket-odds')!.getBoundingClientRect();
|
||||
return {
|
||||
cardTop: card.top,
|
||||
cardBottom: card.bottom,
|
||||
oddsTop: odds.top,
|
||||
oddsBottom: odds.bottom,
|
||||
cardHeight: card.height,
|
||||
};
|
||||
});
|
||||
expect(oddsContainment.cardHeight).toBeGreaterThanOrEqual(82);
|
||||
expect(oddsContainment.oddsTop).toBeGreaterThanOrEqual(oddsContainment.cardTop);
|
||||
expect(oddsContainment.oddsBottom).toBeLessThanOrEqual(oddsContainment.cardBottom);
|
||||
|
||||
await persistScreenshot(page, 'tournament-desktop', testInfo.outputPath('tournament-bracket-desktop.webp'));
|
||||
});
|
||||
|
||||
test('join refresh shows the assigned preliminary group immediately with accessible controls', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await installFixture(page, { applicationOpen: true });
|
||||
await page.goto('tournament');
|
||||
|
||||
const refresh = page.getByRole('button', { name: '갱신' });
|
||||
const join = page.getByRole('button', { name: '참가' });
|
||||
const close = page.getByRole('button', { name: '창 닫기' }).first();
|
||||
await expect(join).toBeEnabled();
|
||||
await join.click();
|
||||
|
||||
await expect(page.getByRole('status')).toHaveText('참가 신청이 반영되었습니다.');
|
||||
await expect(join).toBeDisabled();
|
||||
await expect(page.locator('.preliminary-grid .general-identity', { hasText: names[0] })).toBeVisible();
|
||||
|
||||
for (const control of [refresh, join, close]) {
|
||||
const box = await control.boundingBox();
|
||||
expect(box?.height).toBe(44);
|
||||
expect(box?.width).toBeGreaterThanOrEqual(72);
|
||||
}
|
||||
await refresh.focus();
|
||||
await expect(refresh).toBeFocused();
|
||||
await refresh.hover();
|
||||
await expect(refresh).toHaveCSS('filter', 'brightness(1.25)');
|
||||
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(390);
|
||||
});
|
||||
|
||||
test('mobile bracket exposes every round through tabs with standard horizontal identities', async ({
|
||||
page,
|
||||
}, testInfo) => {
|
||||
@@ -325,6 +405,14 @@ test('mobile bracket exposes every round through tabs with standard horizontal i
|
||||
expect(identity.nameLeft).toBeGreaterThanOrEqual(identity.iconRight - 1);
|
||||
expect(identity.nameTop).toBeLessThan(identity.iconBottom);
|
||||
expect(identity.nameBottom).toBeGreaterThan(identity.iconTop);
|
||||
const firstMobileSlot = bracket.locator('.mobile-bracket-name').first();
|
||||
const mobileOddsContainment = await firstMobileSlot.evaluate((slot) => {
|
||||
const card = slot.getBoundingClientRect();
|
||||
const odds = slot.querySelector<HTMLElement>('.bracket-odds')!.getBoundingClientRect();
|
||||
return { cardBottom: card.bottom, oddsBottom: odds.bottom, cardHeight: card.height };
|
||||
});
|
||||
expect(mobileOddsContainment.cardHeight).toBeGreaterThanOrEqual(82);
|
||||
expect(mobileOddsContainment.oddsBottom).toBeLessThanOrEqual(mobileOddsContainment.cardBottom);
|
||||
await expect(page.getByRole('tablist', { name: '본선 조 선택' })).toBeVisible();
|
||||
await page.getByRole('tab', { name: '二조' }).first().click();
|
||||
await expect(page.getByRole('tab', { name: '二조' }).first()).toHaveAttribute('aria-selected', 'true');
|
||||
|
||||
Reference in New Issue
Block a user