Testing a Next.js app

[leo-petrucci]

Hi all,

I want to get more experience with testing, however I'm having trouble figuring out where to start.

I have a Headless CMS built with Next.js, the code is fairly simple, but I would like to be able to test if any of my pages return any errors automatically.

The vast majority of these pages are created with dynamic routing so I'm not entirely sure how to do this.

Is this the right way to test in Next.js? Does anyone have any info on how to do it?

[rafaelalmeidatk]

The answer depends on what you want to test. If you want to test your integration with the CMS you might want to give a look at E2E tests with Cypress since the pages are dynamic you need to make sure to have at least one page in your CMS that is always available for tests purposes so they won't break every time the pages change.

[leo-petrucci]

The answer depends on what you want to test. If you want to test your integration with the CMS you might want to give a look at E2E tests with Cypress since the pages are dynamic you need to make sure to have at least one page in your CMS that is always available for tests purposes so they won't break every time the pages change.

Would it be a bad idea to get all routes from my API and then test each one for their response? How long would testing 100 pages take?

[rafaelalmeidatk]

Yeah it sounds like a bad idea 😅. But again, it depends on what you want to test, what you want to have confidence. If you want to test the integration with the CMS, then if one page works then ideally all of them will work too since they are dynamic pages. If one of them have some exclusive thing that could break, then you write a test case specific for this feature, and so on. You don't necessarily need to test all the pages because you are already testing the features that these pages use.

But if you want to make sure all the pages are working then yeah, no one is stopping you from doing it. I wouldn't use Cypress for this, it would take a lot of time for all these pages. It would be faster to use something like curl to request all the pages in parallel and check the content of the response. Since you will get a string with the content you can't do fancy things like interacting with the page but you can check that the page rendered without any errors