63
Shares

Is your WooCommerce store working? It’s a question that keeps a lot of store owners up at night—but can be fixed with some prep and proper testing.

Over the years, I’ve come to realize there are four schools of thought amongst store owners when WooCommerce updates roll around:

  • The Cowboy: These store owners hit “update” without a second thought. Then their store comes crashing down around them.
  • The Couch Potato: Those who simply ignore updates altogether, treating them like they don’t exist.
  • The Scaredy-Cat: These store owners have so many outdated plugins and themes because they’re terrified of what will happen if they attempt an update.
  • The Maverick: Lastly, these are the store owners who run regular backups, test new releases of WooCommerce on a staging site, and then update their live site without issue.

Ideally, everyone should be a Maverick. Fortunately, it’s not hard to be one! With the right tools in place, a solid testing checklist, and some automation, you can start keeping your WooCommerce site up-to-date and always running smoothly.

Still looking for that perfect WordPress host?

Try Kinsta's premium managed WordPress hosting to experience your site without problems.
  • Styleized controls representing management Fully managed
  • Shield with a tick representing securitySecure like Fort Knox
  • Merging lines representing migrationsFree migrations
  • Three right chevrons representing server speedUltimate speed
  • Circular arrow with center dot representing backupsDaily backups
  • Offset hexagons representing our server stackGoogle Cloud Platform

In this post, I’m going to run you through how to update your WooCommerce site from start to finish, including tools and a big testing/updating checklist. Don’t forget to bookmark this post for future reference!

Spend a Little Time Now to Save a Lot of Time (and Anxiety) Later

Before we dive in, my own personal rule of thumb is that you should never update your site and especially WooCommerce without thoroughly testing any new releases first. That goes for major, minor and patch releases—it doesn’t matter.

You have to be willing to spend a little time now to save a lot of time later.

You don’t need to hit that update button straight away. Give yourself some time and make sure you understand what changes will be made to your site when you update, and how they might impact everything else on your site. Simply reading up on the new features available in the version of WooCommerce you want to update to will help you get your head around what you need to prepare for.

It’s not easy being an extension/plugin or theme developer. Having to keep up with new releases of other plugins is no small task. Similarly, writing code for WooCommerce core that is backwards compatible is equally difficult—can you imagine trying to maintain compatibility for all the different plugins and themes that are built on WooCommerce?

When I was consulting, I would always make time to review changelogs and the WordPress.org support forums before updating WooCommerce on client sites. Often, if there was ever a problem with an update, 99% of the time someone else would come across the issue first, saving me a ton of time (and hassle dealing with the issue myself).

It’s also not uncommon to have to wait for plugin/theme authors to release their own updates to WooCommerce-related products before you can update your site too. So being patient and taking the time to check compatibility can really pay off.

Updating WooCommerce: Getting Started

There are four essential stages when it comes to updating WooCommerce, and I promise once you’ve run through everything once it gets quicker and easier next time!

Updating WooCommerce: Tools

Let’s face it, manually testing WooCommerce is tedious and time-consuming. It’s for these reasons that so many people simply don’t do it—or, when they do, they don’t test properly and miss errors on their site.

Fortunately, there are tools that can help speed up the testing process and make it less of a boring thing to do. Heck, I think it’s actually fun!

After countless times testing and updating WooCommerce over the years, these are the tools I recommend:

  • Staging site. This is non-negotiable. You should never update your live site immediately after a new release of WooCommerce. Staging sites provide a testing environment where you are free to break things (usually without repercussions). There, you can run updates, test new versions, and see how your site might react before updating your live site. If you haven’t got a staging site, Kinsta can help you out—they offer one-click staging environments.

    Create WordPress staging site

  • Visual comparison tool. How do you know if your site has changed after an update? If you run a large site with dozens of pages, tracking down small changes in formatting or even widgets that have stopped displaying can take time. With a visual comparison tool like WP Boom, which we’re going to use for this tutorial, you can take a snapshot of your site, hit “update,” and then take a second snapshot so you can quickly see what’s changed. It’s important to point out that a visual change doesn’t necessarily mean that some piece of functionality has broken on your site, just that it could be broken. There’s a great review of WP Boom by BobWP that’s a couple of years old, but it should give you a good overview of how it works.
  • End-to-end testing tools: While visual comparison tools can help you quickly spot changes in the formatting and design of your site, end-to-end testing tools go further, testing the actual functionality of your site and providing more certainty when something isn’t working. Clicking around your site to complete tests like adding an item to cart and checking out takes times and gets old pretty quickly when you’ve tested WooCommerce a hundred times before. With end-to-end testing tools, you can automate this so it’s done automatically for you. For this tutorial, we’re going to use Robot Ninja, our automated end-to-end testing tool for WooCommerce on both staging and live sites. We’ll go through how to set up Robot Ninja later in this article. Robot Ninja WooCommerce also has some E2E tests you can run through if you are more of a developer.
  • Backups: You should be running regular backups of your site. Some of my favorite backup tools include BackUpWordPress, VaultPress, and BackupBuddy. If you’re interested in database backups, I’d recommend WP Migrate DB Pro or simply using WP-CLI to run quick exports. If you’re with Kinsta, they provide automatic daily backups, manual backup points, and backup retention for all of its plans.

    WordPress backups

    WordPress backups

