0
votes

I am completely new to cucumber and protractor, never having written any e2e tests before. I am using this libaray for Angular but am experiencing all kinds of difficulties when running the tests.

My step file looks like this:

const {Given, Then} = require('cucumber');
const expect = require('expect');

Given('I navigate to the homepage', function (callback) {
  browser.get('http://localhost:4200');
  callback();
});

Then('I want to see a welcome message', function (callback) {
  expect($$('h1').first().getText()).toEqual('Welcome!');
  callback();
});

but it appears that getText() is an asynchronous call. getText() appears to be returning a promise.

This test should fail because the text of the h1 is not Welcome!. When I try to capture the promise and expect() in then(), the test succeeds where it should fail.

There are so many resources on the web around cucumber/protractor, all saying different things. It's difficult to know how to get going. The actual cucumber documentation does not give examples of testing browser elements like this.

Can anyone help? I am using protractor-cucumber-framework 6.1.1 and cucumber 5.0.1.

2

2 Answers

0
votes

Explore the dom and see if there is another h1 element that have text "Welcome!". It is not possible the test to pass and there is no such element with that text.

0
votes

Change below step function as following:

Then('I want to see a welcome message', function (callback) {
    $$('h1').first().getText().then(function(txt){
        console.log('in then() txt: ' +txt);
        expect(txt).toEqual('Welcome!');
        callback();
    });    
});

Add more one line Then I want to see a welcome message 1 into your scenario, and add below step function for it.

Then('I want to see a welcome message 1', function (callback) {
    expect($$('h1').first().getText()).resolves.toEqual('Welcome!');
    callback();
});

Run again and tell me the result and the output of console.log('in then() txt: ' +txt)