Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Infinite loop #323

Open
2 of 3 tasks
byron-ia opened this issue Oct 14, 2024 · 0 comments
Open
2 of 3 tasks

[Bug]: Infinite loop #323

byron-ia opened this issue Oct 14, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@byron-ia
Copy link

byron-ia commented Oct 14, 2024

Describe the Bug

Having this same issue while using the plugin with StoryBook 6.5: #190 (comment)

Using cypress open to open a test risks an infinite loop.
Running a test against any story file with 3 or more stories tends to get stuck in an infinite loop.
This doesn't happen when I run cypress run --component.

/**
 * this generates a snapshot for each story exported in [ComponentName].stories.tsx
 */
export const testComponents = (
  componentName: string,
  stories: Record<string, Story | Meta>,
  viewport?: { width: number; height: number }
) => {
  describe(`${componentName} components`, () => {
    beforeEach(() => {
      if (viewport) {
        cy.viewport(viewport.width, viewport.height);
      }
      cy.on('uncaught:exception', (err) => {
        console.error('Uncaught exception:', err.message);
        return false;
      });
    });

    const storyEntries = Object.entries(stories).filter(([key]) => key !== 'default');

    storyEntries.forEach(([storyName, Story]) => {
      const viewportName = viewport ? `-${viewport.width}x${viewport.height}` : '';
      const title = `${componentName}-${storyName}${viewportName}`;
      it(`renders ${storyName} ${viewportName}`, () => {
        // @ts-expect-error: Ignore type checking for Story component
        cy.mount(React.createElement(Story, Story.args));
        cy.matchImage({ title });
      });
    });
  });
};
/* eslint-disable jest/expect-expect */
import { Meta, Story } from '@storybook/react';
import { testComponents } from '../../../cypress/support/componentTests';
import * as stories from './Tabs.stories';

const componentName = stories.default.component?.displayName ?? '';
testComponents(componentName, stories as Record<string, Story | Meta>);

Tabs.stories.tsx
image

Steps to reproduce

Run cypress open, select test.

Expected behavior

Test should run successfully without going into an infinite loop.

Additional context

"cypress": "^13.15.0",
"@cypress/react": "^8.0.2",
"@frsource/cypress-plugin-visual-regression-diff": "^3.3.10",
"react": "^17.0.2",

Package version

3.3.10

Device

MBP

OS and version

Mac OS 15.0.1

Browser and version

Version 129.0.6668.91 (Official Build) (x86_64)

Node version

20.x

I can work on it by myself

  • Yes
  • No

Code of Conduct

  • I agree to follow this project's Code of Conduct
@byron-ia byron-ia added the bug Something isn't working label Oct 14, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant