Community
Select to view content in your preferred language

Jest encountered an unexpected token, SDK 4.32, React 18

86
1
Thursday
clu_yo
by
New Contributor
Thursday

I have added @ArcGIS/maps-components-react 4.32.14 to our React 18.3.1 project. I am having issues running Jest tests on the new component. 

clu_yo_2-1749138776477.png

Static class blocks are not enabled. Please add `@babel/plugin-transform-class-static-block` to your configuration

clu_yo_3-1749138803963.png

clu_yo_4-1749138823679.png

 

This error is saying that @babel/plugin-transform-class-static-block is not enabled. But that package is included in '@babel/preset-env' (babel-plugin-transform-class-static-block )

I went ahead and tried to install it separately as a dev dependency anyway and add static block to the babel.config.js below:

module.exports = {
  presets: [
    ['@babel/preset-env', { targets: { node: 'current' } }],
    '@babel/preset-react'
  ],
  plugins: [
    '@babel/plugin-transform-class-static-block',
    '@babel/plugin-transform-class-properties'
  ]
}




The project adds configurations through the script/cli options:  

"react-scripts test --silent --coverage --setupFilesAfterEnv='./src/.setupTests.js' --transformIgnorePatterns \"node_modules/(?!(@arcgis|@esri/calcite-components|@stencil/core|primereact|primeicons|primeflex|axios)/)\""

 

0 Kudos
1 Reply
clu_yo
by
New Contributor
Thursday

The babel.config.js file is doing nothing. Since the project is a CRA, the project will not read external config files. It is all managed by CRA. 

CRA includes @babel/preset-env, which itself contains "@babel/plugin-transform-class-static-block": "^7.27.1". Not sure then how I am suppose to add class static blocks to a config file if it is supposed to already be included and I can't edit the config file of a CRA.

 

0 Kudos