Procházet zdrojové kódy

fix(frontend): wait out Collapse fade before a11y scan in ConfigBlock story

Collapse animates opacity in over motionDurationMid; the Collapsed story's
play function only waited for visibility, so the addon-a11y color-contrast
check could sample a mid-fade, lower-contrast frame and fail flakily in CI.
Wait for the panel's opacity to settle to 1 first.
Sanaei před 3 hodinami
rodič
revize
f3f57e66f5

+ 7 - 1
frontend/src/components/clients/ConfigBlock.stories.tsx

@@ -36,11 +36,17 @@ const sampleLink = 'vless://[email protected]
 
 export const Collapsed: Story = {
   args: { label: 'vless', text: sampleLink, fileName: 'client-config.txt' },
-  play: async ({ canvas, userEvent }) => {
+  play: async ({ canvas, canvasElement, userEvent }) => {
     await expect(canvas.queryByText(/vless:\/\/11112222/)).not.toBeInTheDocument();
     await userEvent.click(canvas.getByText('vless'));
     const configText = await canvas.findByText(/vless:\/\/11112222/);
     await waitFor(() => expect(configText).toBeVisible());
+    // Collapse fades content in over motionDurationMid; wait it out so the a11y
+    // scan doesn't sample a mid-transition, lower-contrast opacity.
+    await waitFor(() => {
+      const panel = canvasElement.querySelector('.ant-collapse-panel');
+      expect(panel && getComputedStyle(panel).opacity).toBe('1');
+    });
     await expect(canvas.getByRole('button', { name: 'Copy' })).toBeVisible();
     await expect(canvas.getByRole('button', { name: 'Download' })).toBeVisible();
     await expect(canvas.getByRole('button', { name: 'QR Code' })).toBeVisible();