Top 5 Alternatives to Protractor

Protractor has been one of the most popular JavaScript end-to-end automation testing frameworks. Built with NodeJS, the initial version of Protractor was released in 2013. Protractor uses JavaScript Selenium WebDriver bindings. Protractor started out as a prototype of a testing framework. But as AngularJS evolved, Protractor also quickly became popular due to unique features like being open-source, easy to set up, and having out-of-the-box support for all major browsers. 

Until its deprecation, Protractor supported the automation of both Angular and non-Angular-based applications. Having been around for almost nine years, millions of users worldwide still use the Protractor framework.

Angular Team Announces End of Protractor Development

• According to the Protractor’s announcement on Github, the Angular team will stop the development of Protractor by the end of 2022 in conjunction with Angular v15.
• This means that users need to migrate from Protractor since there will not be any further updates to the framework.
• This also means the Angular team will not consider bugs or feature requests.
• Users may end up with disruptions in their automation scripts by continuing to use Protractor.

Why was Protractor deprecated?

Protractor was created in 2013. During that time WebDriver APIs were not yet standard; because of this, testers and developers faced difficulties in writing end-to-end tests as there was very little support for async/await. Protractor used Control Flow to overcome these challenges by wrapping the Selenium Webdriver API. 

• Today JavaScript has evolved a lot, and Protractor is experiencing difficulties leveraging newer technologies.
• There are modern tools that provide better syntax and development platforms, such as IDE, Debugging, etc.
• Considering this, if the Protractor team were to continue supporting the framework, they might have had to reshape the current architecture and code, which would have impacted existing users and tests.
• Since multiple alternative tools are already built on advanced JavaScript frameworks, the Angular team surmised that switching from Protractor to another tool might be more accessible.
• The team surveyed automation tools before deciding on Protractor deprecation, and the survey revealed that less than 20% of responders were using the Protractor framework for testing in their projects.

Top 5 Alternatives Automation Tools for Protractor

Since Protractor is deprecated, existing users must migrate their tests to other frameworks. Listed below are five frameworks with features similar to Protractor, such as being open-source, support for JavaScript/TypeScript, support for both MVC and Single Page Applications, and NodeJS, among others. Please note that this list isn’t exhaustive or ranked. 

Top 5 Protractor alternatives to migrate Protractor tests to: 

1. NightwatchJS
2. Cypress
3. Playwright
4. TestCafe
5. WebdriverIO

Note: The list above is not exhaustive and isn’t ranked.

Let’s take an example of Protractor test code and explore how it looks in other frameworks, along with each framework’s pros and cons.

Protractor Sample Code Snippet

describe("Pricing Page", function () {

  it("Verify Pricing Page", function () {

    browser.waitForAngularEnabled(false);

    browser.get('https://www.browserstack.com/');

    element(by.css('a[title="Pricing"]')).click();

    expect(element(by.css('div h1')).getText()).toContain('Replace your device lab and VMs');

  });

});

1. Nightwatch.js

Nightwatch.js is an automation testing framework. It is built on Node.js and uses the W3C WebDriver API. Much like Selenium, it supports multiple browsers. NightWatchJS aims to simplify test creation and setting up of CI/CD pipelines. It can be used to create unit, integration, and end-to-end tests.

Nightwatch.js Statistics

• Stars: 11.4K
• Fork: 1.1K
• Used By: 143K
• Contributors: 112
• Weekly downloads: 205,832

Data Source: NightwatchJS Github and NPM

Advantages of Nightwatch.js

• Easy Setup: Nighwatch.js follows an easy setup process. Just install the npm package and start testing.
• Browser Support: Nightwatch.js supports all major browsers like Chrome, Edge, Firefox, and Safari.
• Multi-level Testing Support: Nightwatch.js can be used for unit testing, integration testing, and end to end testing.
• Cloud-Based Testing: Nightwatch.js supports cloud-based testing platforms like BrowserStack, etc.
• Parallel Testing: Nightwatch.js provides a feature called command-line test runner which can run tests either sequentially or in parallel. It also provides additional features like retries and implicit waits.
• Grouping and Organizing Tests: One can organize or group tests by creating test suites and tags.
• Page Object Model: Nightwatch.js supports Page Object model. Testers can organize and manage tests more effectively using CSS and XPath selectors.
• Continuous Integration: Nightwatch.js tests can be integrated with popular CI/CD tools like Azure DevOps, TeamCity, Jenkins, etc. It has a built-in JUnit XML reporter so publishing results is much easier. 
• Easy to Extend: Nightwatch.js has a flexible command and assertion framework, making implementing an application’s custom commands and assertions easy.
• Easy Syntax: Nightwatch follows a distinctly user-friendly syntax. It’s easy for beginners to start creating automation tests. Detailed documentation helps with learning how to navigate the tool quickly.
• Frequent Releases: Nightwatch.js actively adds new features and fixes issues. Frequent releases can be observed on GitHub to this end.
• Open-Source: Nightwatch.js is an open-source framework that comes with an MIT license.

