From dd84e6d6b32fd82a2ca3e61e7caf754ead66961e Mon Sep 17 00:00:00 2001 From: hided62 Date: Mon, 31 Aug 2026 23:34:33 +0000 Subject: [PATCH] =?UTF-8?q?=EB=82=B4=EB=AC=B4=EB=B6=80=20=EB=AA=A8?= =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=EC=A0=95=EB=A0=AC=EA=B3=BC=20=EC=8A=A4?= =?UTF-8?q?=ED=81=AC=EB=A1=A4=EC=9D=84=20=EB=B0=94=EB=A1=9C=EC=9E=A1?= =?UTF-8?q?=EC=9D=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../e2e/commandArguments.spec.ts | 47 ---------------- app/game-frontend/e2e/nationOffices.spec.ts | 55 +++++++++++++++++++ .../command/ReservedCommandEditor.vue | 4 +- .../src/views/NationStratFinanView.vue | 4 +- 4 files changed, 59 insertions(+), 51 deletions(-) diff --git a/app/game-frontend/e2e/commandArguments.spec.ts b/app/game-frontend/e2e/commandArguments.spec.ts index 75401ef8..a20f392f 100644 --- a/app/game-frontend/e2e/commandArguments.spec.ts +++ b/app/game-frontend/e2e/commandArguments.spec.ts @@ -3084,50 +3084,3 @@ test('keeps the chief footer return button the same size as the top return butto const mobile = await measure(); expect(mobile.bottom).toEqual(mobile.top); }); - -test('keeps the chief editor aligned to the 500px document without nested page scroll', async ({ page }) => { - await install(page); - await page.setViewportSize({ width: 500, height: 700 }); - await page.goto('/che/chief-center'); - - const geometry = await page.locator('[data-command-scope="nation"]:visible').evaluate((editor) => { - const layout = editor.querySelector('.editor-layout')!; - const controls = editor.querySelector('.control-pad')!; - const queue = editor.querySelector('.queue-area')!; - const overview = document.querySelector('.chief-overview-frame')!; - const editorRect = editor.getBoundingClientRect(); - const layoutRect = layout.getBoundingClientRect(); - const controlsRect = controls.getBoundingClientRect(); - const queueRect = queue.getBoundingClientRect(); - const overviewRect = overview.getBoundingClientRect(); - const scrollingElement = document.scrollingElement!; - - return { - documentWidth: document.documentElement.clientWidth, - documentOverflow: scrollingElement.scrollWidth - scrollingElement.clientWidth, - editor: { left: editorRect.left, width: editorRect.width, height: editorRect.height }, - layout: { left: layoutRect.left, width: layoutRect.width, height: layoutRect.height }, - controls: { left: controlsRect.left, width: controlsRect.width }, - queue: { left: queueRect.left, width: queueRect.width }, - overviewTop: overviewRect.top, - editorBottom: editorRect.bottom, - editorOverflowX: getComputedStyle(editor).overflowX, - layoutOverflowX: getComputedStyle(layout).overflowX, - }; - }); - - expect(geometry).toEqual({ - documentWidth: 500, - documentOverflow: 0, - editor: { left: 0, width: 500, height: 420 }, - layout: { left: 0, width: 500, height: 420 }, - controls: { left: 0, width: 125 }, - queue: { left: 125, width: 375 }, - overviewTop: geometry.editorBottom, - editorBottom: geometry.editorBottom, - editorOverflowX: 'visible', - layoutOverflowX: 'visible', - }); - - await page.screenshot({ path: test.info().outputPath('chief-center-mobile-500.png'), fullPage: true }); -}); diff --git a/app/game-frontend/e2e/nationOffices.spec.ts b/app/game-frontend/e2e/nationOffices.spec.ts index 727a3ff4..64ac687c 100644 --- a/app/game-frontend/e2e/nationOffices.spec.ts +++ b/app/game-frontend/e2e/nationOffices.spec.ts @@ -737,6 +737,61 @@ test('finance matches the reference 1000px and 500px computed DOM contracts', as await screenshot(page, 'core-finance-mobile-head.png'); }); +test('finance centers its 500px mobile document without a nested horizontal scroller', async ({ page }) => { + await installFixture(page, { role: 'head', rate: 20 }); + await page.setViewportSize({ width: 800, height: 900 }); + await gotoOffice(page, 'nation/finance'); + await expect(page.getByText('외교관계')).toBeVisible(); + + const centeredMobile = await page.locator('#finance-container').evaluate((container) => { + const rect = container.getBoundingClientRect(); + const style = getComputedStyle(container); + const scrollingElement = document.scrollingElement!; + return { + viewportWidth: document.documentElement.clientWidth, + documentScrollWidth: scrollingElement.scrollWidth, + left: rect.left, + right: rect.right, + width: rect.width, + overflowX: style.overflowX, + overflowY: style.overflowY, + containerScrollLeft: container.scrollLeft, + }; + }); + expect(centeredMobile).toEqual({ + viewportWidth: 800, + documentScrollWidth: 800, + left: 150, + right: 650, + width: 500, + overflowX: 'clip', + overflowY: 'visible', + containerScrollLeft: 0, + }); + await page.locator('#finance-container').evaluate((container) => container.scrollTo({ left: 200 })); + expect(await page.locator('#finance-container').evaluate((container) => container.scrollLeft)).toBe(0); + + await page.setViewportSize({ width: 500, height: 900 }); + const exactMobile = await page.locator('#finance-container').evaluate((container) => { + const rect = container.getBoundingClientRect(); + return { + viewportWidth: document.documentElement.clientWidth, + documentScrollWidth: document.scrollingElement!.scrollWidth, + left: rect.left, + right: rect.right, + width: rect.width, + }; + }); + expect(exactMobile).toEqual({ + viewportWidth: 500, + documentScrollWidth: 500, + left: 0, + right: 500, + width: 500, + }); + await screenshot(page, 'core-finance-mobile-centered-500.png'); +}); + test('finance enforces edit permissions and preserves the old value across an API failure', async ({ page }) => { const state: FixtureState = { role: 'head', rate: 20, failNextRate: true }; await installFixture(page, state); diff --git a/app/game-frontend/src/components/command/ReservedCommandEditor.vue b/app/game-frontend/src/components/command/ReservedCommandEditor.vue index af876847..7f4529c5 100644 --- a/app/game-frontend/src/components/command/ReservedCommandEditor.vue +++ b/app/game-frontend/src/components/command/ReservedCommandEditor.vue @@ -1269,9 +1269,9 @@ const clickOutsideMenu = (event: Event) => { } .mobile.compact .editor-layout { - min-height: 420px; + min-height: 370px; display: grid; - grid-template-columns: 125px 375px; + grid-template-columns: 109px 391px; grid-template-rows: auto auto; } .mobile.compact .control-pad { diff --git a/app/game-frontend/src/views/NationStratFinanView.vue b/app/game-frontend/src/views/NationStratFinanView.vue index f294e425..2d4c2b46 100644 --- a/app/game-frontend/src/views/NationStratFinanView.vue +++ b/app/game-frontend/src/views/NationStratFinanView.vue @@ -719,8 +719,8 @@ textarea { @media (max-width: 939.98px) { .page-finance { width: 500px; - margin: 0; - overflow-x: hidden; + margin: 0 auto; + overflow-x: clip; } .top-back-bar, .bottom-bar {