Becoming a Crime Fighting Bug Hunter
Tackling site bugs can be tricky business, but our Senior Project Manager, Becky, has shared with us her top tips for finding and eliminating them.
“Look ma, I caught a fraggle!” - I grew up with the wonderful Henson show The Fraggles. Giant gorgs were plagued by an infestation of feisty Fraggles - the heroes of the show! When Junior managed to catch a Fraggle he was shocked, horrified and triumphant - calling out to his Ma in excitement.
Finding a bug on a website can also elicit a wide variety of emotions including shock, horror, and yes - triumph!
Some bugs are tricksy and very hard to pin down, so finding one can often feel like a moment of triumph.
After all, you can’t eliminate a bug if you can’t find it.
School children are encouraged to venture outside to explore the local habitats and the bugs that live in them. These creepy crawlies are tracked down, viewed through a magnifier, written about and drawn.
In development our testing processes are there to seek out any bugs in the code. Any quirks in the system from different browsers, or devices, or trying to enter the “wrong” kind of data. The aim is to make sure the site works as expected for the end user.
Bugs in the Wild
There is no such thing as a perfectly bug free environment. You may have poured boiling water on the ants nest in your garden (we’re not judging) but there will still be the occasional ant crossing your path.
When it comes to websites there is always a chance of a bug appearing once it’s live that wasn’t spotted before the launch. These often show up when customers start using the site in a myriad of different ways. For example:
- A new browser update may cause a page to perform in a different way.
- A customer may use the site in such an unusual manner that no one would have considered testing for it.
- An instruction was misinterpreted so an unexpected entry was added to a form.
- Or someone pasted something odd into a form.
These things can happen and although it can feel like the end of the world at the time, it’s often not a huge issue. Obviously this does depend on whether or not it’s preventing your customers from using your site fully or not - or if it’s just affecting a couple of people.
Don’t Panic Mr Manwaring!
When faced by an angry hornet or an angry customer who can’t make a purchase on your site the same rule applies - try not to panic, they can’t see you if you’re not afraid.
It’s time for you to become a crime fighting bug hunter, think of yourself as a cross between Sherlock and Steve Irwin. You are inquisitive with a nose for details. You are brave in the face of danger (maybe give the scary bug a nickname).
Location, Location, Location
To catch the bug you have to find out where it’s hiding - so you need to follow it to its lair. Let’s speak to the victim, check for clues and then track it down.
Step 1 Speak to the Victim
In this role-playing exercise the “victim” is the person who experienced the bug. We need to know what they were doing before the bug happened, what the bug looked like, and info about their device and browser.
Where were you on the night of the incident in question?
We’re not looking for an alibi, but we do need to know the events that led up to the bug. People’s recall is notoriously bad and it’s unlikely to be accurate so it’s time to take notes to pass to compare with more evidence later on.
- What time did the incident occur? (date and time are really important)
- Which part of the site were you on (get a link if you can)?
- Were you logged in to your account?
- What did you have in your basket?
- Is it still happening?
Did you get a good look at ‘em?
A lot of people will say they saw “an error” but this is not a helpful description.
- What words were shown when you saw the error?
- What else was on the page?
- Did you get a screenshot?
Screenshots are your friend! Customers may not always be able to take them which is understandable, but if you are the victim grab a screenshot when it happens - and don’t crop it! Engage Sherlock mode! There’s always something interesting at the edges of the crime scene! Screenshot the entire browser window, including the address bar!
On your phone taking a screenshot is easy when you’ve learned how, and then you can email the image.
On your laptop or computer, a really handy browser extension is Awesome Screenshot, and it’s compatible with all modern browsers. This also has the ability to record video - which if you can replicate the issue and record it on video is the gold standard of bug hunting.
Browser and device info
www.whatsmybrowser.org is your new best friend when it comes to bug hunting. It is the Watson to your Sherlock. Send this link to the victim - all they have to do is click the “Copy” button and then send you the copied link. When you open this you get to see info about the victim’s browser and device. It’s totally anonymous and won’t reveal anything personal. What it will let you discover is if they are using a Mac or PC and which version. It will tell you the size of their browser, which browser it is and also which version. If they are using an old browser it could be case closed!
Step 2 Check for Clues
If you have access to the admin you can check the customer’s account, or look for their order. Look for evidence that backs up or contradicts their statement.
Step 3 Track it Down
It’s time to retrace the victim’s steps and see if we can catch the bug in action. Using the information you’ve gleaned from speaking to the victim and the clues you’ve uncovered see if you can “replicate the issue” as a developer might say.
It’s not you, it’s me
If the website is completely down check if it’s only you having the problem. The issue may be caused by the internet in your home or office, rather than the site itself.
The site “Down for everyone or just me” will let you know if it’s just you.
Turn it off and on again
Sometimes your device can do odd things. If nothing else is working, try turning it on and off and on again to see if this fixes it. There’s a reason the saying exists!
If you can replicate the bug, fantastic! You may even feel a little bit triumphant! Now is the time to break out the screen recording option in Awesome Screenshot and capture it in action.
You may not be able to find the bug, and that’s ok. It could be specific to a browser that you don’t have.
File Your Report
Send your development team contact the evidence you have gathered. Make sure to include everything you’ve gathered including the date and time of the incident and a reference for the customer who had the problem.
If the issue is related to a third party service, such as your payment gateway please include details about this in your report.
Also remind them how it should work with as much detail as possible. The person who investigates the issue and tries to fix it may not be the same person who built your site, so it’s really helpful to be clear how your site works.
Make sure to let them know how big of an issue it is for you - is this affecting all your customers, or just one? Is it critical to your business or is there a time pressure involved?
With a detailed report like this your development team will be in awe of your detective skills and proud to work with you.
With the information you provide the developer will know where to start looking for the bug. This could mean looking in the code, or using the date and time provided to check error logs around the time of the incident. If the bug can be replicated then it can be tracked down. If it can be tracked down, then it can be exterminated.
When it comes to critical fixes for your site time matters. The difference between “something bad happened” and a sending a helpful report about the error, the events that took place and supporting evidence in the form of screenshots and www.whatsmybrowser.org links is massive.
Receiving this kind of information means a developer could jump into action straight away to fix an urgent issue. Without it there needs to be correspondence with you to figure out what’s wrong before any kind of fixing can take place. So next time something odd happens on your site, remember to keep calm and be part of solving the mystery.