Hello im trying to find to build a application on my pipeline using integrations tests with Jest version 27.5.1 as well as jest-cli 27.5.1 all the tests work on my localhost however when my code runs through the Pipeline it shows the following Error
FetchError: request to http://localhost/callback?usid= failed, reason: connect ECONNREFUSED 127.0.0.1:80
and if i add a skip to this test the next test breaks as well
I've tried reading the documentation of jest to see if the root of the problem could be syntax i changed the Url where im doing the request for the API and also cleared added on the function afterEach() server.resetHandlers() as well as LocalStorage.clear() to clear up anything that might be considered Old data
Related
We are unit testing our react app using Jest and React Testing Library. And we get some of this "classic" errors :
console.error
Warning: A suspended resource finished loading inside a test, but the event was not wrapped in act(...).
When testing, code that resolves suspended data should be wrapped into act(...):
act(() => {
/* finish loading suspended data */
});
/* assert on the output */
But some Some developers simply ignore the error of this type. So, as time passes, the tests output is bloated with warning like that. And our tests feel less confident.
Is there a config in Jest or in React Testing Library that turns this kind of warning in error and makes the unit tests fail ?
I search in Google and found a lot of (good) articles to solve the warning but not to turn it into real error.
You can use the [jest-fail-on-console]: https://www.npmjs.com/package/jest-fail-on-console npm package to make the tests fail on console.error, console.warning.
I have a React-Webpack project of medium complexity that uses a typical chain of TypeScript/Webpack-dev-server, Jest and related tools.
The setup is very similar to create-react-app, but it deviated a bit over the time: https://github.com/facebook/create-react-app/
If there exists a compilation-error or ESLint-error in the web-served TypeScript files, then Webpack rejects both the build and the live reload. This is the expected behavior.
However, if there are one or more non-compiling tests, then Webpack ignores the tests and continues to serve the web-code!
This is highly problematic because it leads to a situation where broken tests get pushed to our Git-repo again and again.
What I want to do:
How can I induce a failure of both builds and live reload if there exists a test with compilation-errors or ESLint-errors?
Note that all those tests are running in Node.js via the Jest test execution framework, whereas the actual app runs in the browser.
Preliminary investigation:
It seems that WebPack ignores all tests because of the following reportFiles configuration for ForkTsCheckerWebpackPlugin:
reportFiles: [
'**',
'!**/__tests__/**',
'!**/?(*.)(spec|test).*',
'!**/src/setupProxy.*',
'!**/src/setupTests.*',
],
If I remove the '!**/__tests__/**' and '!**/?(*.)(spec|test).*', then I get the desired build failures (but not live reload failures). However, this might lead to a whole new bunch of problems.
We are trying to upgrade our react project to latest packages including relay (7.0.0). Our application builds and works but we are getting this error message in the console (during build) on every file where we import graphql from 'babel-plugin-relay/macro'. We are doing exactly like documented here adding relay
The error is "There was an error trying to load the config "relay" for the macro imported from "babel-plugin-relay/macro. Please see the error thrown for more information." It is coming from \node_modules\babel-plugin-macros\dist\index.js in getConfig( ).
To understand how other projects were configured, I downloaded another sample relay project / installed it and it had the same problem. Interesting enough there was this recent post in that app's issues list error loading config
The solution noted worked for me (adding that noted .babel-plugin-macrosrc.yml file with empty relay plugin?) but I am not understanding why this is needed or what was causing this seemingly benign error message?
I created a react project using create-react-app however when ran yarn test to see if the initial tests pass I get
TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (/home/ubuntu/wonderland/hackernews/node_modules/whatwg-fetch/fetch.js:436:16)
at XMLHttpRequest.callback.(anonymous function) (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:289:32)
at invokeEventListeners (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:219:27)
at invokeInlineListeners (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:166:7)
at EventTargetImpl._dispatch (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:122:7)
at EventTargetImpl.dispatchEvent (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:87:17)
at XMLHttpRequest.dispatchEvent (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:61:35)
at XMLHttpRequest.abort (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:405:16)
at Object.abort (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/xhr-utils.js:315:13)
at RequestManager.close (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/living/nodes/Document-impl.js:146:21)
at Window.close (/home/ubuntu/wonderland/hackernews/node_modules/jsdom/lib/jsdom/browser/Window.js:362:29)
at JSDOMEnvironment.dispose (/home/ubuntu/wonderland/hackernews/node_modules/jest-environment-jsdom/build/index.js:44:19)
at Promise.resolve.then (/home/ubuntu/wonderland/hackernews/node_modules/jest-cli/build/runTest.js:102:17)
I'm working in Cloud9 editor using ssh connected to my dev server (Ubuntu) hosted in AWS. Tests are working fine in my local machine (Ubuntu).
Thanks for the help!
I already solve my problem. I'm following a book entitled "The Road to Learn React" and I think that the one causing my error is the part where I fetch data from an external API. The book forgot to include an import for fetch which is this one:
import fetch from 'isomorphic-fetch'
Then, it solves my problem like a charm.
How to make Angular2 code written in typescript run in spring-tool-suite?
I can run the Angular 2 code written in javascript in spring-tool-suite, but in case of typescript, I am facing a lot of problems in the form of:
1. NOT FOUND errors
I am attaching a screen shot for the error
The errors you are getting (404 on javascript files) points that the backend (web server) is not configured correctly.
Potential Fix
Give webpack a go so that you only need to load a single bundle.js instead of having to over configure a web server backend.