Skip to content

Commit

Permalink
Add tests to confirm behaviour.
Browse files Browse the repository at this point in the history
I wasn't able to figure out a test that triggers the original behaviour from this bug but these tests will definitely fail if `key={}` is not there, which is good.
  • Loading branch information
tmeasday committed Jul 28, 2022
1 parent b2b7a15 commit 0870bda
Show file tree
Hide file tree
Showing 2 changed files with 59 additions and 0 deletions.
1 change: 1 addition & 0 deletions code/jest.config.js
Expand Up @@ -40,6 +40,7 @@ module.exports = {
],
roots: [
'<rootDir>/addons',
'<rootDir>/renderers',
'<rootDir>/frameworks',
'<rootDir>/lib',
'<rootDir>/examples/official-storybook',
Expand Down
58 changes: 58 additions & 0 deletions code/renderers/react/src/render.test.tsx
@@ -0,0 +1,58 @@
import React, { useEffect } from 'react';
import { jest, describe, it, expect } from '@jest/globals';

import { renderToDOM } from './render';

jest.setTimeout(500);

describe('react renderer', () => {
it('waits until the component has rendered', async () => {
const domElement = document.createElement('div');
const unboundStoryFn = jest.fn(() => 'Story');
const showMain = jest.fn();

await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
expect(unboundStoryFn).toHaveBeenCalledTimes(1);
expect(domElement.innerHTML).toBe('Story');
});

it('re-renders the story when called again', async () => {
const domElement = document.createElement('div');
const unboundStoryFn = jest.fn(() => 'Story');
const showMain = jest.fn();

await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
expect(unboundStoryFn).toHaveBeenCalledTimes(2);
});

it('does not remount the component when called a second time', async () => {
const domElement = document.createElement('div');
const effect = jest.fn();
const Component = () => {
useEffect(effect as any, []);
return <div>Component</div>;
};
const unboundStoryFn = jest.fn(() => <Component />);
const showMain = jest.fn();

await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
expect(effect).toHaveBeenCalledTimes(1);
});

it('does remount the component when called with forceRemount', async () => {
const domElement = document.createElement('div');
const effect = jest.fn();
const Component = () => {
useEffect(effect as any, []);
return <div>Component</div>;
};
const unboundStoryFn = jest.fn(() => <Component />);
const showMain = jest.fn();

await renderToDOM({ unboundStoryFn, showMain } as any, domElement);
await renderToDOM({ unboundStoryFn, showMain, forceRemount: true } as any, domElement);
expect(effect).toHaveBeenCalledTimes(2);
});
});

0 comments on commit 0870bda

Please sign in to comment.