Why is my module an empty {} when running Jest and importing an ESM module?

Viewed 227

I am importing the default import from a node_module package that exports an ESM module. I have set up my Jest/Babel so that it stopped complaining SyntaxError: Unexpected token import, but now that it is successfully importing the module, it turns out that the module is an empty object. Do I need to transform my code somehow? (P.S. It probably goes without saying, but the import is working fine in my app.) (P.P.S. I am using Create React App and TypeScript, in case it makes a difference.)

jest.config.js

module.exports = {
  moduleNameMapper: {
    '\\.(css|less)$': 'identity-obj-proxy',
  },
  preset: 'ts-jest',
  transformIgnorePatterns: ['node_modules/(?!(@micro-frontend-apps)/)'] // this successfully allows the ESM module to be imported without complaint
};

styles.ts (being tested)

import { theme } from '@micro-frontend-apps/design-systems-library';
import styled from 'styled-components';

const InputContainer = styled.div`
  .react-tel-input {
    font-family: ${theme.font.fontFamilyBrand}; // *theme is undefined here*
    li {
    ...
0 Answers
Related