Jest is not ignoring .hbs files - jestjs

Goal: To have Jest NOT run in .hbs files.
Attempted Solution: I tried including `"testPathIgnorePatterns": [".hbs"] in my config.json.
Error:
Test suite failed to run
/Users/.../employee.hbs: Unexpected token (1:0)
> 1 | <div class="employee">
| ^

Have you tried to use this modulePathIgnorePatterns
https://facebook.github.io/jest/docs/configuration.html#modulepathignorepatterns-array-string

Related

Module Parse Failed: You may need an appropriate loader to handle this file type. ReactJS Error

I am trying to utilise AccordionJS npm in my project. However, when I try to compile the app I get this odd error that I have no idea how to react to:
Here is the error:
`Failed to compile.
./~/react-bootstrap/esm/Accordion.js
Module parse failed: C:\Users\userjohndoe\Desktop\book-app\node_modules\react-bootstrap\esm\Accordion.js Unexpected token (23:4)
You may need an appropriate loader to handle this file type.
| flush,
| alwaysOpen,
| ...controlledProps
| } = useUncontrolled(props, {
| activeKey: 'onSelect'`

Jest fails to parse TSX in preact

I'm trying to run tests with Jest and enzyme in a Preact app with TypeScript.
I get a Jest encountered an unexpected token error :
FAIL src/app/app.test.tsx
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse,
e.g. it's not plain JavaScript.
...
Details:
src/app/app.test.tsx:10
const wrapper = enzyme_1.mount(<app_1.default optOutUrl="none"/>);
^
SyntaxError: Unexpected token <
at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1059:14)
After seen TypeScript example in this repository, I Changing jsx option to react in tsconifg.json. But It not helpful for my project environment:
Cannot find module 'react' from 'styled.js'
However, Jest was able to find:
'./styled.js'
'./styled.js.flow'
'./styled.js.map'
See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string
at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:276:11)
at Object.<anonymous> (node_modules/linaria/src/react/styled.js:3:15)
In the above error, it says that react parsing failed in the styled component related file. (I’m use styled components from linaria/react with custom Preact typing.) this issue not appear in development and production environment.
I also tried using babel-jest with below config.
“transform”: {
“^.+\\.t(s|x)$”: “babel-jest”
}
FAIL src/app/app.test.tsx
● Test suite failed to run
src/app/app.tsx: Cannot find module 'react'

NuxtJS build breaks with UglifyJS and node-rsa. How do I resolve this?

I'm using the library node-rsa (https://www.npmjs.com/package/node-rsa) in a NuxtJS project. When building for production using the command nuxt build (which includes minification of JS and CSS by default), the build process breaks near the end with the following message:
ERROR in 0.nuxt.bundle.7c6932a7a42bdaaa7fa4.js from UglifyJs
Unexpected token: name (pem) [./~/node-rsa/src/formats/pkcs1.js:55,0][0.nuxt.bundle.7c6932a7a42bdaaa7fa4.js:42640,20]
Error: Webpack build exited with errors
at /home/ubuntu/front-end/node_modules/nuxt/dist/nuxt.js:904:44
at /home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:267:15
at Compiler.emitRecords (/home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:362:37)
at /home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:260:12
at /home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:355:11
at next (/home/ubuntu/front-end/node_modules/tapable/lib/Tapable.js:154:11)
at Compiler.compiler.plugin (/home/ubuntu/front-end/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
at Compiler.applyPluginsAsyncSeries1 (/home/ubuntu/front-end/node_modules/tapable/lib/Tapable.js:158:13)
at Compiler.afterEmit (/home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:352:8)
at Compiler.<anonymous> (/home/ubuntu/front-end/node_modules/webpack/lib/Compiler.js:347:14)
at /home/ubuntu/front-end/node_modules/async/dist/async.js:460:16
at iteratorCallback (/home/ubuntu/front-end/node_modules/async/dist/async.js:1034:13)
at /home/ubuntu/front-end/node_modules/async/dist/async.js:944:16
at /home/ubuntu/front-end/node_modules/graceful-fs/graceful-fs.js:43:10
at FSReqWrap.oncomplete (fs.js:117:15)
I was able to temporarily mitigate the issue by disabling uglifyJS (solution found at https://github.com/nuxt/nuxt.js/issues/250) but that does not seem like a long term solution. What is the correct way to resolve this?
Potentially related issue: Webpack breaks when i include node-rsa library
The problem is that I was trying to use a node library (not uglify-safe) on the browser without webpacking it. I switched to using pure JS for my crypto needs and everything went fine.

Webpack Error: Cannot find module "."

I am using the api from musixmatch-sdk and have an error by building my project with webpack.
I am using webpack 2, react, node.
The default import on the musixmatch site is:
var MusixmatchApi = require('../../build/javascript-client/src/index');
But this does't work and getting this error:
ERROR in ./build/javascript-client/src/index.js<br/>
Module not found: Error: Can't resolve 'ApiClient' in '/Users/myname/lyrix/build/javascript-client/src'<br/>
# ./build/javascript-client/src/index.js 28:4-2099<br/>
# ./src/server.js
So I have wrote it with an absolute path like:
const MusixmatchApi = require(path.join(__dirname,'../build/javascript-client/src/index'));
This works in development mode of webpack, but i get this warning:
WARNING in ./src/server.js
33:20-102 Critical dependency: the request of a dependency is an expression
# ./src/server.js
So if I want to build the production project i get the error:
Error: Cannot find module "."<br/>
at /Users/myname/lyrix/src/server-es5.js:1:16712<br/>
at Object.<anonymous> (/Users/myname/lyrix/src/server-es5.js:1:16782)
Can you please help me?

AVA Test Runner Setup with Create React App Boilerplate

Trying to setup AVA after running create-react-app. There are a few tutorials and references of this gist I've found and tried, but I keep getting an unexpected token error on the JSX <App /> element. Anyone know what is wrong with that gist? Full output of npm run test:
react-with-ava#0.1.0 test /react-with-ava
cross-env NODE_ENV=test ava
1 exception
Uncaught Exception
SyntaxError: /react-with-ava/src/App.test.js: Unexpected token (8:18)
SyntaxError: /react-with-ava/src/App.test.js: Unexpected token (8:18)
6 | test('renders without crashing', t => {
7 | const div = document.createElement('div');
8 | ReactDOM.render(<App />, div);
| ^
9 | });
It is neither supported nor recommended to use Ava with Create React App.
The created project already contains a test runner (Jest) which we recommend to use. Run npm test in the project folder to start.
In theory you could get Ava to work but this would require configuring Babel which will get confusing in a CRA project very quickly. If you insist on using Ava you can npm run eject and then replace Jest with Ava manually in the ejected project.

Resources