Guides

Animations

Spring animations is slow during unit testing, and may not work correctly in screenshot tests because the animation doesn’t run on server-side. To remove the spring animations, you can do:

import { setConfigs } from '@seaweb/coral/utils/configs';


setConfigs({ skipSpringAnimation: true });

If you’re using Jest, you add these lines on the file for setupFilesAfterEnv on jest.unit.conf.js.

Portal Containers

React Portal doesn’t work on server-side. By default, Coral’s components that is using portals, like Dialog and Tooltip, will use the container element based on where it renders:

• On client-side, a new HTML element will be created under body
• On server-side, no portal is created and will be inline rendered

To override this default, you can do like:

import { setConfigs, defaultGetPortalContainer } from '@seaweb/coral/utils/configs';


setConfigs({
  getPortalContainer: (componentName, propName, options) => {
    if (componentName === 'SelectList') return null;
    return defaultGetPortalContainer(componentName, propName, options);
  },
});

This will set SelectList to be rendered inline regardless of being rendered on client or server-side. Note that you can still set the container of individual SelectList through container prop.