I got some issues with testing Livewire components using cypress. Seems like the elements are not available in the DOM when cypress is looking for them. Has anyone got it working and if so, how did you get it to work?
I dont know much about livewire, but use cypress a lot. It could be the way you have written the cypress test, as they can be quite particular in the way they are written. Post the test code that is not working. I imagine the test is running before the page elements are ready and so it is failing.
I can't think of any reason why Cypress and Livewire wouldn't play nicely together.
Cypress interacts with your app just like a user would. So, if it's not working, there must be something odd in your spec file, as @squibby noted. Is there a basic test you can share with us?
I am having a go at this again this weekend (private project) and will update. But i normally use Cypress a lot and never have any issue.
It's just a simple test like the following:
describe('Ecommerce', () => {
it('Is possible to add an item to cart.', () => {
cy.viewport(1440,900)
cy.visit('http://mytestsite.test/shop')
cy.get('[data-cy="tshirt"]').click()
})
})
The interesting part, is when i use the GUI and the select tool to get the cy.get link, it isn't possible to select the button even. Only the wrapper around the list of products. Unfortunately it's midnight here so was heading to sleep when i saw i had replies. But i will do some investigation and update the thread probably friday or saturday.