title: firebase Stripe API failing on first payment process
body: <p>I have successfully integrated stripe and firebase, using the <code>Run Subscription Payments with Stripe</code>.</p>
  <p>Here's the flow:</p>
  <p>When I click register, it brings me to the Stripe Page, using this function:</p>
  <pre><code>  export async function createCheckoutSession(activtyStatus){
    let user = firebase.auth().currentUser;
    
        const checkoutSessionRef =  firestore
        .collection('customers')
        .doc(userID)
        .collection('checkout_sessions')
        .add({
          price: price,
          success_url: &quot;https://xxx/successPage&quot;,
          cancel_url: &quot;https://xxx/signin&quot;,
      });
        // Wait for the CheckoutSession to get attached by the extension
              (await checkoutSessionRef).onSnapshot(function (snap) {
                const { error, sessionId } = snap.data();
                if (error) {
                console.log(`An error occured: ${error.message}`);
              }
              if (sessionId) {
  
              //live key
              const stripe = window.Stripe('pk_livekeyxxxx');
              stripe.redirectToCheckout({sessionId})
              console.log(&quot;logged stripe&quot;)
            }
        });
      }
  </code></pre>
  <p>If successful, it goes to to my <code>SuccessPage</code>, which just checks if the subscriptions collection was created in firebase or not.</p>
  <p>so what happens is, if the payment is successful, it will just render <code>/clients</code> route, and if it isn't, it will redirect to <code>createCheckoutSession</code> function, which goes back to allow the customer to pay again. So when I enter the payment details on Stripe, SOMETIMES, it goes to clients and adds the subscription, and SOMETIMES, it redirects to the Stripe page, and makes me enter ti again, in which then it works.</p>
  <p>is this a bug in my code, or is firebase and stripe just finicky?</p>