Once you’ve got the right tools in place, it’s time to do some prepping.

Updating WooCommerce: Prepping

If you want your update to go smoothly, you need to do some prep. There is a little prep involved, but after you’ve prepped once, it’s easier to fill in the blanks and do it quicker next time you update.

Here’s what I recommend:

  1. Re-familiarize yourself with the site you’re updating. If you’re not sure how your site is expected to function (i.e. if it’s a new client’s site), take some notes. This will help ease some of the anxiety you might feel if you get confused about how the site works after an update (this happens more often than you think).
  2. Make a list of critical URLs and functionality for your site (and customers). This should include important pages on your site, such as your homepage, category and product pages, my-account, cart and checkout pages.
  3. Check your backups are current, and if not, run another backup. Re-familiarize yourself with your backup tool. Most importantly, check they it’s working properly and that you know how to revert to a previous snapshot of your site.
  4. Set up WP Boom. It only takes a minute to set up. If your memory and note-taking aren’t great (like mine) WP Boom can help fill in the gaps with screenshots of your site—think of them like the “before” photos in weight loss promotions. Take your first site snapshot so you’ve got a visual baseline record of your staging site, pre-update. It typically won’t be able to take screenshots of the checkout (you need some products in your cart) and protected pages, but that is where the next tool can help…
  5. Set up Robot Ninja. If you were testing WooCommerce manually, this is the part where you’d make a list of test scenarios, i.e. open your site, add a product to the cart, go to checkout, enter payment information, etc. Fortunately, Robot Ninja can automatically do all this you.
  6. Based on the list of critical URLs and functionality you created earlier, identify any other parts of your site that you want to test. This could be functionality like contact forms or pop-ups or things like slideshows or galleries. You can test these things manually or, if you are more technically-minded, you could try your hand at automating this too (I’ve included some resources about this later in the article but it’s more for developers).
  7. Check out what’s new in the version of WooCommerce that you want to update to and whether your plugins are compatible. Again, spend some time now to save yourself some time and anxiety later. I recommend checking out: release announcements on WooCommerce.com, change logs, GitHub issues, the WordPress.org forums.
  8. Clone your live site to your staging environment. If you’re using any plugins that feature a staging mode, such as WooCommerce Subscriptions, turn it on or simply disable them. Likewise, disable emails. Double-check that your staging environment mimics your live site as closely as possible. I also like to enable debug logging in WordPress and WooCommerce at this point to help with problem-solving down the track.
    Important:
     After you push your site to staging, you don’t want to lose any orders that might come through. To avoid this, the recommendation would be to put your WooCommerce store into maintenance mode. This will ensure that no orders are placed while you’re performing updates and testing.

Updating WooCommerce: Updating and Testing Staging Site

