I have a page in my Phoenix app with some LiveView code. When you click a button, it shows the Stripe credit card modal form via a Hook. It looks roughly like this:
Hooks.StripeFormButton = {
mounted() {
this.el.addEventListener("click", () => {
showStripeForm({
onSuccess: (token) => {
this.pushEvent("save-card", {token: token})
}
})
})
}
}
So a user clicks the button, fills out the Stripe form, and when they submit it, the "save-card"
event gets sent to the back-end. That will save their credit card info and then render some info to show that the save was successful.
My problem is, since the click and the form submit are done through hooks instead of phx-click
and phx-submit
attributes, I can’t figure out a way to test them. I want to be able to write a test that says “after the "save-card"
event gets triggered, a confirmation message shows on the page”. But I can’t find a way to trigger the "save-card"
event in a LiveView test without using something like render_click
or render_submit
which won’t work since I’m not using phx-click
or phx-submit
for the Stripe form. Is there a push_event
testing function somewhere that I’m missing in the documentation? Or is there another way to do this?