Visual Studio Code, Selenium, Firefox, JavaScript and Mocha with Chai

Let's leave Netbeans IDE to Java and start using lightweight Visual Studio Code for JavaScript test automation.

Preconditions:

• Node.js installed
• Gecko driver downloaded
• path to Gecko driver added to PATH

Download and install Visual Studio Code

Assign some hot-keys to run it without a mouse, for example:

We will try not to use a mouse.

Open Visual Studio Code using the shortcut keys and open Terminal in the editor using the following hot-keys: Ctrl + `  and change the directory, for example cd c:/devel

Visual Studio Code works primarily with folders, so to start new project you need to just create new folder, for example: mkdir selenium_vsc , then change directory to the folder: cd selenium_vsc:

Init node.js project in the folder by the following : npm init -y

Install the libraries:

Mocha:

npm install mocha --save-dev

Chai:

npm install chai --save-dev

Selenium Web Driver:

npm install selenium-webdriver --save-dev

Create test folder:  mkdir test

Change current directory to the folder: cd test

You may use Tab button to autocomplete the folder/file name

Create e2e folder for our end-to-end Selenium tests:  mkdir e2e

Change current directory to the folder: cd e2e

Create new empty file: break > first.test.js

Happy Linux and Mac OS users would just type: touch first.test.js

In the future you most likely will create new files by closing the terminal Ctrl + ` and then Ctrl + N , but now we just learn the Windows console commands.

Open the new file by typing the following: code -r first.test.js

Copy/paste our example code:

const {assert} = require('chai');
const webdriver = require('selenium-webdriver');
const Capabilities = require('selenium-webdriver/lib/capabilities')
        .Capabilities;
const capabilities = Capabilities.firefox();
capabilities.set('marionette', true);

let driver;

describe('Automation Playground tests', async () => {
    describe('When verifying the blog title', () => {
        it('should be equil to Automation Playground', async() => {
            const title = await driver.getTitle();
            assert.equal(title, 'Automation Playground');
        });
    });
});
before(async() => {
    driver = await new webdriver.Builder()
            .withCapabilities(capabilities).build();
    driver.get("https://automation-playground.blogspot.com");
});
after(async() => {
    await driver.quit();
});

Save Ctrl  + S

Go to the project root directory: cd ../..

Open package.json file by typing the following: code -r package.json

Copy/paste the following as script for test:

mocha ./test/e2e/*.test.js --timeout 30000

Save Ctrl + S

Go to the terminal by clicking twice Ctrl + `

Enter to run the test: npm test

The following test scenario will be executed:

• run Firefox browser 
• go to https://automation-playground.blogspot.com 
• verify the blog's title
• close Firefox browser

Test passed !