import runSetup from './src/setup' SyntaxError: Cannot use import statement outside a module

[nogashimoni]

Steps to Trigger Behavior

1. I run a test (using react-scripts test) that fails when running this line:
   import DrawControl from 'react-mapbox-gl-draw';
2. It fails saying:

`..../node_modules/@mapbox/mapbox-gl-draw/index.js:1
({"Object.":function(module,exports,require,__dirname,__filename,global,jest){import runSetup from './src/setup';
^^^^^^

SyntaxError: Cannot use import statement outside a module

  at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
  at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
  at Object.<anonymous> (../react-ui-components/node_modules/react-mapbox-gl-draw/lib/index.js:13:42)`

3. I don't use mapbox-gl-draw directly, I use it using react-mapbox-gl-draw

Expected Behavior

Test shouldn't fail when importing mapbox-gl-draw

Actual Behavior

Test fails when importing mapbox-gl-draw

Notes

I belive it's related to this issue

"react-mapbox-gl": "^4.7.3",
"react-mapbox-gl-draw": "^2.0.3",
"@mapbox/mapbox-gl-draw": "^1.1.2",
"mapbox-gl": "^1.5.1",

browser: jsdom-fourteen provided by jest

[nrgapple]

Any update on this? This package is not usable in Next js currently

[nogashimoni]

@nrgapple If that helps, for now as a quick-fix I've locked the version of mapbox-gl-draw:
"@mapbox/mapbox-gl-draw": "1.1.2"

[nrgapple]

@nogashimoni awesome! I'll try that

EDIT: Seems to do nothing on my side. Does react-mapbox-gl-draw need to be lowered also?

"react-mapbox-gl-draw": "^2.0.4",
"@mapbox/mapbox-gl-draw": "1.1.2"

EDIT 2: So I downgraded to all the packages you have above and locked the version of mapbox-gl-draw:

"mapbox-gl": "^1.5.1",
"@mapbox/mapbox-gl-draw": "1.1.2",
"react-mapbox-gl": "^4.7.3",
"react-mapbox-gl-draw": "^2.0.3",

I am getting:

error - ./node_modules/mapbox-gl/dist/mapbox-gl.css
Global CSS cannot be imported from within node_modules.
Read more: https://err.sh/next.js/css-npm
Location: node_modules/react-mapbox-gl/lib-esm/map.js

[nrgapple]

Here is a sandbox with the error in it: https://codesandbox.io/s/react-mapbox-gl-draw-error-chdf9