merge: 최신 main을 메인 갱신 toast에 통합

This commit is contained in:
2026-08-17 15:44:04 +00:00
15 changed files with 419 additions and 104 deletions
@@ -995,6 +995,123 @@ test('desktop menus preserve ref columns, prefix-safe routes, and controlled dro
await persistArtifact(page, `${basePath.slice(1)}-desktop-1200`);
});
test('split buttons keep square inner corners and a single divider in every interaction state', async ({
page,
}, testInfo) => {
const state: NavigationFixture = {
officerLevel: 5,
permission: 2,
nationLevel: 3,
stage: 1,
npcMode: 1,
scenarioTitle: '분할 버튼 이음새 검증 시나리오',
generalMeCalls: 0,
operations: [],
nationColor: '#663399',
};
await installFixture(page, state);
if (artifactRoot) await mkdir(resolve(artifactRoot), { recursive: true });
const measure = (main: Locator, toggle: Locator) =>
Promise.all([
main.evaluate((element) => {
const rect = element.getBoundingClientRect();
const style = getComputedStyle(element);
return {
rect: rect.toJSON(),
borderRightWidth: style.borderRightWidth,
borderTopLeftRadius: style.borderTopLeftRadius,
borderTopRightRadius: style.borderTopRightRadius,
borderBottomRightRadius: style.borderBottomRightRadius,
borderBottomLeftRadius: style.borderBottomLeftRadius,
};
}),
toggle.evaluate((element) => {
const rect = element.getBoundingClientRect();
const style = getComputedStyle(element);
return {
rect: rect.toJSON(),
borderLeftWidth: style.borderLeftWidth,
borderTopLeftRadius: style.borderTopLeftRadius,
borderTopRightRadius: style.borderTopRightRadius,
borderBottomRightRadius: style.borderBottomRightRadius,
borderBottomLeftRadius: style.borderBottomLeftRadius,
};
}),
]);
const expectAttached = async (main: Locator, toggle: Locator) => {
const [mainStyle, toggleStyle] = await measure(main, toggle);
expect(mainStyle).toMatchObject({
borderRightWidth: '1px',
borderTopLeftRadius: '5.25px',
borderTopRightRadius: '0px',
borderBottomRightRadius: '0px',
borderBottomLeftRadius: '5.25px',
});
expect(toggleStyle).toMatchObject({
borderLeftWidth: '0px',
borderTopLeftRadius: '0px',
borderTopRightRadius: '5.25px',
borderBottomRightRadius: '5.25px',
borderBottomLeftRadius: '0px',
});
expect(toggleStyle.rect.left).toBeCloseTo(mainStyle.rect.right, 2);
};
for (const width of [1200, 500]) {
await page.setViewportSize({ width, height: 900 });
await waitForMain(page);
const globalSplit = page.locator('.main-global-menu:visible .main-menu-split').first();
const nationSplit = page.locator('.main-nation-menu:visible .nation-menu-split').first();
const pairs: Array<[string, Locator, Locator]> = [
[
'global',
globalSplit.locator('[data-navigation-id="board-community"]'),
globalSplit.locator('[data-menu-id="boards"]'),
],
[
'nation',
nationSplit.locator('[data-navigation-id="auction-resource"]'),
nationSplit.locator('[data-menu-id="auction"]'),
],
];
for (const [label, main, toggle] of pairs) {
await expect(main).toBeVisible();
await expect(toggle).toBeVisible();
await page.mouse.move(width - 1, 899);
await expectAttached(main, toggle);
await toggle.focus();
await expect(toggle).toBeFocused();
await expectAttached(main, toggle);
await toggle.hover();
await expectAttached(main, toggle);
const box = await toggle.boundingBox();
if (!box) throw new Error(`${label} split toggle is not measurable`);
await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
await page.mouse.down();
await expectAttached(main, toggle);
await page.mouse.move(width - 1, 899);
await page.mouse.up();
await toggle.click();
await expect(toggle).toHaveAttribute('aria-expanded', 'true');
await expectAttached(main, toggle);
await page.keyboard.press('Escape');
await toggle.locator('..').screenshot({
path: artifactRoot
? resolve(artifactRoot, `${basePath.slice(1)}-${width}-${label}-split-button.png`)
: testInfo.outputPath(`${width}-${label}-split-button.png`),
});
}
}
});
test('the repeated bottom global menu opens upward on the mobile document', async ({ page }, testInfo) => {
const state: NavigationFixture = {
officerLevel: 5,
@@ -35,6 +35,7 @@ const names = [
'허저',
'주태',
longGeneralName,
...Array.from({ length: 48 }, (_, index) => `예선장수${index + 17}`),
];
const participants = names.map((name, index) => ({
id: index + 1,
@@ -45,13 +46,20 @@ const participants = names.map((name, index) => ({
level: 10,
picture: 'default.jpg',
imageServer: 0,
groupId: 10 + (index % 8),
groupId: Math.floor(index / 8) < 4 ? 10 + (index % 8) : index % 8,
groupNo: Math.floor(index / 8),
win: 3 - (index % 2),
win: Math.floor(index / 8) < 4 ? 3 - (index % 2) : 7 - Math.floor(index / 8),
draw: index % 2,
lose: 0,
gl: 12 - index,
lose: Math.floor(index / 8) < 4 ? 0 : Math.floor(index / 8),
gl: 64 - index,
finalRank: Math.floor(index / 8) + 1,
preliminaryGroupId: index % 8,
preliminaryGroupNo: Math.floor(index / 8),
preliminaryRank: Math.floor(index / 8) + 1,
preliminaryWin: 7 - Math.floor(index / 8),
preliminaryDraw: index % 2,
preliminaryLose: Math.floor(index / 8),
preliminaryGl: 64 - index,
}));
const matches = [
...Array.from({ length: 8 }, (_, index) => ({
@@ -181,11 +189,11 @@ const installFixture = async (page: Page, options: { applicationOpen?: boolean }
if (operation === 'tournament.getBettingSummary') {
return response({
totals: Object.fromEntries(
participants.map((participant, index) => [participant.id, 100 + index * 10])
participants.slice(0, 16).map((participant, index) => [participant.id, 100 + index * 10])
),
myTotals: {},
myTotals: { 1: 120, 2: 40 },
totalAmount: 2800,
myAmount: 0,
myAmount: 160,
});
}
if (operation === 'tournament.getRankings') {
@@ -297,6 +305,14 @@ test('desktop bracket connects every real general slot to the next round', async
expect(oddsContainment.cardHeight).toBeGreaterThanOrEqual(82);
expect(oddsContainment.oddsTop).toBeGreaterThanOrEqual(oddsContainment.cardTop);
expect(oddsContainment.oddsBottom).toBeLessThanOrEqual(oddsContainment.cardBottom);
await expect(firstSlot.locator('.bracket-my-bet')).toHaveText('내 투자 금120');
const preliminaryTables = page.locator('.preliminary-grid table');
await expect(preliminaryTables).toHaveCount(8);
for (let groupIndex = 0; groupIndex < 8; groupIndex += 1) {
await expect(preliminaryTables.nth(groupIndex).locator('tbody tr')).toHaveCount(8);
await expect(preliminaryTables.nth(groupIndex).locator('.general-identity')).toHaveCount(8);
}
await persistScreenshot(page, 'tournament-desktop', testInfo.outputPath('tournament-bracket-desktop.webp'));
});
@@ -413,6 +429,7 @@ test('mobile bracket exposes every round through tabs with standard horizontal i
});
expect(mobileOddsContainment.cardHeight).toBeGreaterThanOrEqual(82);
expect(mobileOddsContainment.oddsBottom).toBeLessThanOrEqual(mobileOddsContainment.cardBottom);
await expect(firstMobileSlot.locator('.bracket-my-bet')).toHaveText('내 투자 금120');
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');
@@ -420,12 +437,39 @@ test('mobile bracket exposes every round through tabs with standard horizontal i
await persistScreenshot(page, 'tournament-mobile', testInfo.outputPath('tournament-bracket-mobile.webp'));
});
test('tournament and betting pages expose same-row navigation tabs beside close', async ({ page }) => {
await page.setViewportSize({ width: 390, height: 844 });
await openTournament(page);
const navigation = page.getByRole('tablist', { name: '토너먼트와 베팅장 이동' });
const tournamentTab = navigation.getByRole('tab', { name: '토너먼트' });
const bettingTab = navigation.getByRole('tab', { name: '베팅장' });
const close = page.getByRole('button', { name: '창 닫기' }).first();
await expect(tournamentTab).toHaveAttribute('aria-selected', 'true');
const headerCenters = await Promise.all(
[tournamentTab, bettingTab, close].map(async (control) => {
const box = await control.boundingBox();
return box ? box.y + box.height / 2 : -1;
})
);
expect(Math.max(...headerCenters) - Math.min(...headerCenters)).toBeLessThan(1);
await bettingTab.click();
await expect(page).toHaveURL(/\/betting$/);
await expect(page.getByRole('tab', { name: '베팅장' })).toHaveAttribute('aria-selected', 'true');
await page.getByRole('tab', { name: '토너먼트' }).click();
await expect(page).toHaveURL(/\/tournament$/);
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(390);
});
test('mobile betting rankings use tabs and keep dedicated icons beside general names', async ({ page }, testInfo) => {
await page.setViewportSize({ width: 390, height: 844 });
await installFixture(page);
await page.goto('betting');
await expect(page.locator('.candidate-card')).toHaveCount(16);
await expect(page.locator('.betting-bracket .bracket-my-bet').first()).toHaveText('내 투자 금120');
await expect(page.getByRole('tablist', { name: '토너먼트 랭킹 종목 선택' })).toBeVisible();
await expect(page.locator('.ranking-table:visible')).toHaveCount(1);
await page.getByRole('tab', { name: '통솔전' }).click();