Limitations of NightwatchJS

• Programming Language: Nightwatch.js supports only Javascript/Typescript.
• Lack of community support: As of the publication of this article, community support is somewhat limited.
• Selenium Dependency: Any complexities a tester faces with Selenium will follow them to Nightwatch.js.
• Native Mobile Apps: NightWatch.js does not support native mobile app automation.

Code Snippet

module.exports = {

    'Verify Pricing Page' : function(browser) {

      browser

        .url('https://www.browserstack.com/')

        .waitForElementVisible('a[title="Sign In"]')

        .click('a[title="Pricing"]')

        .assert.containsText('div h1', 'Replace your device lab and VMs')

        .end();

    }

  };

2. Cypress

Cypress is an open-source JavaScript-based test automation framework built on NodeJS. Built for the modern web, Cypress operates directly in the browser so it’s easy for developers to work with. It provides many unique DOM manipulation and debugging techniques. 

Cypress runs tests (written in JavaScript) in its unique and interactive window. It supports different types of testing, such as end to end testing, unit testing, integration testing, and API testing. Since it is a NodeJS-based framework, testers must have Node runtime executables in their system to execute Cypress tests.

Cypress Statistics

• Stars: 43.6K
• Forks: 2.9K
• Used By: 846K
• Contributors: 441
• Weekly downloads: 5,034,849

Data Source: Cypress Github and NPM

Cypress Advantages

• Time Travel: Cypress runs in its window and takes snapshots as the tests run. Hover over commands in the Command Log to analyze what happened in each step.
• Debuggability: Cypress provides various options to debug, such as logging, browser developer windows, and detailed stack traces.
• Automatic Waiting: With Cypress, you do not need to provide explicit wait. Cypress automatically waits for commands and assertions before executing the next command.
• Spies, Stubs, and Clocks: Cypress supports spies, stubs, and clocks which help verify and control the behavior of functions, server responses, or timers.
• Network Traffic Control: Cypress provides various ways to control network traffic, which allows users to test edge cases. 
• Consistent Results: Since Cypress uses its browser control strategy, it is comparatively fast and consistent and runs flake-free reliable tests.
• Screencaptures and Videos: Cypress provides options to take screenshots and capture videos. This option is present in the command line, a.k.a Cypress CLI.
• Cross browser Testing: Cypress supports running tests on Edge, Firefox, and Chrome-family browsers like Electron.

Limitations of Cypress

• Programming Language: Cypress Supports only JavaScript/Typescript.
• Multiple Tab: Cypress does not support multiple tabs or the ability to switch to Parent and Child windows.
• Native Mobile Apps: Cypress does not support native mobile app automation.
• iframe Support: Cypress support for iframes is limited.
• Parallel/Concurrent Execution: Cypress doesn’t support parallel execution of tests on the same or multiple browsers.
• Single Origin Tests: Users cannot create tests under different origins or URLs. Tests must always be in line with single origin. 
• Selector Support: Cypress supports only CSS selectors natively but there are third-party packages that can be plugged to use XPath.
• Assertion Libraries: Cypress supports only Mocha and Chai assertion libraries. 
• Third-party authentication: If testers have to test third-party authentication mechanisms like SSO or Active Directory login, these functions cannot be automated. QAs need to use API calls to create login sessions.

Code Snippet

describe('Pricing Page', () => {

    it('Verify Pricing Page', () => {

        cy.visit('https://www.browserstack.com/');

        cy.get('a[title="Pricing"]').first().click()

        cy.get('div h1').first().should('contain.text', 'Replace your device lab and VMs')

    })

})

3. Playwright

Playwright automation testing framework by Microsoft enables fast, reliable, and capable automation across browsers such as Chromium, Safari(Webkit), Edge, Firefox, and more. Playwright supports multiple programming languages like Java, C#, TypeScript, JavaScript, and Python.

