SDET Unicorns

WebdriverIO v7 Released | Upgrade your Project from v6 to v7

WebdriverIO Version7

Table of Content

WebdriverIO recently came out with v7, in this post, I will quickly go over some of the high-level changes that are part of this release. I will also cover how you can upgrade your WebdriverIO v6 project to v7.

WebdriverIO v7

  • TypeScript Rewrite – The biggest change they have made for this release is that they have rewritten all the WebdriverIO code in Typescript. Now if you are a Typescript lover, this is great news for you as you will get better type support with WebdriverIO now.
    For everyone else that is still using JavaScript with WebdriverIO, it’s still good news as part of this rewrite they have fixed lots of bugs that you might have encountered when using WebdriverIO.
    So for typescript projects, there are a couple of changes you will need to make which you can read about over here.
  • Dropped support for Node v10 – It’s recommended now to upgrade your Node version to v14 or higher
  • Chrome DevTools Service – Few changes have been made in the dev tools service to improve Google LightHouse Integration for the UI performance tests and new support has also been added for checking if your app supports the PWA standards.
  • Compiler – With  v7 they have made using compiler tools like Babel and Typescript a lot easier. It will automatically configure everything for you as long as you have installed the necessary babel and typescript packages. So no more wasting time on configuring stuff.
  • Docs – They have a new website now with improved documentation
    • Support for dark mode
    • New Community section – you can also find the resources section in this if you are looking for resources to learn about WebdriverIO, along with my Tutorial Series on YouTube

To learn more about the changes that are part of the v7 release, you can check out the official blog here.


Upgrade your project from v6 to v7

Now, let’s talk about the upgrade, so the good thing is the upgrade is extremely easy and it should not break any code for you if you are using version 6 with JavaScript. For Typescript folks as I mentioned earlier, you might have to make few changes to get everything up and running.

Now the tutorial series that I have built on WebdriverIO is using v6, you can still go ahead and continue to watch those as none of those have been changed. So you probably fit in one of these 2 scenarios –

  1. You are starting off with learning WebdriverIO, if that’s the case then when you will install WebdriverIO, you will automatically get v7 and then you can just continue on with watching the rest of the videos.
  2. Or, you have already watched some of my videos and you are using v6 then you will need to upgrade to v7 which I will cover on how you can do that. Just so you know you don’t have to switch to v7 but I would still recommend you to do that as you will get access to all the new features and bug fixes that were made as part of this release.

I have upgraded my existing GitHub repository that was built using WebdriverIO v6 to v7. Here are the steps I took to do that –

  • Used npm-check-updates package to check all the dependencies that need to get updated
  • Deleted node_modules package
  • Updated the package.json using ncu -u command
  • Re-installed all the new packages

After the upgrade, I ran the tests again and everything worked successfully.


Check out the video below to learn more about WebdriverIO v7 and the upgrade –


I hope this post helped you out, let me know if you have any questions in the comments below!

Happy Testing!

My Resources

Thrive Suite: The all-in-one WordPress theme I used to create my blog.
Jasper AI: My favorite AI writing tool.
Surfer SEO:  A tool to help you rank your content on the first page of Google.

Write Content Faster

5/5

Write blog posts that rank for affiliate terms!

Join our mailing list

Unlock the Secrets to Becoming a SDET Pro in the Industry!

Stay ahead of the curve! Join our mailing list for exclusive insights, tips, and the latest industry updates delivered straight to your inbox

Table of Content

Related Post

image

Common Types of Software Bugs

Dealing with bugs is one of the biggest headaches in the software development lifecycle. No matter how carefully someone writes code, it’s impossible to create a software product that works perfectly every time. Skipping detailed testing often causes major issues later on.

Read More »
How to inspect elements in Chrome?

How to Inspect Elements in Chrome?

Understanding how to use the “Inspect Element” feature in Chrome is a critical skill for web developers and designers alike. This tool is indispensable, no matter what web development task you’re tackling.

From resolving layout issues and debugging JavaScript to analyzing a webpage’s structure, Chrome’s Developer Tools’ “Elements” panel offers a robust suite of functionalities that enable you to delve into the HTML, CSS, and JavaScript that power websites.

Read More »