test(Toc): update snapshots

Author: itwillwork

src/components/Toc/__snapshots__/Toc.visual.test.tsx-snapshots/Toc-smoke-default--hover-hovered-light-chromium-linux.png

@@ -1,29 +1,46 @@
-import React from 'react';
-
-import {test} from '~playwright/core';
+import {smokeTest, test} from '~playwright/core';
 
 import {createSmokeScenarios} from '../../../stories/tests-factory/create-smoke-scenarios';
 import type {TocProps} from '../Toc';
 
 import {TestToc} from './helpers';
 
 test.describe('Toc', {tag: '@Toc'}, () => {
-    createSmokeScenarios<Partial<TocProps>>({}, {}).forEach(([title, details, props]) => {
-        test(title, details, async ({mount, expectScreenshot}) => {
-            const root = await mount(<TestToc {...props} />);
+    smokeTest('', async ({mount, expectScreenshot}) => {
+        const smokeScenarios = createSmokeScenarios<Partial<TocProps>>(
+            {
+                value: 'control',
+            },
+            {},
+        );
+
+        await mount(
+            <div>
+                {smokeScenarios.map(([title, props]) => (
+                    <div key={title}>
+                        <h4>{title}</h4>
+                        <div>
+                            <TestToc {...props} />
+                        </div>
+                    </div>
+                ))}
+            </div>,
+        );
+
+        await expectScreenshot({
+            themes: ['light'],
+        });
+    });
 
-            await expectScreenshot({});
+    createSmokeScenarios<Partial<TocProps>>({}, {}).forEach(([title, props]) => {
+        smokeTest(`${title}-hover`, async ({mount, expectScreenshot}) => {
+            const root = await mount(<TestToc {...props} />);
 
             await root.getByText('Disk controls').hover();
 
             await expectScreenshot({
                 nameSuffix: 'hovered',
-            });
-
-            await root.getByText('Disk controls').click();
-
-            await expectScreenshot({
-                nameSuffix: 'after click',
+                themes: ['light'],
             });
         });
     });

src/components/Toc/__snapshots__/Toc.visual.test.tsx-snapshots/Toc-smoke-default-after-click-dark-chromium-linux.png

@@ -1,5 +1,3 @@
-import React from 'react';
-
 import type {TocProps} from '../Toc';
 import {Toc} from '../Toc';
 
@@ -33,7 +31,7 @@ const testItems: TocProps['items'] = [
 ] as const;
 
 export const TestToc = (props: Partial<TocProps>) => {
-    const [active, setActive] = React.useState<string | undefined>(undefined);
+    const [active, setActive] = React.useState<string | undefined>(props.value);
 
     return (
         <Toc