Add a bit more context for errors in loaders (#61)

src/index.test.js

@@ -163,6 +163,29 @@ test('should throw error on failed loading', async () => {
 
     await promise
   } catch (error) {
-    expect(error.message).toBe(`'RevolutCheckout' is failed to load`)
+    expect(error.message).toBe(
+      `'RevolutCheckout' failed to load: Network error encountered`
+    )
   }
 })
+
+test('should throw error if RevolutCheckout is missing', async () => {
+  const { script, RevolutCheckout, TriggerSuccess } = setup()
+
+  const promise = RevolutCheckout('PROD_XXX')
+
+  expect(script).toHaveAttribute('id', 'revolut-checkout')
+  expect(script).toHaveAttribute('src', 'https://merchant.revolut.com/embed.js')
+
+  TriggerSuccess.mockImplementationOnce(() => {
+    // RevolutCheckout is not assigned to window
+    fireEvent.load(script)
+  })
+  TriggerSuccess()
+
+  await expect(promise).rejects.toEqual(
+    new Error(
+      `'RevolutCheckout' failed to load: RevolutCheckout is not a function`
+    )
+  )
+})

src/loader.ts

@@ -37,10 +37,10 @@ export function RevolutCheckoutLoader(
   document.head.appendChild(script)
 
   return new Promise((resolve, reject) => {
-    function handleError() {
+    function handleError(reason: string) {
       document.head.removeChild(script)
 
-      reject(new Error(`'RevolutCheckout' is failed to load`))
+      reject(new Error(`'RevolutCheckout' failed to load: ${reason}`))
     }
 
     function handleLoad() {
@@ -50,12 +50,12 @@ export function RevolutCheckoutLoader(
         loaded = RevolutCheckout
         delete window.RevolutCheckout
       } else {
-        handleError()
+        handleError('RevolutCheckout is not a function')
       }
     }
 
     script.onload = handleLoad
-    script.onerror = handleError
+    script.onerror = () => handleError('Network error encountered')
   })
 }
 

src/payments.test.js

@@ -152,7 +152,7 @@ test('should not request new embed script and use loaded one', async () => {
     publicToken: 'MERCHANT_PUBLIC_TOKEN_1',
   })
 
-  await RevolutPayments('MERCHANT_PUBLIC_TOKEN_2')
+  await RevolutPayments({ publicToken: 'MERCHANT_PUBLIC_TOKEN_2' })
   expect(MockRevolutPayments).toHaveBeenCalledWith({
     publicToken: 'MERCHANT_PUBLIC_TOKEN_2',
   })
@@ -186,7 +186,7 @@ test(`should use 'prod' by default`, async () => {
   })
 })
 
-test.only('should throw error on failed loading', async () => {
+test('should throw error on failed loading', async () => {
   expect.assertions(1)
 
   const { RevolutPayments, TriggerError } = setup()
@@ -200,6 +200,31 @@ test.only('should throw error on failed loading', async () => {
 
     await promise
   } catch (error) {
-    expect(error.message).toBe(`'RevolutPayments' failed to load`)
+    expect(error.message).toBe(
+      `'RevolutPayments' failed to load: Network error encountered`
+    )
   }
 })
+
+test('should throw error if RevolutCheckout is missing', async () => {
+  const { script, RevolutPayments, TriggerSuccess } = setup()
+
+  const promise = RevolutPayments({
+    publicToken: 'MERCHANT_PUBLIC_TOKEN_PROD_XXX',
+  })
+
+  expect(script).toHaveAttribute('id', 'revolut-payments')
+  expect(script).toHaveAttribute('src', 'https://merchant.revolut.com/embed.js')
+
+  TriggerSuccess.mockImplementationOnce(() => {
+    // RevolutCheckout is not assigned to window
+    fireEvent.load(script)
+  })
+  TriggerSuccess()
+
+  await expect(promise).rejects.toEqual(
+    new Error(
+      `'RevolutPayments' failed to load: RevolutCheckout is not a function`
+    )
+  )
+})

src/paymentsLoader.ts

@@ -27,10 +27,10 @@ export function RevolutPaymentsLoader(
   document.head.appendChild(script)
 
   return new Promise((resolve, reject) => {
-    function handleError() {
+    function handleError(reason: string) {
       document.head.removeChild(script)
 
-      reject(new Error(`'RevolutPayments' failed to load`))
+      reject(new Error(`'RevolutPayments' failed to load: ${reason}`))
     }
 
     function handleLoad() {
@@ -40,12 +40,12 @@ export function RevolutPaymentsLoader(
         loadedPaymentInstance = RevolutCheckout.payments
         delete window.RevolutCheckout
       } else {
-        handleError()
+        handleError('RevolutCheckout is not a function')
       }
     }
 
     script.onload = handleLoad
-    script.onerror = handleError
+    script.onerror = () => handleError('Network error encountered')
   })
 }