Error handling

User input error

Some events allow errors to be recovered (for example TOKEN_FAIL or OnChange events). These non-critical errors returned in these events allow you to adapt your interface. Here is an example of error handling based on user input:

paygreenjs.attachEventListener(
  paygreenjs.Events.PAN_FIELD_ONCHANGE,
  (event) => {
		const error = event?.detail?.error;
		if(error) {
			myCustomButton.disabled = true;
		} else {
			myCustomButton.disabled = false;
		}
  },
);

paygreenjs.attachEventListener(paygreenjs.Events.TOKEN_FAIL, (event) => {
  console.error('Fail to tokenize card: ', event?.detail);
});

Token Fail

TOKEN_FAIL event is returned if the method submitPayment() is triggered and an error occurred while tokenizing the data.
This event can return 3 errors:

  • tokenize_invalid_card : when the user provides an invalid card
  • tokenize_unauthorized: when the user is not allowed to tokenize (once hosted fields loaded, user have 10 minutes to fill the fields. After the expiration, he could receive this error)
  • tokenize_unknown_error: when an unknown error is thrown. This must be very rare

Other error

As soon as an unexpected error occurs in the payment flow, PGJS dispatches an event ERROR:

paygreenjs.attachEventListener(paygreenjs.Events.ERROR, (event) => {
	console.error('Your custom error handling', event?.detail);
});