Testing

All platforms

2.5.0

Unistyles ships with own mocks that will help you to test your components that consume useStyles and createStyleSheet.

Using mocks

In order to use the library mocks you need to either use jest or set process.env.NODE_ENV to test.

"scripts": {
  "start": "react-native start",
  "test": "NODE_ENV=test vitest"
},

Alternatively, you can import your Unistyles themes into jest.setup.js.

jest.setup.js

import '../unistyles';

NativeEventEmitter

To mock NativeEventEmitter that is imported internally from react-native you can use the following code:

1. Create jest.setup.js file:

jest.mock('react-native/Libraries/EventEmitter/NativeEventEmitter');

2. If you use jest.config.js:

module.exports = {
    preset: 'react-native',
    setupFiles: ['./jest.setup.js'],
};

3. If you use jest in package.json:

{
  "jest": {
    "preset": "react-native",
    "setupFiles": ["./jest.setup.js"]
  }
}

Testing on web with JSDOM

When utilizing JSDOM for testing purposes, it is required to provide the implementation for window.matchMedia, as this functionality is absent in JSDOM, yet it is a dependency for Unistyles.

For a comprehensive approach, refer to the official jest documentation on mocking methods that are not implemented in JSDOM.

Support

Mocks support basic operations and are designed to mimic the setting of themes and breakpoints. However, some operations, such as using plugins or adaptiveThemes, are not supported.