Loading multiple files with require statement on JS

Question

The execution returns the following error when trying to load multiple js:

TypeError: Cannot read property 'get' of undefined

The solution that I am implementing has a login_steps.js:

var LoginSteps = function() {

var LoginSteps = require("../pages/pages.js");
browser.ignoreSynchronization = true;

this.World = function MyWorld() {
    this.page = new LoginSteps();
};

this.Given(/^the page is open$/, function (callback) {
    this.page.login_page.get();
    callback();
});
};

module.exports = LoginSteps;

A page.js where I want to include all the modules that I need.

var Pages = function() {
module.exports = {
    shipments_page: require('./shipments_page.js'),
    login_page: require('./login_page.js'),
};
};

module.exports = Pages;

And the modules login_page.js:

var chai = require('chai').use(require('chai-as-promised'));
var expect = chai.expect;

this.get = function() {
    browser.get('https://aaa/login');
};

this.setEmail = function(value) {
    element(by.id('login-email')).sendKeys(value);
};

this.setPassword = function(value) {
    element(by.id('login-password')).sendKeys(value);
};

this.clickAccede = function() {
    element(by.id('login-submit')).click()
};

shipment_page.js:

var chai = require('chai').use(require('chai-as-promised'));
var expect = chai.expect;

this.pageIsLoaded = function() {
    browser.waitForAngular();
    expect(browser.getTitle()).to.be.eventually.equals('title');
};

Then when I execute the test the log shows

Failures:

1) Scenario: User login - features/login.feature:3
Step: Given the page is open - features/login.feature:4
Step Definition: features/steps/login_steps.js:16
Message:
 TypeError: Cannot read property 'get' of undefined
     at MyWorld.<anonymous> (/Users/mj/IdeaProjects/atpro/features/steps/login_steps.js:17:30)
     at process._tickCallback (internal/process/next_tick.js:61:11)

1 scenario (1 failed)
5 steps (1 failed, 4 skipped)

@Jer, I want to be able to call functions from differents js files from login_steps.js — Mariano Jover, Jul 20 '18 at 15:53

score 1 · Accepted Answer · answered Jul 20 '18 at 21:05

1

Here is the code that you can try. Its works for me. I modified based on your code snippet. I won't use this pattern in my tests though.You may not want to write protractor-cucumber test using the pattern you are following. One should always use validation/assertions in step definition code. if you do validation in page object, even your validation fails, your test still will show passed.

login_steps.js

var LoginSteps = function() {

var LoginSteps = require("../pages/pages.js");
browser.ignoreSynchronization = true;

this.World = function MyWorld() {
this.page = LoginSteps;
};

this.Given(/^the page is open$/, function (callback) {
this.page.login_page.get();
callback();
});
};

module.exports = LoginSteps;

pages.js:

 module.exports = {
 shipments_page: require('./shipments_page.js'),
 login_page: require('./login_page.js'),
 };

answered Jul 20 '18 at 21:05

TwinckleTwinckle

309
1
4

I think I am missing something: Message: TypeError: this.page.login_page.get is not a function at MyWorld. (/Users/marianojover/IdeaProjects/aaa/features/steps/login_steps.js:11:30) at process._tickCallback (internal/process/next_tick.js:61:11) – Mariano Jover Jul 23 '18 at 13:08
did you use this.page.login_page.get or this.page.login_page.get()? – TwinckleTwinckle Jul 23 '18 at 13:59
it worked! I was using this.page.login_page.get() but the problem was in login_page.js – Mariano Jover Jul 23 '18 at 14:23

Silvan Bregy · Answer 2 · 2018-07-20T15:02:04.767

0

If I interpreted correctly this is what you want. You have only to change page.js a little.

module.exports = function() {
   this.shipments_page = require('./shipments_page.js');
   this.login_page = require('./login_page.js');
};

Please try this. I cannot test at the moment :=)

edited Jul 20 '18 at 15:02

answered Jul 20 '18 at 14:53

Silvan Bregy

2,544
1
8
21

Loading multiple files with require statement on JS

2 Answers2