Skip to main content

Jest

Configure Jest to work properly with SVGR.

1. Create a mock file​

Create a mock file __mocks__/svg.js:

export default 'SvgrURL'
export const ReactComponent = 'div'

The above mock would support the following import syntaxes:

import logoURL from '../assets/logo.svg'
// and
import { ReactComponent as Logo } from '../assets/logo.svg'

2. Configure Jest​

In your package.json

"jest": {
  "moduleNameMapper": {
    "\\.svg": "<rootDir>/__mocks__/svg.js"
  }
}

or in your jest.config.js

module.exports = {
  moduleNameMapper: {
    '\\.svg$': '<rootDir>/__mocks__/svg.js',
  },
}

Your snapshots will include all properties on the icon components, so they will be tested.