merge: 최신 로컬 main을 정보 화면 버튼 통일에 통합

This commit is contained in:
2026-08-21 17:35:51 +00:00
25 changed files with 1010 additions and 84 deletions
+185 -1
View File
@@ -34,6 +34,7 @@ type NavigationFixture = {
operations: string[];
generalName?: string;
generalTurnTime?: string;
nextTurnMonthOffset?: 0 | 1;
serverTime?: string;
serverWallTime?: string;
clockMode?: 'realtime' | 'manual';
@@ -440,6 +441,7 @@ const generalContext = (state: NavigationFixture) => ({
crewTypeName: '보병',
traits: { personal: '대담', specialDomestic: '상재', specialWar: '무쌍' },
turnTime: state.generalTurnTime ?? '0185-01-01T00:00:00.000Z',
nextTurnMonthOffset: state.nextTurnMonthOffset ?? 0,
},
city: {
id: 1,
@@ -1188,7 +1190,7 @@ test('desktop menus preserve ref columns, prefix-safe routes, and controlled dro
await expect(page.locator('.legacy-game-info')).toContainText('현재: 185년 1월');
await expect(page.locator('.legacy-game-info')).toContainText('턴: 10분');
await expect(page.locator('.legacy-game-info')).not.toContainText('최근 턴:');
await expect(page.locator('.execution-status')).toHaveText('동작 시각: 08-13 09:05');
await expect(page.locator('.execution-status')).toHaveText('현재 시각: 08-13 09:00');
await expect(page.locator('.tournament-status')).toHaveText('토너먼트: 참가 모집중');
await expect(page.locator('.vote-status')).toHaveText('설문: 메뉴 설문');
const headerStatusGeometry = await page.locator('.main-page').evaluate((element) => {
@@ -1623,6 +1625,105 @@ test('the repeated bottom global menu opens upward on the mobile document', asyn
await persistArtifact(page, `${basePath.slice(1)}-mobile-bottom-dropup`);
});
test('first reserved month crosses December only after the general turn has passed', async ({ page }, testInfo) => {
const state: NavigationFixture = {
officerLevel: 0,
permission: 0,
nationLevel: 0,
stage: 0,
npcMode: 1,
generalMeCalls: 0,
operations: [],
currentYear: 179,
currentMonth: 12,
nextTurnMonthOffset: 0,
validMapImages: true,
reservedTurns: [
{ index: 0, action: '휴식', args: {} },
{ index: 1, action: '휴식', args: {} },
],
};
await installRealtimeHarness(page);
await installFixture(page, state);
await page.setViewportSize({ width: 1200, height: 900 });
await waitForMain(page);
await waitForMainRealtime(page);
const map = page.locator('[data-main-target="map"] .map-viewer').first();
const commandPanel = page.locator('[data-main-target="commands"]').first();
const firstDate = commandPanel.locator('.date-column [data-turn-index="0"]');
const secondDate = commandPanel.locator('.date-column [data-turn-index="1"]');
await expect(map).toContainText('179年 12月');
await expect(firstDate).toHaveText('179年 12月');
await expect(secondDate).toHaveText('180年 1月');
const before = await firstDate.evaluate((element) => {
const rect = element.getBoundingClientRect();
const style = getComputedStyle(element);
return {
rect: rect.toJSON(),
fontSize: style.fontSize,
lineHeight: style.lineHeight,
color: style.color,
documentScrollWidth: document.documentElement.scrollWidth,
viewportWidth: window.innerWidth,
};
});
await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-before.png') });
state.nextTurnMonthOffset = 1;
state.contextRevision = 'BBBBBBBBBBBBBBBBBBBBBB';
state.contextOperations = [{ op: 'replace', path: '/general/nextTurnMonthOffset', value: 1 }];
await emitReadModelInvalidation(page, readModelInvalidation({ context: true }));
await expect(map).toContainText('179年 12月');
await expect(firstDate).toHaveText('180年 1月');
await expect(secondDate).toHaveText('180年 2月');
await firstDate.hover();
const after = await firstDate.evaluate((element) => {
const rect = element.getBoundingClientRect();
const style = getComputedStyle(element);
return {
rect: rect.toJSON(),
fontSize: style.fontSize,
lineHeight: style.lineHeight,
color: style.color,
documentScrollWidth: document.documentElement.scrollWidth,
viewportWidth: window.innerWidth,
};
});
expect(after.rect.width).toBe(before.rect.width);
expect(after.rect.height).toBe(before.rect.height);
expect(after.rect.left).toBe(before.rect.left);
expect(after.rect.right).toBe(before.rect.right);
expect(after.fontSize).toBe(before.fontSize);
expect(after.lineHeight).toBe(before.lineHeight);
expect(after.color).toBe(before.color);
expect(before.documentScrollWidth).toBe(before.viewportWidth);
expect(after.documentScrollWidth).toBe(after.viewportWidth);
await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-after.png') });
await page.setViewportSize({ width: 390, height: 844 });
await firstDate.scrollIntoViewIfNeeded();
await expect(firstDate).toHaveText('180年 1月');
const mobile = await firstDate.evaluate((element) => {
const rect = element.getBoundingClientRect();
const style = getComputedStyle(element);
return {
rect: rect.toJSON(),
fontSize: style.fontSize,
lineHeight: style.lineHeight,
documentScrollWidth: document.documentElement.scrollWidth,
};
});
expect(mobile.rect.left).toBeGreaterThanOrEqual(0);
expect(mobile.rect.right).toBeLessThanOrEqual(500);
expect(mobile.fontSize).toBe(before.fontSize);
expect(mobile.lineHeight).toBe(before.lineHeight);
expect(mobile.documentScrollWidth).toBe(500);
await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-mobile.png') });
});
test('main general card uses local turn time and command clock tracks corrected server time', async ({ page }) => {
const state: NavigationFixture = {
officerLevel: 0,
@@ -1793,6 +1894,89 @@ test('main general card uses local turn time and command clock tracks corrected
expect(state.operations).toHaveLength(operationsBeforePreopenBoundary);
});
test('main header clock follows minute boundaries only while game-server contact is recent', async ({
page,
}, testInfo) => {
const state: NavigationFixture = {
officerLevel: 0,
permission: 0,
nationLevel: 0,
stage: 0,
npcMode: 1,
generalMeCalls: 0,
operations: [],
serverTime: '2026-08-13T00:00:35.000Z',
serverWallTime: '2026-08-13T00:00:00.000Z',
clockMode: 'realtime',
clockRunning: true,
};
await installRealtimeHarness(page);
await installFixture(page, state);
await page.clock.install({ time: new Date('2026-08-13T00:00:00.000Z') });
await page.setViewportSize({ width: 1200, height: 900 });
await waitForMain(page);
await waitForMainRealtime(page);
const clock = page.locator('.execution-status');
const initialRequestCount = state.trpcRequests?.length ?? 0;
await expect(clock).toHaveText('현재 시각: 08-13 09:00');
await expect(clock).not.toHaveClass(/execution-status--stale/u);
await page.clock.runFor(25_000);
await expect(clock).toHaveText('현재 시각: 08-13 09:01');
await page.clock.runFor(21_000);
await expect(clock).toHaveClass(/execution-status--stale/u);
await expect(clock).toHaveAttribute('title', '최근 45초 동안 서버 통신이 없어 시각 갱신을 멈췄습니다.');
await expect.poll(() => clock.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(255, 0, 255)');
const staleDesktopGeometry = await clock.evaluate((element) => ({
rect: element.getBoundingClientRect().toJSON(),
overflow: element.scrollWidth - element.clientWidth,
color: getComputedStyle(element).color,
fontSize: getComputedStyle(element).fontSize,
lineHeight: getComputedStyle(element).lineHeight,
}));
expect(staleDesktopGeometry.rect.width).toBeCloseTo(333.33, 0);
expect(staleDesktopGeometry.rect.height).toBeGreaterThanOrEqual(36);
expect(staleDesktopGeometry.overflow).toBeLessThanOrEqual(0);
await clock.screenshot({ path: testInfo.outputPath('main-header-clock-stale-desktop-1200.png') });
await page.clock.runFor(60_000);
await expect(clock).toHaveText('현재 시각: 08-13 09:01');
await page.evaluate(() => {
(window as unknown as { __emitMainRealtime: (type: string, value: unknown) => void }).__emitMainRealtime(
'ping',
{}
);
});
await expect(clock).toHaveText('현재 시각: 08-13 09:02');
await expect(clock).not.toHaveClass(/execution-status--stale/u);
await page.clock.runFor(39_000);
await expect(clock).toHaveText('현재 시각: 08-13 09:03');
await expect.poll(() => clock.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(0, 255, 255)');
await page.setViewportSize({ width: 500, height: 900 });
const freshMobileGeometry = await clock.evaluate((element) => ({
rect: element.getBoundingClientRect().toJSON(),
overflow: element.scrollWidth - element.clientWidth,
color: getComputedStyle(element).color,
fontSize: getComputedStyle(element).fontSize,
lineHeight: getComputedStyle(element).lineHeight,
documentScrollWidth: document.documentElement.scrollWidth,
}));
expect(freshMobileGeometry.rect.width).toBeCloseTo(166.67, 0);
expect(freshMobileGeometry.overflow).toBeLessThanOrEqual(0);
expect(freshMobileGeometry.documentScrollWidth).toBe(500);
await Promise.all([
clock.screenshot({ path: testInfo.outputPath('main-header-clock-fresh-mobile-500.png') }),
writeFile(
testInfo.outputPath('main-header-clock-geometry.json'),
`${JSON.stringify({ staleDesktopGeometry, freshMobileGeometry }, null, 2)}\n`
),
]);
expect(state.trpcRequests?.length ?? 0).toBe(initialRequestCount);
});
test('message targets keep reply behavior and use nation-color contrast in labels and select options', async ({
page,
}) => {
+75 -1
View File
@@ -626,6 +626,21 @@ test('finance editor preserves Ref formatting controls and uploads images throug
expect(await editorFrame.evaluate((element) => getComputedStyle(element).backgroundColor)).toBe('rgba(0, 0, 0, 0)');
expect(await editor.evaluate((element) => getComputedStyle(element).backgroundColor)).toBe('rgba(0, 0, 0, 0)');
await editor.fill('첫 번째 항목');
await page.getByRole('button', { name: '번호 목록' }).click();
await expect(editor.locator('ol')).toHaveCSS('list-style-type', 'decimal');
await expect(editor.locator('li')).toContainText('첫 번째 항목');
await screenshot(page, 'core-finance-numbered-list-desktop.png');
await page.getByRole('button', { name: '번호 목록' }).click();
const alignmentIcons = await page
.getByRole('toolbar', { name: '서식' })
.getByRole('button', { name: /^(왼쪽|가운데|오른쪽) 정렬$/ })
.locator('svg')
.evaluateAll((icons) => icons.map((icon) => icon.innerHTML));
expect(alignmentIcons).toHaveLength(3);
expect(new Set(alignmentIcons).size).toBe(3);
await editor.fill('서식 검증');
await editor.press('Control+A');
await page.getByRole('combobox', { name: '글꼴', exact: true }).selectOption('Gungsuh, serif');
@@ -663,11 +678,27 @@ test('finance editor preserves Ref formatting controls and uploads images throug
await expect.poll(() => state.uploadDataUrl).toMatch(/^data:image\/png;base64,/);
await expect(editor.locator('hr')).toHaveCount(1);
await expect(editor.locator('img')).toHaveAttribute(
const uploadedImage = editor.locator('img');
await expect(uploadedImage).toHaveAttribute(
'src',
'https://sam-image.hided.net/uploads/core2026/0123456789abcdef0123456789abcdef.webp'
);
await uploadedImage.click();
const imageToolbar = page.getByRole('toolbar', { name: '이미지 정렬' });
await expect(imageToolbar).toBeVisible();
await expect(imageToolbar.getByRole('button')).toHaveCount(5);
await screenshot(page, 'core-finance-image-toolbar-desktop.png');
await imageToolbar.getByRole('button', { name: '이미지 오른쪽 정렬' }).click();
await expect(uploadedImage).toHaveClass(/custom-image-align-right/);
await expect(uploadedImage).toHaveCSS('display', 'block');
await expect(uploadedImage).toHaveCSS('margin-right', '0px');
await page.getByRole('toolbar', { name: '서식' }).getByRole('button', { name: '가운데 정렬' }).click();
await expect(uploadedImage).toHaveClass(/custom-image-align-center/);
await uploadedImage.click();
await imageToolbar.getByRole('button', { name: '이미지 오른쪽 정렬' }).click();
const imageButton = page.getByRole('button', { name: '이미지', exact: true });
await imageButton.hover();
await expect(imageButton).toHaveCSS('border-color', 'rgb(157, 200, 240)');
@@ -693,11 +724,54 @@ test('finance editor preserves Ref formatting controls and uploads images throug
expect(state.noticeMutationInput).toContain('background-color: rgb(254, 220, 186)');
expect(state.noticeMutationInput).toContain('text-align: center');
expect(state.noticeMutationInput).toContain('<hr>');
expect(state.noticeMutationInput).toContain('class="custom-image-align-right"');
expect(state.noticeMutationInput).toContain(
'https://sam-image.hided.net/uploads/core2026/0123456789abcdef0123456789abcdef.webp'
);
});
test('recruitment editor keeps the Ref 870px content width in desktop and scales it to 500px on mobile', async ({
page,
}) => {
await installFixture(page, { role: 'head', rate: 20 });
await page.setViewportSize({ width: 1000, height: 900 });
await gotoOffice(page, 'nation/finance');
await page.getByRole('button', { name: '임관 권유문 수정' }).click();
const form = page.locator('#scout-message-form');
const editorFrame = form.locator('.legacy-html-editor');
const desktop = await form.evaluate((element) => {
const frame = element.querySelector<HTMLElement>('.legacy-html-editor')!;
const formRect = element.getBoundingClientRect();
const frameRect = frame.getBoundingClientRect();
return {
formWidth: formRect.width,
frameWidth: frameRect.width,
leftInset: frameRect.left - formRect.left,
rightInset: formRect.right - frameRect.right,
};
});
expect(desktop.formWidth).toBe(1000);
expect(desktop.frameWidth).toBe(870);
expect(desktop.leftInset).toBe(130);
expect(desktop.rightInset).toBe(0);
await page.setViewportSize({ width: 500, height: 900 });
const mobile = await editorFrame.evaluate((element) => {
const rect = element.getBoundingClientRect();
return {
visualWidth: rect.width,
sourceWidth: element.clientWidth,
toolbarWidth: element.querySelector<HTMLElement>('[role="toolbar"]')!.getBoundingClientRect().width,
};
});
expect(mobile.sourceWidth).toBe(870);
expect(mobile.visualWidth).toBeCloseTo(500, 1);
expect(mobile.toolbarWidth).toBeCloseTo(500, 1);
expect(await page.locator('.page-finance').evaluate((element) => element.scrollWidth)).toBeLessThanOrEqual(500);
await screenshot(page, 'core-finance-scout-editor-mobile.png');
});
test('finance adopts the server-purified notice and scout message before rendering the saved preview', async ({
page,
}) => {