Playwright is still evolving, but due to the robust nature of its already available features, the framework has gained thousands of users.

Playwright Statistics

• Stars: 52.2K
• Fork: 2.8K
• Used By: 29.6K
• Contributors: 428
• Weekly Downloads: 269,653

Data Source: Playwright Github and NPM

Playwright Advantages

• Browser Support: Playwright supports all major browsers – Chrome, Safari(Webkit), Edge, and Firefox.
• Safari Testing on Windows and Linux: Playwright supports testing the Safari browser in Windows using WebKit open source builds for Windows, Linux, and macOS. These features are also supported in CI pipelines.
• Headless/Headed mode: Playwright supports headless and headed modes. The headed mode can be used for debugging, and since the headless mode is faster, it is well-suited for CI/cloud executions.
• Auto-wait APIs: Playwright waits for elements to become ready for interaction. This feature simplifies tests and reduces flakiness.
• Parallelization: One can use a single browser instance for multiple parallelized, isolated execution environments via simple configuration.
• Element selectors support: Playwright can rely on user-facing text content and accessibility labels to select elements. 
• Cross-domains, pages, and frames: Playwright is not limited to domain, opening new windows or iframes. Cypress’s major drawback is addressed in Playwright.
• Stub and Mock: Playwright supports network interception to stub and mock network requests.
• Modern web support: Playwright supports various ways to work with modern web components –  shadow-piercing selectors, geolocation, permissions, web workers, and other web APIs.
• Supports Edge Cases: Playwright supports edge cases such as file downloads and uploads, iframes, native input events, and dark mode.
• Debugging tools: Playwright provides multiple tools such as editor debugger and browser developer tools.
• Language Support: Playwright supports multiple programming languages such as Node.js, Python, .NET, and Java.
• Selectors: Playwright supports different types of selectors, including CSS and Xpath.

Limitations of Playwright

• Community Support: Playwright is a new tool, limiting community support.
• Still Evolving: One may encounter challenges while writing end-to-end tests as Playwright APIs are still evolving. However, if you face issues, you can raise a bug/feature request in Git to resolve it.
• Inadequate Safari Browser Support: Playwright supports running tests on WebKit (open-source), which is not an actual Safari browser.

Code Snippet

test('Pricing Page', async ({ page }) => {

await page.goto('https://www.browserstack.com/');

await page.click('a[title="Pricing"]');

await page.waitForSelector('div h1');

await expect(await page.innerText('div h1')).toContain('Replace your device lab and VMs');

});

4. TestCafe

TestCafe is an open-source JavaScript test automation framework built on NodeJS. It doesn’t use Selenium Webdriver or any external tools to run tests. TestCafe runs on the Node.js platform and uses browsers installed on the tester’s system.

TestCafe is mainly used for end-to-end testing but can also be used for API testing. It uses Javascript for writing tests and it has its own set of assertions – third-party assertion libraries are not supported out of the box at the moment. Since TestCafe is built on NodeJS, one must install NodeJS runtime executables to run Testcafe scripts. 

TestCafe Statistics

• Stars: 9.6K
• Fork: 684
• Used by: 12.6K
• Contributors: 117
• Weekly Downloads: 246,268

Data Source: Testcafe Github and NPM

TestCafe Advantages

• Easy setup: TestCafe setup is easy and quick. 
• No dependency: TestCafe doesn’t depend on third-party libraries like Webdriver or external jars.
• Easy Test Script Creation: TestCafe command chaining techniques make testing easy. It uses friendly and simple syntax so the number of lines (as needed by other frameworks) can be reduced to half.
• Quick and Stable: TestCafe tests are faster than other frameworks as they are executed inside a browser. It uses an internal simulation of events using Javascript so tests are comparatively stable.
• Request Mocking: With TestCafe, one can emulate HTTP responses, feed sample data into the application, analyze connectivity issues and downtime cheats.
• Multiple Tab/Window Support: TestCafe provides features that allow automation of the user action in which a user switches between multiple windows/tabs.
• iframe Support: TestCafe supports iframes and allows users to and from iframes.
• Parallel Testing:  TestCafe tests can be run parallelly by enabling concurrency mode.
• No External Waits: TestCafe waits automatically for an element to appear before interacting so there is no need to put external waits.
• Browser Support:  TestCafe supports many browsers like Edge, Firefox, IE, and Chromium-based browsers.
• Debuggability: TestCafe provides Live Mode, which helps visualize individual actions on the browser.
• Screenshots: TestCafe supports taking screenshots of tests using built-in screenshot commands.

