merge: 최신 로컬 main을 정보 화면 버튼 통일에 통합
This commit is contained in:
@@ -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,
|
||||
}) => {
|
||||
|
||||
@@ -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,
|
||||
}) => {
|
||||
|
||||
Reference in New Issue
Block a user