Environment Configuration | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Introduction
Instructor: Artem Bondar
Lesson Summary
In this lesson, we will configure a development environment to run Playwright on your computer. The three essential components needed are: Node.js Visual Studio Code Git 1. Installing Node.js Node.js allows JavaScript to run outside of the browser, enabling the development of various applications. To install Node.js: Search for Node.js on Google and visit nodejs.org . Choose to install using either NVM (Node Version Manager) or the pre-built installers. For most users, the pre-built installers are recommended. Select your operating system (macOS or Windows) and architecture (x64 or ARM64) and download the installer. Install Node.js, ensuring to select the LTS version for stability. 2. Installing Visual Studio Code Next, install Visual Studio Code : Search for Visual Studio Code (not Visual Studio) and download the appropriate version for your system. Follow the installation prompts to complete the setup. 3. Installing Git Check if Git is already installed by running git -v in your terminal. If not installed: Search for Git SCM and download the installer for your operating system. For Mac users, install Homebrew first, then use it to install Git with brew install git . 4. Validating Installations After installation, open Visual Studio Code and validate that Node.js is installed by running: node -v Also check the NPM version with: npm -v 5. Installing Playwright Extension Finally, install the Playwright extension for Visual Studio Code to manage tests easily: Open the extensions panel and search for Playwright . Click Install to add the extension. With these components installed, you are ready to proceed to the next lesson!
Video Transcript
Hey guys, in this lesson, we will configure development environment so you can run Playwright on your computer. And for that, we're gonna need three components. It will be Node.js, Visual Studio Code, and Git. All right, so let's jump into it. Open browser and let's search for the first component, which is Node.js in Google. I hit Node.js, and the very first URL in the search, nodejs.org, open this guy. So a couple of words, what is Node.js? So Node.js is the virtual environment to be able to run JavaScript outside of the browser. Initially, when JavaScript or TypeScript language was created, it was created only to be executable inside of the browser. But when the Node.js was created, it allowed to pull out the language from the browser and empower developer to create completely new types of the applications. So this is the power of the Node.js. And since Playwright runs on JavaScript and TypeScript, this is one of the language that it supports. We're gonna use Node.js to actually run this on our computer. So click on Install Node.js right here, and you have two options how you can install. Option number one, it suggests to install using NVM. NVM is the cross-platform Node.js version manager. I would say this is kind of more complex side, because if you want to manage several Node version in your computer, you can go that route. But if you want more simple approach, which would work for most of the user, I would suggest go with the pre-built installers right here. So you can choose which operating system, macOS or Windows over here. And also you can choose the architecture. For example, for macOS, you can choose either x64 for Intel processors or IRM64 for Apple silicons. And same thing for Windows. You click on the Windows and select x64 is for the Intel chips, IRM64 for newer Qualcomm chips, and x60 is for 32-bit system. So it's pretty old one. So use either 64 or IRM. And that's it. Then you just download the installer. For example, I am on Mac, so I download Mac Installer. I just open this guy, and installer would look like this one. And you just accept everything by default, Agree, Agree, Install. I need to enter my password. Installing the files. And that's it, installation is complete. You can move this to trash. So very, very simple. One important note that please install the LTS version of Node.js. Because if you check the dropdown, there is also current version of the dropdown. Do not install the current version. Even it has version 24, it may seem like it's a newer version. It's kind of yes, but this version may have compatibility issues and could just don't work properly on your system. So always install LTS version. So as of today is 2216.0, so please remember that. All right, we are moving to the next step. So the next step after the installation, we need VS Code. VS Code, search for that. And please make sure that you are not searching for Visual Studio. You need to download Visual Studio Code. This is two separate code editors. So download Visual Studio Code. And again, you can download for Mac or other platforms are also available for Windows, for Linux, for Mac. Download for your system, for your chip. If you are Intel chip or Apple Silicon or X64 or IRM64, so choose the right installer and the same thing. Just download it, install, and it will be installed on your computer. And the last thing is Git, but maybe Git is already installed. So I would suggest to just check if you already have Git installed. It's very simple. Just open the terminal or command prompt on your computer and type git-v and hit Enter. If you see something like this, for example, in my example, I have 2.43. It's a Git version. Then you are all set, Git is already installed. If you don't have it, here's how you install Git on your computer. So search in the Google Git SCM, and the very first URL will be git-scm. Then again, for Windows, installation will be quite simple. So here you click on Windows Build, and you have two installers, Git for Windows X64 or Windows IRM64. Just download and install as usual. For Mac users, it will be a little bit more complicated, because it doesn't have direct installer. Before you need to download and install Homebrew. So Homebrew is the package manager, very convenient, by the way, to install absolutely different packages through the command line. So to install the Homebrew, you need to copy this line over here, then navigate to the terminal, paste this line over here, and execute. This will automatically will install Homebrew on your computer. And the end of the installation, there will be couple more lines in the terminal, watch them out, that you will need to execute to add Homebrew into the path on your Mac. So just execute those two commands that will be printed in the terminal, and you will be all set. After you've done all this, you just go back and copy this command, brew install git, paste it into the terminal, run it, and Git will be installed on your computer. And as always, you just need to validate git-v to make sure that Git is installed. All right, after you've done all this, you need to open Visual Studio Code and just validate that Node was also installed successfully. So this is the Visual Studio Code that we downloaded before. And just open a new terminal session right here, and type just node-v. And I have Node 22 installed on my computer, and you also can check the NPM version, npm-v, and I have NPM version 10. And one last component that you need to install is the Playwright extension for Visual Studio Code. So navigate over here to this extensions bar, click on here, and type Playwright. Playwright for Visual Studio Code, click over here, and you will need to install this extension. Currently, I already installed it on my computer, so just click here, Install, and you will see the test runner icon will show up over here after the installation. So using Playwright extension, you will be able to conveniently manage the test, run the test, see the test result execution, manage the projects, and so on. All right, we are all set, and we are ready to move to the next lesson.