This article was created in partnership with LambdaTest. Thank you for supporting the partners who make SitePoint possible.
This article was updated for the third time in April 2019 to reflect the cross-browser testing tools that have come and gone, and also to reflect the current browser usage statistics today.
First off, what is cross-browser testing?
Cross-browser testing is the formality of testing web applications and websites in all of the common web browsers that users use today — this ensures that we deliver a consistent user experience everywhere, and not just the web browser that takes our fancy. Here are some of the things to look out for:
- Code validation: do some browsers report code errors?
- Performance: is the website slow, or even causing crashes?
- Responsive design: is the design consistently responsive?
- UI inconsistencies: are there any other design flaws?
- Other strange behaviours: anything else simply not working?
What happens if I don’t test?
Inconsistencies are actually very normal. Fact is, all web browsers behave and render websites a little differently, and some browsers might not even support the features we originally aimed to utilize; and when these inconsistencies appear, it can have a direct impact on our revenue (among other things).
Let’s take eCommerce for example. 69.89% of checkouts are abandoned, and 17% of those are attributed to website errors and crashes. Assuming that a business would accrue half a million sales annually, that’s 59,407 sales lost due to errors and crashes that could have been thwarted by cross-browser testing.
Which browsers should I test on?
Since Microsoft announced they’d be ditching their own EdgeHTML and Chakra engines in favor of the widely-adopted Blink and V8 engines, this means many of the major browsers today offer similar levels of code compatibility. While this is a step back in terms of healthy competition, it does mean that if a website works in Google Chrome, it’ll most likely work in Brave, Opera, and soon-to-be Microsoft Edge. That combined with the fact that even Microsoft has instructed us to stop using Internet Explorer, cross-browser testing is easier than it’s ever been before, with only Safari and Firefox using their own engines.
Technically, the web browsers we should be supporting today are the ones that our users and customers are using, information that’s easy enough to find using Google Analytics or some other kind of web analytics tracking software. But if you don’t have that kind of data available, here are the worldwide statistics*:
- Chrome: 61.75%
- Safari: 15.12%
- Firefox: 4.92%
- UC: 4.22%
- Opera: 3.15%
- Internet Explorer: 2.8%
- Samsung Internet: 2.74%
- Microsoft Edge: 2.15%
*As of November 2018.
Also, bear in mind that there are multiple releases of each web browser across multiple OSs. Sound scary? Not really, but it is boring as heck to be testing websites on all of them!
Luckily, there are a number of excellent cross-browser testing tools available, so today we’re going to take a look at 7 of the best ones.
With immediate access to over 2,000 web browsers running on real Android and iOS devices, the well-known BrowserStack lets developers and other stakeholders engage in cross-browser testing, whether that’s to snap a few screenshots, debug errors in realtime, or to actually interact with the browser natively and see how the layout fairs when the window is resized. There’s no need to compromise on simulators and emulators, BrowserStack offers you total control since you’ll be interacting with real browsers on remote machines.
It’s not like the real thing, it is the real thing.
BrowserStack also supports Selenium, an open-source tool to help you automate various tests so you don’t have to do so manually.
Although the features above are fairly standard when it comes to cross-browser testing tools, what really sets BrowserStack apart is that you can kick things off from as little as $12.50/mo, an initiative aimed at freelancers – offering lighter functionality.
CrossBrowserTesting by SmartBear offers both manual and automated testing via Selenium, 1500+ remote browsers across mobile and desktop, and has a similar subscription setup as BrowserStack (minus their “Freelancer Plan”). With total access to browser extensions and developer tools such as Chrome Dev Tools and FireBug, the ability to interact using swipe motions and more, and finally, the means to natively debug front-end errors, CrossBrowserTesting isn’t all that different from BrowserStack.
CrossBrowserTesting and BrowserStack also enable users to compare versions (live or screenshot), run multiple tests (or take multiple screenshots) at once, and even share the results.
All-in-all, a suitable alternative to BrowserStack, however I would choose BrowserStack if the number of browsers supported is important to you (BrowserStack supports an additional 500).
With unlimited realtime browser testing, unlimited automation testing, unlimited responsive testing, unlimited screenshot testing, and 24×7 support, you won’t have the slightest of worries in terms of limitations when using Lambdatest. And with the lowest plan starting at only $15/mo, Lambdatest offers the best bang for the buck. In fact, there’s even a highly-functional “Lifetime Free” option, making it one of the most accessible cross-browser testing tools available on the market today, very suitable for those anxious about cross-browser testing for the first time.
As an added bonus, all options include free automation minutes; that is if you don’t choose their mighty automation option!
All options also include:
- 2000+ native test browsers
- Issue tracking with test logs
- Local testing functionality
- Automated screenshot testing
- Responsive and visual comparison testing
- Access to the WordPress and Chrome extension
- Integration with Trello, Asana, Jira, and Slack
In short, the LambdaTest automation platform is an online selenium grid that gives you the ability to run your test scripts on 2000+ browser environments.
Despite being one of the cheaper cross-browser testing tools at $19/mo (overtaken by only Lambdatest in terms of value), don’t let Browserling’s no-frills website fool you. If automated testing isn’t much of a concern for your team, Browserling is a fairly cost-effective option.
Also, they have extensions for Chrome, Firefox, Opera, and Safari as well!
Experitest offers fairly standard features but with reduced costs starting at $9/mo, and even has an attractive freemium option like Lambdatest. That being said, the Experitest doesn’t feel nearly as shiny at Lambdatest, so Experitest may be the better option only if you’re on a budget.
What separates Functionize’s cross-browser testing tools from the competition is its vast use of artificial intelligence and the fact that if you set up tests for one browser, there’s no need to recode tests for others, which can save a fair bit of time. They’re all about autonomous testing (using their Adaptive Event Analytics™ technology), so that you can spend more time analyzing the results.
It’s not specified how many browsers Functionize supports, however, they offer the same standard of features as with other cross-browser-testing tools, such as code debugging and visual testing.
Just FYI: their cross-browser testing tools ship as part of a larger platform, and their pricing isn’t publicly available.
Despite offering similar functionality to other cross-browser testing tools, Sauce Labs starts from $89/mo (for testing on real devices). They’ve been around a while though, and claim to have “the world’s largest continuous testing cloud,” so if you have the budget, it’s worth a try.
Even though the majority of cross-browser testing tools on the market today have maintained a very high-standard in terms of features offered, allowing development teams to increase their test coverage and deliver a more consistent user experience across all devices and screen sizes, many of them have a least one small trait that sets them apart from their competition.
Whether that’s Functionize and their AI-driven approach to front-end testing, Experitest with their competitive pricing, or BrowserStack for their reduced-cost option aimed at freelancers, one of these tools are sure to suit your teams’ needs. If you’re looking for an awesome-all-round option, Lambdatest seemingly offers the best value for money.
Visual Studio Code: End-to-End Editing and Debugging Tools for Web Developers
Your First Year in Code