Limitations of TestCafe

• Programming Language: TestCafe supports only Javascript/Typescript.
• Assertion Libraries: TestCafe supports only built-in assertion libraries.
• Selector Support: By default, TestCafe only supports CSS selectors.
• Execution of Tests: Browsers are unaware that they run in test mode. So there are chances that automation control can be disrupted. Analyzing or debug issues arising from such a scenario can be quite difficult.

Code Snippet

fixture`Pricing`

  .page`https://www.browserstack.com/`;

test('Verify Pricing Page', async t => {

  await t

    .click('a[title="Pricing"]')

    const myText = Selector('div h1').innerText

    await t.expect(myText).contains('Replace your device lab and VMs');

});

5. WebdriverIO

WebdriverIO is an open-source end-to-end automation framework that supports modern web and native mobile applications. WebdriverIO uses Selenium bindings. The OpenJS foundation manages it and follows W3 framework architectural standards.

Though WebdriverIO uses Selenium bindings, it provides a ready-made framework with easy setup and configuration. Using WebdriverIO, testers can create a scalable, robust, and stable test suite. 

WebdriverIO Trends

• Stars: 6.9K
• Forks: 2K
• Used By: 34.1K
• Contributors: 369
• Weekly Downloads: 854,415

Data Source: WebdriverIO Github and NPM

WebdriverIO Advantages

• Extensible: WebdriverIO allows you to add helper functions or combine complicated commands to build your custom functions.
• Multi-Browser Testing: WebdriverIO supports multiple browsers like Chrome, Edge,  Firefox, etc.
• Multi-Platform Support: WebdriverIO supports many operating systems such as Mac and Windows.
• Mobile Apps Support: This is a unique feature of WebdriverIO. It supports mobile application testing. One can test mobile applications just by using certain configurations.
• Assertion Library: WebdriverIO supports assertion libraries such as Jasmine, Mocha, etc. 
• Multiple Window and iframe Support: WebdriverIO supports the automation of scenarios that contains multiple tabs/ multiple windows and iframes.

Limitations of WebdriverIO

• Language Support: WebdriverIO Supports only Javascript/Typescript.
• Setup: Setup may take some time if the user is setting up a web driver for Typescript.
• Documentation: Though there is good documentation, it may be inadequate for beginners.
• Syntax: Syntaxes are confusing if you have worked on other tools.

Code Snippet (Webdriver Jasmine)

describe('Pricing Page', () => {

  it('Verify Pricing Page',async() => {

    await browser.url('https://www.browserstack.com');

    await (await $('a[title="Pricing"]')).click();

    await expect(await((await $('div h1')).getText())).toContain("Replace your device lab and VMs")

  });

});

What to use instead of Protractor?

Since Protractor is being deprecated, Protractor users don’t have an option other than migrating to alternate frameworks, but the question is “Which is the best alternative to Protractor?”

There is no singular answer to the question because each organization designs, develops, and tests software in its own way, with unique elements dominating UI Design, Workflow, the Tech Stack used, Architecture, etc.

However, a few best practices should be considered to evaluate your organization’s most suitable automation framework.

Points to Consider while evaluating alternatives to Protractor

1. Gather the overarching Organizational Requirements carefully and define a scope.
2. Conduct an in-depth analysis to identify the trade-offs and limitations of each framework. Analyze if a certain framework’s limitation will be a dealbreaker for the requirements above.  
3. Consider the learning time involved in mastering a new automation framework.
4. Since you are migrating from Protractor, you need to consider migration efforts.
5. Community support and documentation play an important role. For example, if you get stuck with writing test scripts, you might need to get answers or workarounds from the community or support team.
6. Never go with trends or popularity. The most popular framework may not be the best framework for your organization. Don’t decide until you create the POC and conclude. 
7. Don’t assume anything. Always create a small POC with real-time test cases relevant to your organization, and decide accordingly.
8. Check Github and the framework’s official website. How active are the contributors? Are there frequent releases?
9. Consider if a framework supports native mobile app testing – if your organization demands the same.
10. Analyze the different types of reporting frameworks supported by each tool. They must be sufficiently powerful to support the team and the organization. 
11. Ensure that the tool supports CI/CD Integration.