Javascript based E2E test framework — Codeceptjs — Part I — Basics
Selenium is the most widely used library for UI-based E2E automation and there are many frameworks available based on it.
Some of the popular E2E frameworks are,
Nunit, SpecFlow (BDD-driven) → C#
capybara, rspec → Ruby
TestNG, Cucumber (BDD-driven) → Java
codeceptjs, testcafe, protractor → Javascript
Codeceptjs is one of the promising framework, that can be used for automation and that’s what we are gonna dig deep in this article.
Any automation framework needs the following things as mandate,
- Element Identification (selectors / locators)
- Parallelism
- Categorization / segregation
- Debugging
- Reporting
- CI Integration
- Support
We will see how codeceptjs contributes towards all these aspects in part II.
For now, initiate a project and get into a little action.
Into the codeceptjs
Codeceptjs website and github page,
→ CLI — to initiate a project, to generate test, to run tests
→ codecept.json — config for codeceptjs
→ pages / tests — to maintains page objects and test files
→ helpers — to choose more relative webdriver tools like protractor, puppeteer, webdriverIO
Dependencies
Install npm on your machine
Install selenium-standalone, codeceptjs npm packages (install globally)
Setting up selenium-server
Codeceptjs needs selenium server to manage browsers / webdrivers. By using this option from codeceptjs, gives us some leverage to go either with selenium-standalone or selenium grid
install and run commands — selenium-standalone
selenium-standalone install
selenium-standalone start
run commands — selenium-grid
selenium-standalone start — -role hub
selenium-standalone start — -role node -hub http://localhost:4444/grid/register
The install command installs chrome, firefox-gecko and some other drivers in the system
The run command are in two forms, either standalone / grid, use respective commands
Now, you have a selenium server up and running.
Preparing codeceptjs project
codeceptjs has CLI, which quickens the onboard process
cd to your project folder, then do the below
type codeceptjs init → will ask the path for tests and pages, ask for project name and helpers to use (webdriverio / puppeteer / protractor — will look into this in part II), for now select webdriverio
type codeceptjs gt → to generate tests (provide some testcase name)
Now, you have a test project to run on selenium-server
Creating your first test
Once you have created the test with your codecept CLI, it will have a basic skeleton for a test
Consider “Feature”s as test class and “Scenario”s as test case
Feature → accepts text as param to name the test class / to categorize your tests
Scenario Name → 1. Accepts text for test case name
2. Accepts object as param for data driven tests
I → Codeceptjs calls it as “Actor”, since it holds all core functions to it. I is something similar to driver object, what we usually see in selenium.
Below mentioned, is the sample for a test case,(code should go inside scenario)
I.amOnPage(‘http://abc.com’);
I.fillField(‘#username’, ’codeceptjs’);
I.fillField(‘#password’, ’123456’);
I.click(‘Login’);
I.seeCurrentUrlEquals(‘/success’);
I.see(‘Welcome’);
The action methods from I looks more BDD-driven. In part II, we can cover more about using codecept’s action methods.
Running your test
Once you have prepared your test scenario, use codeceptjs’ CLI to run your tests
cd to your project
codeceptjs run [filename.js]
add option — — debug to get step by step output in console
Things to look forward in next part of this article,
How codeceptjs handles the must need features of any “E2E automation framework”
Grep-ping your test based on categories / names and running segmented tests
More into, assert | navigate | locate action methods
Extending your tests via page objects / dependency injection / step files
Support me and tell me your suggestions to improve the upcoming articles.
