I am searching to write correct and understandable tests on react. I have read a lot of articles and texts. But I haven't understood a few matters. I have a component which request with axios. So there are requests like GET, POST.
How should the backend behave during frontend testing? Should the backend switch to test mode after frontend tests started ? Should the database reset itself after each frontend test ?
I think I shouldn't mock API to check if component correct render. What is the correct logic ?
The way that I approach this will be to mock the API call, the reason to do that will be, that I am reducing my scope of testing, As I am testing the React part, I would mock the success response and mock the error response and check how my components are working.
For the API testing, I will create a separate test case on the backend side. This way there will separation of concern. That is when I am testing react side I limit myself to the react side only and also this will make your test run fast as you are mocking the response, the actual request will not be sent and so you will get the response quickly.
Related
I'm trying to figure out the best way of running GraphQL queries in the getServerSideProps of a Next.js app.
Since the GraphQL server is running on the same Next.js instance, the obvious solution is to run apolloServer.executeOperation() on the getServerSideProps function of my pages.
However, I'm worried about this solution because:
The documentation of executeOperation describes it as an integration tests function. It literally says "The executeOperation method provides a single hook to run operations through the request pipeline, enabling the most thorough tests possible without starting up an HTTP server.". But it doesn't say it should only be used for testing.
Pretty much all online Guides I find online about running GraphQL on Next.js says I should use an apollo client (Example). However, running an Apollo Client on the same server as my GraphQL server seems like an obvious unnecessary overhead.
Which leads me to think I maybe missing something obvious.
Is it OK to call apolloServer.executeOperation on my Next.js getServerSideProps?
We run a basic async fetch on the getStaticProps, in our Next app, a formatted response gets passed to the Home component and used to setup the redux store.
I imagine that if you were to do a graphql request you would need to init the graphql client before you can use it - which happens later in the call chain for us, and i imagine you. You could maybe do your GQL client setup server side and pass the object by props to Home, but doesn't seem like thats the intended use.
I'd say if you need to server side request with GQL, create a client getServerSideProps and close it after your request, don't see much of an issue with that.
A novice javascript developer here!
A have a basic question on whats the best and secured way to make HTTP calls from a front application to a backend service that needs an authentication. My application is a SPA (using Vue.js) & getting data from Java services. Java services need authentication details and return sensitive user data.
I see there are a few options and I wanted to understand a better approach amongst all 3-
Making direct HTTP calls from javascript code- Concern for using this approach is, as Javascript code can also be viewed via dev tools in browser, wont it be easier for anyone to do an inspect and view all critical authentication details hence making overall integration less secure?
Making an HTTP call using Axios via Vue framework- Seems like Axios is Promise based HTTP client for the browser that lets you easily make HTTP calls without much code overhead. but is this secure? is Javascript code loaded in the browser? Or the front end code sends the request and axios makes the request from backend server where the application is hosted?
Using Node- If front end application has unique routes configured for each API call and in my application if I have a route mapping to use request module and node js backend code to make those HTTP calls, is that going to be a robust and secure way of integration?
Please let me know your thoughts and apologies if this is a dumb question!
Not dumb at all. You're just learning.
My first question to your answer 😅 will be: is your application server-side rendered or it's sap + backend?
If it's server-side rendered then I would say it's secured since Node will be sending pages with all required data. On the dev tool, you will only see static files being loaded.
However, if it's SAP, I am not sure whether there is a way to hide whatsoever you send to the server from the dev tool. The only one thing you will need to do is to make sure you encrypt whatever is sensitive to your application.
im trying to make a website using express, and in this website i request some data from an external API.
So, i have an html where i "send" the request. How do i take that parameters for the request into the server, and then the response to the html or at least the js linked to that html?
To this point, i already tested how to add an html with a js linked to it, and it worked, so now i have to make the rest of the web concept, that is request data from the API.
Sorry if i dont have the code, but im still making it and i have this big issue that i cant resolve.
Thanks for your time and advice anyways
You have two choices.
Either you make an ajax request to the api from the front-end or in the back-end and render the result.
You can also make a request from the front-end, send the result to the back-end and have express send a different response.
No code attached as your question is very generic.
So, I have been searching everywhere and can't find any hints on this.
I have a REST API built with express that will be consumed by a website and in the future a mobile app.
I have to build the website and want to use react/redux, and I'm struggling to understand how to avoid the initial state to be render from server because I will have nested components and a lot of async data, and it will become a mess to maintain code both client- and server-side. Is there any solution/alternative for this?
Thanks in advance.
You don't necessarily need server-side rendering to solve this problem. You can make your components load with a blank state and then immediately fetch your data.
According to the React docs, your ajax requests should be made in the componentDidMount() lifecycle method, which fires once as soon as your initial render is complete.
If you want to ... send AJAX requests, perform those
operations in this method.
For example, you don't load your app if a user isn't authenticated, or you put up loading spinners to indicate that data is being fetched.
I am building an app with locomotive.js, and I am looking to build my test suite using the Mocha test framework. I am also new to TDD/BDD in general, so please take that into consideration. I am curious if anyone can point me in a good direction to start testing a locomotive based app.
My biggest question would be:
How do I test a controller's actions?
Can I test an initializer?
Are there best practices around creating test request objects?
Testing controller actions
It depends on what exactly you want to test. Controller actions usually either return content, or pass (perhaps in case of errors) the request along the server stack, so testing them means using something like supertest to check for the correct responses (the supertest page also mentions how to use it together with Mocha)
Can I test an initializer?
Testing an initializer by itself is difficult, because they require to be run within the context of a LocomotiveJS application. However, you could create a test just booting up the application, which during the booting process will also run all initializers. I just added a simple Mocha-based testing framework to my Locomotive + Sequelize boilerplate project which shows how to boot the Locomotive app from within Mocha.
Are there best practices around creating test request objects?
If you mean how you can check responses to requests, look at the aforementioned supertest or perhaps mocha-headless.