gregberge / react-merge-refs

React utility to merge refs 🖇

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

This module fails react-script's jest testing.

bebbi opened this issue · comments

🐛 Bug Report

My .ts file that imports this module fails testing (yarn test) with a "misconfigured module" error.

To Reproduce

The following bash script reproduces this error:

#!/bin/bash
npx create-react-app my-app
cd my-app/src
yarn add react-merge-refs

echo "import { mergeRefs } from 'react-merge-refs'

const m = mergeRefs([])

export default function onSuccess() { return 'success' }
" > distTest.ts

echo "import distTest from './distTest'

describe('fails', () => {
  it('fails on importing', () => {
    expect(distTest()).toEqual('success')
  })
})
" > distTest.test.ts
yarn test

Run this script and get:

Jest encountered an unexpected token

Details:

/Users/somewhere/my-app/node_modules/react-merge-refs/dist/index.mjs:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){function o(f){return r=>{f.forEach(n=>{typeof n=="function"?n(r):n!=null&&(n.current=r)})}}export{o as mergeRefs};
                                                                                                                                                                              ^^^^^^

SyntaxError: Unexpected token 'export'

> 1 | import { mergeRefs } from 'react-merge-refs'
    | ^

Note: I've confirmed it fails in ^5.0.0 and ^4.0.0 versions of react-scripts

Expected behavior

All tests should pass!

Link to repl or repo (highly encouraged)

The reproduction is in the "To Reproduce" section.
Run the bash script above and directly see the error. Note it will create a folder my-app inside the running location.

Run npx envinfo --system --binaries --npmPackages react-merge-refs,react,react-dom --markdown --clipboard

 - OS: macOS 12.5.1
 - Shell: 5.1.16 - /usr/local/bin/bash
## Binaries:
 - Node: 16.13.2 - ~/.nvm/versions/node/v16.13.2/bin/node
 - Yarn: 1.22.19 - ~/.yarn/bin/yarn
 - npm: 8.3.0 - /usr/local/bin/npm
 - Watchman: 2022.01.03.00 - /usr/local/bin/watchman

This module is ESM only. Please refer to facebook/create-react-app#5241