Testing protected pages in cypress (e2E)
Hello, Is there a way to bypass the authentication process to e2e test pages and flows that are protected ?
I'm new to e2e testing and I see everywhere else that there are mechanism to mock the auth or authenticate the user programmatically.
Maybe I'm missing something.
I'm using The app router SDK.
15 Replies
We do e2e internally with a certain setup, let me ask the team and get you the details
Hi @Andre @ Kinde, to be clear I want to test my own pages that are behind the authentication wall. I don't want to test Kinde itself.
Understood, we dont yet have way for you to do e2e testing formally.
But another user, used this method, but not sure if it will work with your setup.
1. Changed dev env to password login
2. Created account using "fake" email address, (forwarded to main one)
3. Confirmed account
4. In code I've made a playwright fixture
await page.goto('/')
await page.waitForURL(${process.env.KINDE_ISSUER_URL}/auth/)
await page
.getByLabel('Email', { exact: true })
.fill('[email protected]')
await page.locator('button[type="submit"] >> text="Continue"').click()
await page.getByLabel('Password', { exact: true }).fill('*')
await page.locator('button[type="submit"] >> text="Continue"').click()
await page.waitForURL('/')
it's just standard code to login, plus I'm saving session state, so I'm reusing currently logged user as much as I can.
5. Im using it in my tests
test('John Bon sees "Hello" at home page header', async ({
johnBonSession
}) => {
await johnBonSession.goto('/')
await expect(johnBonSession.getByRole('heading')).toContainText('Hello')
})
Ohh nice, thank you @Andre @ Kinde !
Hey @Yvens,
We are looking into updating our docs on e2e testing.
Did you get a chance to try implementing e2e testing with Kinde with the information above? I am looking for feedback on whether the information above helped you implement e2e testing with Kinde?
Hi @Oli - Kinde I did not try it yet but it very make sense to me as far as I know about e2e
No worries. Thanks for getting back to me @Yvens
@Hi @Oli - Kinde finally took time to implement e2e testing with with the informations you gave me. It works like a charm.
I used the documentation here: https://playwright.dev/docs/auth
As so to load authenticate once for every test by saving the session state to a "playwright/.auth" created as stated in the docs. Let me know if you need more informations
Authentication | Playwright
Introduction
Thanks for getting back to me @Yvens and great to hear it worked.
Hello, so as of the moment still, e2e testing for protected pages based off of auth only works for email login?
Hey @gitgy,
Are you able to explain a bit more about what e2e tests you want to implement?
For now, I'd like to mock a user login, navigate to a protected page/route and do a simple (h1 tag) render test. This support ticket was created 7 months ago so I have no clue what progress has been made. I just looked up e2e testing keyword and found this!
However, I am only allowing for google login, not sure if that makes a difference.
Hey @gitgy,
I am sure I can help you out.
What SDK and SDK version are you using?
Thanks Oli. I am cuurently using Next.js App Router SDK v2
Hey @gitgy,
In that case, I would suggest posting in #💬┃general your use-case of wanting to implement e2e testing around mocking a user login, navigate to a protected page/route and do a simple (h1 tag) render test.
If you have no luck, let me know.