test: playwright update change theme and add providers (#302)

gravity-ui · Aug 26, 2024 · 0613e66 · 0613e66
1 parent 4f85d70
commit 0613e66
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 15 deletions.
diff --git a/playwright/core/expectScreenshotFixture.ts b/playwright/core/expectScreenshotFixture.ts
@@ -12,13 +12,7 @@ export const expectScreenshotFixture: PlaywrightFixture<ExpectScreenshotFixture>
         screenshotName,
         ...pageScreenshotOptions
     } = {}) => {
-        const captureScreenshot = async (theme: string) => {
-            const root = page.locator('#root');
-
-            await root.evaluate((el, theme) => {
-                el.classList.value = `g-root g-root_theme_${theme}`;
-            }, theme);
-
+        const captureScreenshot = async () => {
             return (component || page.locator('.playwright-wrapper-test')).screenshot({
                 animations: 'disabled',
                 ...pageScreenshotOptions,
@@ -27,12 +21,14 @@ export const expectScreenshotFixture: PlaywrightFixture<ExpectScreenshotFixture>
 
         const nameScreenshot = testInfo.titlePath.slice(1).join(' ');
 
-        expect(await captureScreenshot('dark')).toMatchSnapshot({
-            name: `${screenshotName || nameScreenshot} dark.png`,
+        expect(await captureScreenshot()).toMatchSnapshot({
+            name: `${screenshotName || nameScreenshot} light.png`,
         });
 
-        expect(await captureScreenshot('light')).toMatchSnapshot({
-            name: `${screenshotName || nameScreenshot} light.png`,
+        await page.emulateMedia({colorScheme: 'dark'});
+
+        expect(await captureScreenshot()).toMatchSnapshot({
+            name: `${screenshotName || nameScreenshot} dark.png`,
         });
     };
 

diff --git a/playwright/playwright/index.html b/playwright/playwright/index.html
@@ -5,6 +5,6 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>Test component page</title>
     </head>
-    <body id="root" class="g-root g-root_theme_light"></body>
+    <body id="root" class="g-root"></body>
     <script type="module" src="./index.tsx"></script>
 </html>
diff --git a/playwright/playwright/index.tsx b/playwright/playwright/index.tsx
@@ -1,15 +1,18 @@
 import React from 'react';
 
-import {MobileProvider, ThemeProvider} from '@gravity-ui/uikit';
+import {MobileProvider, ThemeProvider, ToasterComponent, ToasterProvider} from '@gravity-ui/uikit';
 import {beforeMount} from '@playwright/experimental-ct-react/hooks';
 
 import './index.scss';
 
 beforeMount(async ({App}) => {
     return (
-        <ThemeProvider theme="light">
+        <ThemeProvider>
             <MobileProvider>
-                <App />
+                <ToasterProvider>
+                    <App />
+                    <ToasterComponent />
+                </ToasterProvider>
             </MobileProvider>
         </ThemeProvider>
     );