Now that you’re prepped and ready to go, here comes the fun part: updating your staging site. The awesome thing about staging sites is that it doesn’t matter if your site breaks because it’s just a copy.

  1. Take a snapshot of your site with WP Boom so you’ve got a visual baseline record of your staging site, pre-update.
  2. Run Robot Ninja and ensure your tests are passing.
  3. Update your plugins and theme to versions that are stated as being compatible with the version of WooCommerce you want to upgrade to.
  4. Update WooCommerce on your staging site.
  5. Check your logs for any obvious errors resulting from the updates and do a quick check that you can still access the homepage and admin area. If you get a white screen of death or are stuck in some other unrecoverable situation, now is a good time to revert to a previous snapshot of your site and do some problem-solving yourself or seek help.
  6. If all is going well so far, run WP Boom again and get a second snapshot. Compare your before and after snapshots to see what’s changed. What’s great about WP Boom is that it will tell you how much your site has changed since your last snapshot, i.e. there might be a 7% visual change between your two sets of snapshots. Whilst this doesn’t necessarily mean your site is broken, it might mean you need to adjust some styles.
  7. Run Robot Ninja again to test that your checkout flow is still working properly.
  8. Perform any other manual (or automated) checks for other functionality on your site such as contact forms.
  9. If anything is not working as you’d expect, now is the time to report and/or fix anything that’s broken. If you have custom code running on your site (i.e. code that is not maintained by a third party plugin/extension developer) you will need to fix it and make sure the fixes are applied to your live site before or after running the update (depending on the issue). Version control, such as having your site in Git, can help you better manage changes. Where you report bugs will depend on what plugins you are using and your support arrangements.

From here you’ll either have to wait for new releases of your plugins/theme and then try the process again or work on the fixes yourself and update your code.

The good news is, your live site has not broken, your customers are still able to make purchases, and you can take the time to repeat the process as much as needed until you are comfortable everything is going to work as expected.

Updating WooCommerce: Updating and Testing Live Site

Once you’ve updated your staging site and got it working smoothly, with any broken functionality fixed and all bugs ironed out, you’re ready to update your live site.

Now you’re ready to update your live site. Here’s what you need to do:

  1. Back up your live site. Make sure you don’t miss this step.
  2. Take a snapshot of your site with WP Boom so you’ve got a visual baseline record of your live site, pre-update.
  3. Run Robot Ninja and ensure your tests are passing. This provides another baseline for your site pre-update.
  4. Next, depending on how your staging and live environments work, you may simply need to sync changes between staging and live or you’ll have to run through updating the plugins and code again. If you’re with a host like Kinsta, you can push changes live in one click. Remember to take your WooCommerce store out of maintenance mode.

    MyKinsta push staging to live

    MyKinsta push staging to live

  5. Check your logs for any obvious errors resulting from the sync and do a quick check that you can still access the homepage and admin area. If you get a white screen of death or are stuck in some other unrecoverable situation, now is a good time to revert to a previous snapshot of your site and do some problem-solving yourself or seek help.
  6. Run WP Boom again so you’ve got a second set of snapshots. Compare your before and after snapshots to see if anything changed.
  7. Run Robot Ninja again to test that your checkout flow is still working properly.
  8. Perform any other manual (or automated) checks for other functionality on your site such as contact forms.
  9. If you dealt with and fixed any problems earlier while updating your staging site, such as conflicting plugin code and your own custom code, there shouldn’t be too many issues, if any, to fix at this stage.
  10. Do a final visual check if your site and double-check your list of critical URLs and functionality to make sure everything’s working.

And that’s it. Your live site is now up-to-date!

Getting Started with WP Boom

WP Boom is a visual testing and comparison tool built for WordPress. Once set up, you can compare screenshots before and after updating your site, and receive alerts whenever auto-updates cause visual changes to your sites.

WP Boom

WP Boom

To get started with WP Boom, sign up for a free account. After entering your email and password, a modal will pop up asking you to connect a new site.

Sign up WP Boom

Sign up WP Boom

Once you click “Create Site,” WP Boom will get to work taking your site’s first snapshot. It will take a minute or two, depending on how many pages your site contains.

WP Boom first snapshot

WP Boom first snapshot

The page will then refresh and when you click the name of your site you’ll see an overview of your snapshot, including the time it was taken, how many pages are on your site.

WP Boom latest snapshot

WP Boom latest snapshot

When you’re ready to take a second snapshot, simply return to the WP Boom dashboard, select the site you want to snap, and click “Snapshot Selected Sites.”

WP Boom snapshot selected sites

WP Boom snapshot selected sites

A couple of nice features WP Boom includes are the ability to schedule weekly snapshots and weekly email reports that detail any visual changes on your site. This is really useful if you manage a ton of sites and have auto-updates in place. As I mentioned, for a full review check out BobWP’s post: WP Boom. WordPress Updates Made Easier.

