_edited.jpg)
I'm back again this month with another post on some of the bugs that I found in production randomly while browsing. If you missed my first post, you can check it out here. Most of these bugs were actually found on my mobile which shows that even if we now live in a digital era where mobile experience is supposed to be much higher than desktop, there's still a lot of mobile only bugs that slip to production. Again, it is a complete myth that there is such a thing as 100% bug free application.
Production Bug #1: Merchant Skimlinks
When you view the list of merchants that are available in Skimlinks, the first thing that you'll notice is that there is no mobile version available. I found an interesting bug here that when you click the search field, press x or click Done on your keyboard, then the whole layout just overlaps with each other.
Here is a video recording to demo how I did it. Otherwise, if you type in a value on the search field, it works fine as expected. But the tester inside me decided to break it.
Production Bug #2: Wayfair
I've been doing a lot of furniture buying from Wayfair (I think I have a problem!) and so I've spend a considerable amount of time on their website. I don't remember the furniture that I was looking for when I found the bug below (might be a new shelf...) but when I was looking for the customer reviews, I noticed that some of the dates are in the future (December 2020) and some says invalid date. I wonder what happened here?
Production Bug #3: Cheatography
I found out about this website from LinkedIn because someone has posted a cheatsheet for Cypress. The first thing that I noticed was the styling of the search functionality. While it works, there is clearly a visual bug here as shown by the screenshot below.
Another thing that I noticed is when you click on their burger menu, the menu doesn't fully show. You have to scroll your screen on the left so you can see the full menu structure. Check out the video recording below to see what I mean. These two functionality (search and burger menu) might work as expected in terms of what it's supposed to but we should also consider the visual aspect and usability as this is the first thing that our users will notice.
Production Bug #4: The Sun
Sadly, I'm not exempted.. I deployed a change that our team did and it was related to adding a new advert layout (billboard). I did not think that it will impact rails but sadly it did. You can see from the screenshot that there are two issues here. The first issue is related to mobile where the rail title has slightly shifted to the right as you can see below.
Initially, we thought that we'll just do a roll forward fix because the bug is not too bad. But then one of the UX designer reported that on desktop, the rail arrow (which is used to browse through the other teasers) seemed to have disappeared. I felt annoyed because I should have caught it! Anyway, I know that these things happen and the good thing was we acted quickly, reverted the changes from production and re-deploy the bug fix together with the original ticket. I am actually glad that our deployment process is quite good so we can quickly revert tickets if any issues occur.
Production Bug #6: SendGrid
Last on my list is from this website that I found when I was looking for blogs related to testing. This was a minor issue but visually, you can see that the sign up box is not centred.
Anyway, here's some questions though to other testers that I'm interested to hear.
What is your go-to strategy on testing front end applications?
Do you do mobile first testing?
Do you test on real devices or emulators?
Do you have a visual testing pipeline for verifying CSS changes on different browsers/mobile devices?
How do you feel when you know that you deployed a bug in production? 🙈
Comments