Wow, that seems magical. How can I test upgrading my website without actually upgrading it? That can’t be.
Let me explain.
If your website is typical of today’s modern sites, it uses numerous front-end modules, libraries, frameworks and plugins to provide a positive user interface experience to your site visitors. Like any software, the version you are relying on is not perfect. The vendors of these front-end components often release patches, bug fixes, service packs, minor and major upgrades that you may want to take advantage of, but simply can’t because of the time, resources and risks that the upgrade process may incur.
For example, maybe you want to upgrade to a newer version of a jQuery plugin so that you can utilize a new capability in its latest version. Or perhaps you want to upgrade to the latest version of jQuery itself because they fixed an issue that is affecting some of your users. The task of doing the actual upgrade is easy. Simply replace a couple of CSS and JS files and you’re all set. But you know that’s not really the case. There are two primary reasons that stop you from upgrading quickly.
Reason #1 - No Suitable Test Environment
Since it’s bad form to install and test in your production environment, you need to stand up a proper testing environment. But, maybe you can’t because your Web or IT resources are stretched too thin right now, and it just isn’t worth the effort to clone off Production and stand up a new test/staging environment just to get this one new release upgraded on your site.
Reason #2 - Long Manual Testing Effort
Secondly, you may not have the resources to test the affected parts of the site thoroughly. In the past you would have needed to enlist a couple of the content owners to ensure that the areas of the site that utilize this new front-end component are not adversely affected. However they can’t be called upon for each and every new front-end update.
As such, either one or the other, or both of these two reasons often prohibit you from improving your website here and now. You end up putting off the enhancement or hoping your visitors won’t be bothered too much by the bug. Maybe you’ll upgrade once new versions of some of the other components are released. That way you can justify those costs.
But, wouldn’t it be great if you can solve both issues? I’m happy to say that you can now.
As you may already know, the WebsiteUpgradeTester.com tool solves the testing resource issue by eliminating your time-consuming manual testing effort through automated visual testing. The tool does this by taking digital screenshot images of all your pages, at the screens sizes you specify, before you apply the upgrade and then again after you upgrade. It then detects if anything is different, and reports those differences to you.
Because the tool is automated, it can process all of the pages in your site in a very short amount of time. An hour or so for sites with hundreds of pages and overnight for sites with thousands or tens of thousands of pages. No site is too large.
WebsiteUpgradeTester.com drives what's known as a headless browser (or a browser without a user interface) to take the screenshots of your pages at the desired device size. As it processes the CSS and JS resources for your pages, it swaps out the old version of those resources and instead loads the new versions.
This makes it easy to test your site running the new version with no server setup work.
The tool will then compare digitally, pixel-by-pixel screen captures with the old version of the library, with the screen captures of the new version. Even the slightest differences in rendering will be reported to you.
The tool can also be configured to test various user actions such as mouse clicks, hovers, or text input. For example, if the new version of the plugin was used to render an accordion, you can configure the tool to simulate a set of mouse clicks to simulate clicking each accordion panel. A screenshot of the page after each click action will be taken and then compared with the pre-upgrade versions for differences.
So that’s pretty cool. You can use the WebsiteUpgradeTester.com tool to efficiently test your website upgrade to front-end components, without actually upgrading your site. This allows you to upgrade your front-end components more often, saving time and resources.
WebsiteUpgradeTester.com is the only cloud-based, automated visual testing tool designed to help you efficiently and affordably test your website upgrade. Whether it’s a major version upgrade, service pack or security patch, you can quickly test your entire site, no matter how large, to uncover any lurking issues due to the upgrade.
Don't waste time manually testing your next Website upgrade. Visit WebsiteUpgradeTester.com and sign up for a free trial.
For more detailed information about best practices on upgrading your website and improving your website maintenance processes, we recommend reading The Ultimate Guide to Upgrading and Patching Your Website.
In this Ultimate Guide to Upgrading and Patching Your Website, we’ll walk you through all of the terms, concepts, ideas, and best practices around upgrading a medium to large scale website. We’ll impart our experiences of helping customers perform and test their website upgrades over the past 20 years, so that you can upgrade faster, more efficiently, more often and with better results. Read More
ESAB leveraged a new cloud-based visual testing tool designed specifically for website upgrades to automate and streamline their testing efforts. Using the tool saved an estimated three weeks of manual testing time, increased accuracy significantly, and gave the team peace of mind that there were no lurking surprises. Read More