Cypress with NextJS SSR - intercept RESTful API using Axios - next.js

I'm trying to write some tests with cypress and fixtures on my SSR next.js app that connects to RESTful API using Axios. But I'm having trouble intercepting the RESTful APIs using cy.intercept() because cypress can not track the requests that are sent in SSR and cy.intercept() only works on requests that cypress can track. Is there any way that can help me change the responses coming from RESTful API? any packages also would help.

cy.intercept relies on the in-browser API to capture requests. The requests you do in your SSR hooks in Next.js (such as getServerSideProps) do not happen in the browser so, respectively, cy.intercept doesn't know anything about them.
I'm biased when it comes to API mocking solutions, but I still encourage you to look into MSW once again. See the official Next.js example, which supports both browser-side and server-side request interception using the same request handlers. The README also goes into detail about the key steps necessary for both interceptions to work.
This kind of interception embeds MSW into the Next.js app. This means that you won't be able to have runtime request handlers without either restarting the runtime or exposing the worker/server instance to the testing context. This may not be an issue for you per se, so you may disregard this mention until you know it's relevant to your testing setup.

Related

Is it possible to use NEXT.JS API Routes with GraphQL subscriptions?

I'd like to use NEXT.JS API routes with GraphQL subscriptions, but I can't find any information on the subject.
I know that the NEXT.JS API routes (deployed to Vercel) use cloud functions under the hood, and the cloud functions are only executed when you make a request and after a while they turn off.
Does it work well with sockets that seem to be used by third party libraries (graphql-yoga, apollo-server) to make subscriptions work?

Relay and Apollo Client both can be used?

I'm developing a front-end with Next.js where GraphQL will be processed from GraphQL API endpoint. Hasura is being used as Back-end.
One of my colleague told me that some developers use Relay along with
Apollo Client. I told him that why we should use both? If Relay is used then
stick exclusively to Relay (no need to use Apollo also).
My questions are:
Can really both be used in a single project?
If i go with only Apollo Client what will be the consequences? (i have gone through documentation of Relay but found it really complex to integrate with Next.js).
Is there really need of Redux along with Apollo Client? (It's a market place website, lot of data with pages).

Performance issues on Next.js SSR building initial page from api

We have developed a Next.js app. The home page takes several seconds (7s) before initial load, thereafter requesting any additional artifacts. We call the menu and a headless api for the body. The API is fronted with Cloudflare and is part of getServerSideProps. We do use proxy middleware to call the apis.
How can we identify long running threads on SSR? Any performance optimization tips we can use?

Avoid spamming to my API that build with Firebase Function

I am building some internal API for my apps/website with Firebase Functions. Internal API as in to let my apps/website to process something on server side, its doesn't mean to open to public use.
My Apps is built with ionic and website is built with angular.
I noticed the one of Firebase Functions Pricing calculation include "Invocations". Is that Invocations means every time when I call the API equal to 1 Invocation? If yes, then the API might be abused by end user, since they able to view the website source and found the API.
I been searching solution in google, some of them suggest to enable authentication and cors, to avoid abuse of the usage. But authentication and cors still counting the Invocations right?
My code structure:
client call API by get/post method, pass user TOKEN that get from Firebase Authentication
request reach the Firebase Functions
server will check the preflight info by using CORS, as well as validate the TOKEN.
Return error if didn't pass on the (3), else proceed to execute the function.
So I assume if end user inspect my web source code and get the API URL, they can simply spam my API right? Then my bill will burst because of the load of Invocations.
If you suspect that your project is being abused, which is always possible, contact Firebase support to work towards a resolution.

Firebase communication with Google Apps Script

I know that we can use a Firebase backend function to send an HTTP request to Google Apps Script and receive it using "doGet()".
However, is it possible to call a Google Apps Script function from Firebase without sending an HTTP request (since it's part of the same Google account)?
My concern is with security, where one may be able to guess/sniff the right URL/parameters and then execute the Google Apps Script function (which makes a purchase). Alternatively, there may be a proper way to secure GAS web apps.
There are quite some details missing. But I think you're asking of a Google Cloud Functions/Cloud Functions for Firebase can call into an Apps Script web app or a Apps Script REST API. The answer is that they indeed can invoke those URLs (if they're publicly accessible and fall within your quota).
But that is no more security risk than that any browser can invoke these URLs. The security should not come from knowing or being able to call the URLs. If you want to secure an API, you should implement proper security on it. For more on see Authorization for Google Services in Apps SCript

Resources