diff --git a/src/features/online-board/components/StaleDataOverlay.scss b/src/features/online-board/components/StaleDataOverlay.scss index 209334c3..0c57b774 100644 --- a/src/features/online-board/components/StaleDataOverlay.scss +++ b/src/features/online-board/components/StaleDataOverlay.scss @@ -1,16 +1,11 @@ .stale-data-overlay { position: fixed; - inset: 0; - z-index: 9999; - display: flex; - align-items: flex-start; - justify-content: center; - box-sizing: border-box; - padding: 20vh 24px 24px; - background: rgb(255 255 255 / 70%); - color: #111827; - font-size: 18px; - font-weight: 600; - line-height: 1.4; + top: 0; + left: 0; text-align: center; + padding-top: 20%; + width: 100%; + height: 100%; + background-color: rgb(255 255 255 / 70%); + z-index: 9999; } diff --git a/tests/e2e/online-board.spec.ts b/tests/e2e/online-board.spec.ts index da6433a2..df3d56ed 100644 --- a/tests/e2e/online-board.spec.ts +++ b/tests/e2e/online-board.spec.ts @@ -284,10 +284,17 @@ test.describe("Online Board", () => { timeout: 10000, }); - await expect(page.locator('[data-testid="stale-data-overlay"]')).toHaveText( + const overlay = page.locator('[data-testid="stale-data-overlay"]'); + await expect(overlay).toHaveText( "Данные устарели, обновите страницу!", { timeout: 2000 }, ); + await expect(overlay).toHaveCSS("position", "fixed"); + await expect(overlay).toHaveCSS("top", "0px"); + await expect(overlay).toHaveCSS("left", "0px"); + await expect(overlay).toHaveCSS("text-align", "center"); + await expect(overlay).toHaveCSS("background-color", "rgba(255, 255, 255, 0.7)"); + await expect(overlay).toHaveCSS("z-index", "9999"); }); test("route results redirect to main page after stale-data stop timeout", async ({