Workaround: bad interaction btw Turbo and stripe iframe

Found this workaround here: https://github.com/hotwired/turbo/issues/270#issuecomment-1068130327

This js hack persists the original iframe object downloaded from stripe in the new body sent by Turbo (instead of using the new one, in the new body)

app/views/shared/_stripe_js.html.haml

@@ -3,3 +3,13 @@
     = raw render file: "spec/support/fixtures/stripejs-mock.js"
 - else
   %script{src: "https://js.stripe.com/v3/", type: "text/javascript"}
+  :javascript
+    // persist initial stripe iFrame DOM Object across turbo AJAX page requests
+    let stripeIFrameQuery = 'iframe[src^="https://js.stripe.com"]';
+    document.addEventListener('turbo:before-render', function (event) {
+      const stripeIFrame = document.querySelector(stripeIFrameQuery);
+      const newStripeIFrame = event.detail.newBody.querySelector(stripeIFrameQuery);
+      if (stripeIFrame && !newStripeIFrame){
+        event.detail.newBody.appendChild(stripeIFrame)
+      }
+    });