Getting Started with Robot Ninja

Robot Ninja is the only automated end-to-end checkout testing tool designed specifically for WooCommerce. We built it to help make WooCommerce testing more accessible and less of a headache for store owners.

Robot Ninja

Robot Ninja

When you connect your store to Robot Ninja, it will run through a suite of comprehensive tests using real products and real payments. To get started, sign up for free, log in to your account and click the big green “Let’s Begin…” button to connect your first store in just 3 steps:

Robot Ninja welcome

Robot Ninja welcome

1. Install the Robot Ninja Helper Plugin.

You can download the Robot Ninja Helper plugin for free at WordPress.org, or just install it via your site’s WordPress dashboard.

Struggling with downtime and WordPress problems? Kinsta is the hosting solution designed to save you time! Check out our features
Robot Ninja WordPress plugin

Robot Ninja WordPress plugin

Once you’ve installed and activated the Helper Plugin, switch back to the browser tab with the Robot Ninja website open and check the field titled “I have activated the helper plugin”.

The text should turn green and the “Step 2” button will become active and also green. Click the “Step 2.” button.

2. Enter the URL for your store.

The next step is to enter the URL for the store you would like to connect to Robot Ninja. Once you’ve entered a valid domain, click the “Check URL” button. Robot Ninja will then do some initial test to make sure it can connect to your site.

Add WooCommerce store

Add WooCommerce store

If you have any issues with it connecting make sure you’ve cleared your WordPress site’s cache after installing the plugin.

3. Authorize Robot Ninja

The third and final step is to allow Robot Ninja to access your site. To do this securely, we use the Application Authentication Endpoint that is already available within WooCommerce.

To begin the authentication process, click the green “Authorize Now” button. You will be redirected to your site’s Authentication Endpoint. If you are not already logged into your site you will be asked to log in. Once logged in, you will be presented with a screen asking to “Authorize” or “Deny” access to Robot Ninja.

Authorize Ninja Robot

Authorize Ninja Robot

After clicking “Approve,” you’ll be presented with a “Congratulations!” message. Click the green “Begin Testing” button to proceed.

Begin testing Robot Ninja

Begin testing Robot Ninja

Now that you’re set up you can:

  • Start queueing up checkout tests and watch as they’re processed in real-time.
  • Schedule automated tests to run when it suits you—every day, week, you set what works for your maintenance schedule.
  • View the results from your last Robot Ninja test.
  • Get email notifications when a test fails, including information about the error, your store configuration, and a screenshot of what a user would see at the time of failure to help diagnose the issue.
  • Test your online store using real products and real payments.
  • Manage and test multiple stores from one account.

Automated Testing Tools

It’s important to test functionality across your site is working properly after making updates, not just your checkout. After all, if a customer fills in a contact form or uses live chat those pieces of functionality are broken, how will you know if you haven’t tested them?

It’s easy to run manual tests—simply click through your site, filling in forms and using your live chat window. To help automate this, put together a list of critical functionality (as I mentioned earlier) as well as instructions for how to manually carry out tests, i.e. open site, navigate to contact page, fill in form etc). This will ensure you don’t miss anything whenever you do a manual test.

If you’d prefer to automate this process, would like to have more control over your automated tests, or have a highly customized site or functionality, I’d recommend checking out Ghost Inspector and UseTrace. Both are great options if you aren’t familiar with PHP and don’t want to mess around with scripts and code.

Ghost Inspector

Ghost Inspector

Both of these options offer similar features for automating your checkout testing. Ultimately, choosing which option you go with will depend on whether you want to use a Chrome extension or an online tool to record your tests.

Alternatively, if you are a developer and like to get your hands dirty, Codeception is a great choice for developers.

Summary

With the right tools, some prep, and a solid checklist in place, you should have no troubles moving forward with regular testing and updating WooCommerce. In order to remove the anxiety around updating WooCommerce, it’s important to demystify the process, which we’ve done here. Hopefully, this guide has provided a solid foundation for keeping your WooCommerce site up-to-date.

I should also highlight that it’s important to test your store’s transactional emails. Check out these 5 different ways to test WooCommerce transactional emails.

Do you use visualization/screenshot tools when updating WooCommerce and WordPress? What other tools and workflows do you use for updates? If you have any questions about testing WooCommerce, let us know in the comments below!