CODEWITHSUNDEEP
typescriptprotractor
Peter Toth
Peter Toth

Reputation: 770

Custom browser methods in protractor

I'm working on a typescript protractor skeleton and I would like to add a new click, and sendkeys method that are improved than the original ones, here is what I have come up with for the improved click():

import {browser, by, ElementArrayFinder, ElementFinder, ExpectedConditions, Key} from 'protractor';

const actionTimeout = 5000;


ElementFinder.prototype.secureClick = function () {
    return browser
        .wait(ExpectedConditions.elementToBeClickable(this), actionTimeout)
        .then(() => browser.executeScript('arguments[0].scrollIntoView();', this.getWebElement()))
        .then(() => this.click())
        .catch(err => {
            throw new Error(`Expected ElementFinder ${this.locator()} to be clickable. ${err.toString()}`);
        });
};

Now the problem starts when i want to import this document:

import './secureClick'

export async function myFun() {
await somelocator.secureClick()
}

error msg: .secureClick() is not a function

Upvotes: 1

Views: 223

Answers (2)

Peter Toth
Peter Toth

Reputation: 770

The code above is correct, the fault was I did not start protractor with ng, I only tried to run it vanilla. running npm run *folder* solved this issue.

Upvotes: 0

DublinDev
DublinDev

Reputation: 2348

This is not an answer as I still am not sure why your having your issue but this approach is working for me and it was too long to write in the comments. I can see it is successfully clicking the button.

Your implementation will obviously look slightly different as you are using the control flow and not async/await

conf.js

exports.config = {
    framework: 'jasmine',
    specs: ['../tests/editing-prototype.js'],
    SELENIUM_PROMISE_MANAGER: false,
    onPrepare: () => {
        let { ElementFinder } = require('protractor');

        ElementFinder.prototype.newClick = function () {
            console.log('new click');
            this.click();
        }
    },
}

editing-prototype.js

describe("Homepage", function() {
    it("Navigate to homepage", async function(){
        await browser.get("http://www.angular.io");
        await browser.driver.sleep(5000);
        await $('.homepage-container a[href="start"]').newClick();
        await browser.driver.sleep(5000);
    });
});

Output

C:\ProtractorProjects\IssueChecker>node_modules\.bin\protractor configs\conf-2.js
[12:58:01] I/launcher - Running 1 instances of WebDriver
[12:58:01] I/local - Starting selenium standalone server...
[12:58:03] I/local - Selenium standalone server started at http://{ip}/wd/hub
Started
new click
.


1 spec, 0 failures
Finished in 11.642 seconds

Upvotes: 1

Related Questions