cypress-io / cypress-documentation

Cypress Documentation for the Cypress App, API, Cypress Cloud, UI Coverage and Cypress Accessibility.
https://docs.cypress.io
MIT License
955 stars 1.05k forks source link

We need a component test recipe for working with next/navigation in next 13+ #5595

Open muratkeremozcan opened 1 year ago

muratkeremozcan commented 1 year ago

What would you like?

The next12 example from Mike Plummer is nice, but needs to be updated for next13 https://github.com/mike-plummer/nextjs-cypress-ct-example/blob/9110384cc8a2fad869104ffb0c75b92990fb3e5b/cypress/support/component.js#L37

We need a way to make useRouter() work in a component test with next 13+.

This lib may be promising, https://www.npmjs.com/package/next-router-mock but they do not have support for next13+ yet https://github.com/scottrippey/next-router-mock/pull/103.

I have a spot next13 example this need can be reproduced at. https://github.com/muratkeremozcan/next-app-mosh/blob/b7fbcc5694ebd40fd8145b683f3c7de3fa1549b8/app/users/new/pageNewUserPage.cy.tsx#L4

Why is this needed?

Because we need docs and recipes to use Cypress features with the new tech.

Other

No response

scottrippey commented 11 months ago

Hi, I'm the developer for next-router-mock, and also a big fan of Cypress and Component testing.

I'm eager to get Next 13 support, and I've started a PR to add this support (as linked above). But since I'm not currently working on a Next 13 project, my knowledge and need for App Router support is not high.

I'd be thrilled to get help on this, so if you're interested in submitting a PR, please do.

And, so far, I've only added docs around using Storybook for component testing. If there's anything that Cypress Component tests need, please let me know, whether it's a feature or just docs.

jennifer-shehane commented 11 months ago

Moving to documentation repo since this is a documentation concern