i am stuck here for a while now.

I have this simple button in vanilla

                <td><button class="button_accept" onclick="acceptInvite(event, 0)" type="submit">accept</button></td>

It fires this script:

async function LoadPaymentController(){
  var stripe = Stripe('testKey');
// Call your backend to create the Checkout Session
fetch('/create-checkout-session', {
  method: 'POST',
})
.then(function(response) {
  return response.json();
})
.then(function(session) {
  return stripe.redirectToCheckout({ sessionId: session.id });
})
.then(function(result) {
  // If `redirectToCheckout` fails due to a browser or network
  // error, you should display the localized error message to your
  // customer using `error.message`.
  if (result.error) {
    alert(result.error.message);
  }
});
}

But whenever I click this, firefox tells me that:

Stripe.js requires 'allow-same-origin' if sandboxed.

I spoke to a dev from the stripe team and I googled my ass off and it always says that I have to add the sandbox="allow-same-origin" attribute to my iframe.

But I am not using an iframe.

Adding this attribute to everything else also didnt work at all.

What am I missing?

I tried:

  <meta http-equiv="Content-Security-Policy" content="allow-same-origin">

  <script src="https://js.stripe.com/v3/"></script>

To no avail