v1.3.0
Notable updates:
Useful in visual test tools like Stroybook's Chromatic (https://chromatic.com/) or Percy (https://percy.io) where you need consistent data to render the same UI and prevent false positives.
You can set it when invoking createUseRelayMockEnvironment
:
const useRelayMockEnvironment = createUseRelayMockEnvironment({
// ... your other options
seed: 'my seed' // can be a string or number
});
And/or set it when using the hook:
const environment = useRelayMockEnvironment({
// ... your other options
seed: 123 // can be a string or number
});
Note: When it is set in both createUseRelayMockEnvironment
and useRelayMockEnvironment
, the seed
in useRelayMockEnvironment
takes priority.
When using a visual testing tool like Chromatic, you can enforce having consistent fake data by providing the seed
, instantInitialLoading
and/or forceInstantInitialLoading
options. We recommend passing these options at the global level, when invoking createRelayMockEnvironmentHook()
:
// useRelayMockEnvironment.(js | jsx | ts | tsx)
import { createRelayMockEnvironmentHook } from 'use-relay-mock-environment';
import isChromatic from 'chromatic/isChromatic';
const useRelayMockEnvironment = createRelayMockEnvironmentHook({
...(isChromatic()
? {
seed: 123, // can be anything you want (string or number)
forceInstantInitialLoading: true,
}
: {}),
// Add any other global options here (optional)
});
export default useRelayMockEnvironment;