fix: проставлен шрифт, чтобы на разных платформах не отличались скриш…

…оты страниц в тестах PW
gooditworks · Feb 7, 2022 · 97a516d · 97a516d
1 parent ec42d59
commit 97a516d
Show file tree

Hide file tree

Showing 9 changed files with 30 additions and 0 deletions.
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
@@ -0,0 +1,22 @@
+import NextDocument, {Html, Head, Main, NextScript} from "next/document"
+
+class Document extends NextDocument {
+  render() {
+    return (
+      <Html>
+        <Head>
+          <link
+            href="https://fonts.googleapis.com/css2?family=Roboto&display=swap"
+            rel="stylesheet"
+          />
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    )
+  }
+}
+
+export default Document
diff --git a/src/styles/globals.css b/src/styles/globals.css
@@ -1,3 +1,7 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+html {
+  font-family: 'Roboto', sans-serif;
+}
diff --git a/tests/snapshots/index.test.ts b/tests/snapshots/index.test.ts
@@ -1,6 +1,7 @@
 import {test} from "@playwright/test"
 import {snapshot} from "../utils"
 
+// force Playwright for same screenshot filenames on various platforms
 test.beforeEach(({page}, testInfo) => {
   // eslint-disable-next-line no-param-reassign
   testInfo.snapshotSuffix = "multi_platform"

diff --git a/tests/snapshots/index.test.ts-snapshots/index-Desktop-Chrome-multi_platform.png b/tests/snapshots/index.test.ts-snapshots/index-Desktop-Chrome-multi_platform.png
diff --git a/tests/snapshots/index.test.ts-snapshots/index-Desktop-Firefox-multi_platform.png b/tests/snapshots/index.test.ts-snapshots/index-Desktop-Firefox-multi_platform.png
diff --git a/tests/snapshots/index.test.ts-snapshots/index-Desktop-Safari-multi_platform.png b/tests/snapshots/index.test.ts-snapshots/index-Desktop-Safari-multi_platform.png
diff --git a/tests/snapshots/index.test.ts-snapshots/index-Pixel-5-multi_platform.png b/tests/snapshots/index.test.ts-snapshots/index-Pixel-5-multi_platform.png
diff --git a/tests/snapshots/index.test.ts-snapshots/index-iPhone-12-multi_platform.png b/tests/snapshots/index.test.ts-snapshots/index-iPhone-12-multi_platform.png
diff --git a/tests/utils.ts b/tests/utils.ts
@@ -3,6 +3,9 @@ import {Page, expect} from "@playwright/test"
 const snapshot = async (page: Page, url: string, filename: string) => {
   await page.goto(url)
 
+  // wait for fonts loading
+  await page.waitForTimeout(2500)
+
   const screenshot = await page.screenshot()
   expect(screenshot).toMatchSnapshot(filename)
 }