fix(clerk-js): Better Stripe Elements error handling

Author: aeliox

.changeset/petite-sites-see.md

@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': patch
+---
+
+Fix Stripe Elements error handling

packages/clerk-js/src/ui/components/PaymentSources/AddPaymentSource.tsx

@@ -246,18 +246,18 @@ const AddPaymentSourceForm = ({ children }: PropsWithChildren) => {
     card.setLoading();
     card.setError(undefined);
 
-    try {
-      const { setupIntent, error } = await stripe.confirmSetup({
-        elements,
-        confirmParams: {
-          return_url: '', // TODO(@COMMERCE): need to figure this out
-        },
-        redirect: 'if_required',
-      });
-      if (error) {
-        return; // just return, since stripe will handle the error
-      }
+    const { setupIntent, error } = await stripe.confirmSetup({
+      elements,
+      confirmParams: {
+        return_url: '', // TODO(@COMMERCE): need to figure this out
+      },
+      redirect: 'if_required',
+    });
+    if (error) {
+      return; // just return, since stripe will handle the error
+    }
 
+    try {
       await onSuccess({ stripeSetupIntent: setupIntent });
     } catch (error) {
       void handleError(error, [], card.setError);