Switch to console.error so we get a bugsnag alert everytime a user has a problem with their card

Add paymentMethodsAPI specific mapping function, we had some errors in production with mastercards probably caused by ActiveMerchant not handling the card type correctly

app/assets/javascripts/admin/payments/services/stripe_elements.js.coffee

@@ -14,10 +14,10 @@ angular.module("admin.payments").factory 'AdminStripeElements', ($rootScope, Sta
       @stripe.createToken(@card, cardData).then (response) =>
         if(response.error)
           StatusMessage.display 'error', response.error.message
-          console.log(JSON.stringify(response.error))
+          console.error(JSON.stringify(response.error))
         else
           secrets.token = response.token.id
-          secrets.cc_type = @mapCC(response.token.card.brand)
+          secrets.cc_type = @mapTokenApiCardBrand(response.token.card.brand)
           secrets.card = response.token.card
           submit()
 
@@ -30,16 +30,16 @@ angular.module("admin.payments").factory 'AdminStripeElements', ($rootScope, Sta
       @stripe.createPaymentMethod({ type: 'card', card: @card }, @card, cardData).then (response) =>
         if(response.error)
           StatusMessage.display 'error', response.error.message
-          console.log(JSON.stringify(response.error))
+          console.error(JSON.stringify(response.error))
         else
           secrets.token = response.paymentMethod.id
-          secrets.cc_type = @mapCC(response.paymentMethod.card.brand)
+          secrets.cc_type = @mapPaymentMethodsApiCardBrand(response.paymentMethod.card.brand)
           secrets.card = response.paymentMethod.card
           submit()
 
-    # Maps the brand returned by Stripe to that required by activemerchant
-    mapCC: (ccType) ->
-      switch ccType
+    # Maps the brand returned by Stripe's tokenAPI to that required by activemerchant
+    mapTokenApiCardBrand: (cardBrand) ->
+      switch cardBrand
         when 'MasterCard' then return 'master'
         when 'Visa' then return 'visa'
         when 'American Express' then return 'american_express'
@@ -47,6 +47,14 @@ angular.module("admin.payments").factory 'AdminStripeElements', ($rootScope, Sta
         when 'JCB' then return 'jcb'
         when 'Diners Club' then return 'diners_club'
 
+    # Maps the brand returned by Stripe's paymentMethodsAPI to that required by activemerchant
+    mapPaymentMethodsApiCardBrand: (cardBrand) ->
+      switch cardBrand
+        when 'mastercard' then return 'master'
+        when 'amex' then return 'american_express'
+        when 'diners' then return 'diners_club'
+        else return cardBrand # a few brands are equal, for example, visa
+
     # It doesn't matter if any of these are nil, all are optional.
     makeCardData: (secrets) ->
       {'name': secrets.name,

app/assets/javascripts/darkswarm/services/stripe_elements.js.coffee

@@ -16,10 +16,10 @@ Darkswarm.factory 'StripeElements', ($rootScope, Loading, RailsFlashLoader) ->
           Loading.clear()
           RailsFlashLoader.loadFlash({error: t("error") + ": #{response.error.message}"})
           @triggerAngularDigest()
-          console.log(JSON.stringify(response.error))
+          console.error(JSON.stringify(response.error))
         else
           secrets.token = response.token.id
-          secrets.cc_type = @mapCC(response.token.card.brand)
+          secrets.cc_type = @mapTokenApiCardBrand(response.token.card.brand)
           secrets.card = response.token.card
           submit()
 
@@ -35,10 +35,10 @@ Darkswarm.factory 'StripeElements', ($rootScope, Loading, RailsFlashLoader) ->
           Loading.clear()
           RailsFlashLoader.loadFlash({error: t("error") + ": #{response.error.message}"})
           @triggerAngularDigest()
-          console.log(JSON.stringify(response.error))
+          console.error(JSON.stringify(response.error))
         else
           secrets.token = response.paymentMethod.id
-          secrets.cc_type = @mapCC(response.paymentMethod.card.brand)
+          secrets.cc_type = @mapPaymentMethodsApiCardBrand(response.paymentMethod.card.brand)
           secrets.card = response.paymentMethod.card
           submit()
 
@@ -46,9 +46,9 @@ Darkswarm.factory 'StripeElements', ($rootScope, Loading, RailsFlashLoader) ->
       # $evalAsync is improved way of triggering a digest without calling $apply
       $rootScope.$evalAsync()
 
-    # Maps the brand returned by Stripe to that required by activemerchant
-    mapCC: (ccType) ->
-      switch ccType
+    # Maps the brand returned by Stripe's tokenAPI to that required by activemerchant
+    mapTokenApiCardBrand: (cardBrand) ->
+      switch cardBrand
         when 'MasterCard' then return 'master'
         when 'Visa' then return 'visa'
         when 'American Express' then return 'american_express'
@@ -56,6 +56,14 @@ Darkswarm.factory 'StripeElements', ($rootScope, Loading, RailsFlashLoader) ->
         when 'JCB' then return 'jcb'
         when 'Diners Club' then return 'diners_club'
 
+    # Maps the brand returned by Stripe's paymentMethodsAPI to that required by activemerchant
+    mapPaymentMethodsApiCardBrand: (cardBrand) ->
+      switch cardBrand
+        when 'mastercard' then return 'master'
+        when 'amex' then return 'american_express'
+        when 'diners' then return 'diners_club'
+        else return cardBrand # a few brands are equal, for example, visa
+
     # It doesn't matter if any of these are nil, all are optional.
     makeCardData: (secrets) ->
       {'name': secrets.name,

spec/javascripts/unit/darkswarm/services/stripe_elements_spec.js.coffee

@@ -51,11 +51,18 @@ describe 'StripeElements Service', ->
           expect(Loading.clear).toHaveBeenCalled()
           expect(RailsFlashLoader.loadFlash).toHaveBeenCalledWith({error: "Error: There was a problem"})
 
-  describe 'mapCC', ->
-    it "maps the brand returned by Stripe to that required by activemerchant", ->
-      expect(StripeElements.mapCC('MasterCard')).toEqual "master"
-      expect(StripeElements.mapCC('Visa')).toEqual "visa"
-      expect(StripeElements.mapCC('American Express')).toEqual "american_express"
-      expect(StripeElements.mapCC('Discover')).toEqual "discover"
-      expect(StripeElements.mapCC('JCB')).toEqual "jcb"
-      expect(StripeElements.mapCC('Diners Club')).toEqual "diners_club"
+  describe 'mapTokenApiCardBrand', ->
+    it "maps the brand returned by Stripe's tokenAPI to that required by activemerchant", ->
+      expect(StripeElements.mapTokenApiCardBrand('MasterCard')).toEqual "master"
+      expect(StripeElements.mapTokenApiCardBrand('Visa')).toEqual "visa"
+      expect(StripeElements.mapTokenApiCardBrand('American Express')).toEqual "american_express"
+      expect(StripeElements.mapTokenApiCardBrand('Discover')).toEqual "discover"
+      expect(StripeElements.mapTokenApiCardBrand('JCB')).toEqual "jcb"
+      expect(StripeElements.mapTokenApiCardBrand('Diners Club')).toEqual "diners_club"
+
+  describe 'mapPaymentMethodsApiCardBrand', ->
+    it "maps the brand returned by Stripe's paymentMethodsAPI to that required by activemerchant", ->
+      expect(StripeElements.mapPaymentMethodsApiCardBrand('mastercard')).toEqual "master"
+      expect(StripeElements.mapPaymentMethodsApiCardBrand('amex')).toEqual "american_express"
+      expect(StripeElements.mapPaymentMethodsApiCardBrand('diners')).toEqual "diners_club"
+      expect(StripeElements.mapPaymentMethodsApiCardBrand('visa')).toEqual "visa"