This post is part of series on the test IO blog about real bugs that our testers have found during test cycles. In each post, we explore the details of the issue, explain its impact, and discuss what software teams can do to avoid similar problems.
A report by Business Insider Intelligence found that e-commerce retailers are potentially losing billions of dollars due to abandoned carts. Lengthy or complicated checkout forms, such as entering shipping addresses or payment information, account for approximately 39% of U.S. cart abandonments. This is one of the key ways test IO helps companies increase revenue: we help discover where potential customers are encountering UI, validation, and other problems that lead to revenue loss.
For our first bug of the week we’re taking a closer look at a credit card bug that had the potential to cause customers to abandon shopping carts.
Credit card order processing bug
While testing an e-commerce site, one of our testers found a severe bug during the order checkout process. After entering the credit card number, users were unable to enter the 4-digit verification code for American Express credit cards. The CVV/CID validation field allowed them to enter a maximum of 3 digits. The bug was initially discovered on Apple iPad 2, iOS 9.3.5 as part of a mobile testing cycle. However, it ended up being reproducible across browsers and platforms. There was no error message on the security code field itself. The error message advised the tester to select the credit card type, even though the credit card number had already been entered.
Lessons learned and best practices from test IO
What we can learn from this bug is the importance of field validation. It appeared that the credit card field did not validate the card type when the credit card number was entered. So it would not allow the tester to enter the 4-digit Amex security code. The security code input field most likely defaulted to the first card in the selector, which was Visa. Visa cards have a 3-digit code.
The best practice is to set the credit card field up for automatic validation, as the first few digits of a credit card identify the card type. This makes validation much easier. It’s also important that your payment API is set up to ensure each card type accepts the correct number of digits for the CVV/CID.
Consumers want bargains but they also want convenience. They are counting on you to make their shopping experience as seamless as possible. This includes making the payment process less of a headache. Even when implementing the one-click payment process, users need their initial credit card setup to be a simple one. Especially those under the influence.