When it comes to apps and websites that will live on the wide world of the interwebs, and across many devices and browsers, it is important for developers to consider cross-browser testing to ensure a positive experience for the majority of users. Styling compatibility, JS version issues, and the differing technology used across browser types and release versions make websites and applications behave differently as device, operating system and browser combinations change. Developers need a testing platform to sort out issues across different devices, browsers and operating systems, to ensure maximum usability and minimal errors.
Enter Cross-Browser Testing
The need for cross-browser testing has been around for some time now, but finding free ways to test your applications or websites across multiple browsers seems to be more and more difficult to do for free anymore.
This guide provides you with top tips for free cross-browser testing.
Planning WHAT To Test
In a perfect world every device, operating system, and browser type and version would work flawlessly and error free. Initially, testing and bug fixing for EVERY browser may be too time consuming and resource intensive, and you may include more thorough browser support over time.
When deciding what to test first, start by:
- What device/operating system/browser combinations are the most commonly used for your audience
- User behavior across these common combinations, such as page drrop offs, lack of conversions, etc.
Additional Reading:
Smashing Magazine: High Impact Minimal Effort Cross Browser Testing
Free Testing Methods
1. Download Different Browsers and Use Built In Dev-Tools
This may seem like the most obvious solution. Why not download every browser you want to test, and see how they run! The Dev-Tools in some browsers even allow you to switch the version you are running (Internet Explorer 11), or the type of device you are using (many allow you to emulate that browser on multiple mobile device types such as an iPad or Android mobile phone).
Additional Reading:
Chrome DevTools: Emulate and Test Other Browsers
Google Chrome: Dev Tools - Device Mode
Firefox: Responsive Design Mode
Internet Explorer 11: Simulate Older Internet Explorer Versions
2. Using Virtual Machines and Emulators With Different Browsers
Sometimes just running a different browser instance doesn't test your project as thoroughly as needed. Running a browser such as MS Edge on a Windows device for example might behave differently than if it was run on a Mac. Many developers use Parallels, but thanks to MS Edge Developer tools, there are free virtual machine options that allow users to run different Internet Explorer versions on different Windows versions. IES 11 on Windows 7? Yep! MS Edge on Windows 10? Got that too!
Additional Reading:
MS Edge Developer Tools: Virtual Machines
3. Using Cloud-Hosted Interactive Cross-Browser Testing Web-Apps
Conveniently there are many interactive web-apps that provide cloud-hosted virtual machines that allow users to test their projects on a wide variety of device/operating system/browser combinations. Unfortunately there are no longer any completely free options for developers to use past a certain free trial period. There are two options that I am aware of though, that do offer unlimited free services of their cross-browser testing platform for open-source projects: BrowserStack and CrossBrowserTesting. Both of these cross-browser testing web-apps provide users with a VERY robust selection of devices/operating systems/browsers, and allow live and interactive testing of your open-source project. There are considerations to take before making your project open-source, but depending on the project these can be a very quick and effective solution for your testing needs.
Additional Reading:
BrowserStack
CrossBrowserTesting
Open Source Guide: Starting an Open Source Project
CSS-Tricks: Use BrowserStack for Live Web-Based Cross Browser Testing
Conclusion
Cross-browser testing is an important step to ensuring your app or website behaves across multiple combinations of devices/operating systems/browsers. Although not a completely simple task, I hope this blog post helps some of you with some free options for performing your own cross-browser testing.
Did I miss something?
What is YOUR favorite free cross-browser testing tool?
Let me know in the comments!
Top comments (10)
Also checkout testproject.io for free automated testing.
It's worth mentioning that TestProject doesn't offer any cross-browser grid, you still need a separate BrowserStack or Sauce Labs subscription.
My company has a similar product (Endtest), one of the differences is that it includes a cross-browser grid, so you don't need other subscriptions.
And there are many other similar products out there.
Thanks Liviu for your input. It looks like Endtest also requires a subscription, but offers a 7 day free trial. I tried to only keep the free options on my list of tips for this round.
Hi Kyle, I never said that Endtest does not require a subscription.
Like most cloud solutions that offer access to some kind of infrastructure, it has a price tag.
I simply mentioned that it includes a cross-browser grid and you don't need to purchase an additional service for that.
TestProject is free, but it does not include a cross-browser grid, so you still need to pay in order to get that.
I know the article is about free options.
Keep up the good work!
I appreciate you adding it to the conversation! And if you know of any additional free options for people please let me know. I am sure because of the technology/infrastructure involved and the need/demand that this is a difficult thing to keep free.
Libraries are free.
Cloud solutions which involve a lot of resources aren't free.
I always investigate closely if something is advertised as being "free".
I don't know if you follow the news, but the company behind the Robinhood trading app got a huge $65M fine because they made false advertisement, claiming that their trading app is completely free, without any commissions.
It turns out they were actually increasing the prices of the stocks that users would buy and users ended up paying more than they would have paid if they just used other solutions that charged commissions.
Here is the article.
In other cases, that "free" package is only there so the company can get more users and flood them with marketing emails.
There ain't no such thing as a free lunch
No, but beginner Devs who are learning to create well rounded projects, or want to learn by creating an open source project may not have the budget for paid services when there are free options. That is why I wrote this blog post, and am open to additional resources that are similar to those I have included. I was hoping to not turn this blog post into yet another LambdaTest promotional post, but rather to introduce new devs with learning options.
Alright, thanks for pointing that put.
Thanks Jan for that! I also saw Selenium as a similar free automated testing option, though the cross-browser grid support for both seem to still require a subscription to BrowserStack or a similar service. I would love to know if there are any of these automated testing services that provide FREE cross-browser testing.
Selenium is a great option for End-to-end tests. One great feature is that it allows to write in various languages, so the tests fit the project.
We’re using the WebDriver for our tests, so I don’t know about the grid. WebDriver supports different browsers, at least FireFox and Chrome, but yeah, it wouldn’t scale well.