Hi Everyone,
I am currently handling the integration of Netlify Identity for authentication on one of my company’s products. Everything works great!
However, I would like to know if it is possible / how to write E2E tests to improve code coverage of the authentication process. I know this has to do with testing DOM manipulations.
I have tried this with Cypress but since the auth window is injected into the DOM, the Cypress test runner can’t find it. I also tried to target the DOM element to which the Netlify window is attached to i.e #document , but this still doesn’t work.
Tech Stack: Vue and Cypress
Anyone who can help or point any useful link that discusses this?
Greetings @vickywane! 
I don’t really have much of an answer for you — I haven’t really heard of folks wanting to E2E with embedded, third party components like that. I’m not a wiz of headless browser testing tools, but that sounds tricky. As an aside (and I know not the goal of your question), have you considered just writing your own auth UI and using a Netlify Identity SDK in your own code instead of using the NID-Widget? gotrue-js (for not-react stuff) and react-netlify-identity-gotrue (for react stuff) can both provide drop-in functionality there. Just a thought.
–
Jon
Yes, the solution was to create an Auth UI using the gotrue-api then test it.
1 Like