Protractor Cheatsheet

Cheatsheet

Installation of protractor:

• Install Node.js
• Check Node.js version in command prompt (node --version)
• In command prompt give, npm install -g  protractor (-g = install globally in your system)
• Check protractor version (protractor --version)
• In command prompt, webdriver-manager update
• webdriver-manager start
• Then selenium server will start and you can verify at http://localhost:4444/wd/hub

Write test case in Protractor:

Protractor needs 2 files:

• conf.js - specify the configurations (browser, screenshots, reports, capabilities etc.,.)
• spec.js - write your test cases

testSpec.js

describe('Protractor cheatsheet', function () {
    it('First test case', function () {
      //code here    });
    it('second test case', function () {
      //code here    });
});

testConf.js

exports.config = {
    seleniumAddress: 'http://localhost:4444/wd/hub',
    specs: ['testSpec.js']
};

Run test case in Protractor:

• protractor conf.js

browser commands:

browser.get("url") - Load url

browser.refresh() - reload current web page

browser.sleep(2000) - suspend execution in milliseconds

browser.close() - closed current window

browser.getCurrentUrl() - return current web page url

browser.getTitle() - return current web page title

browser.switchTo().frame(element(by.tagName('iframe')) - switches to frame
Capabilites:
capabilities: {
    'browserName': 'chrome',
   // 'browserName': 'firefox',
}

Connect directly to browser driver:
exports.config = {
    directConnect: true,
    // seleniumAddress: 'http://localhost:4444/wd/hub',
     capabilities: {
        'browserName': 'chrome',
    },
}
directConnect=true :: Communicates directly to only Chrome or Firefox driver,by selenium server i.e.,. no need to start selenium server explictly
 Ignore SeleniumAddress & seleniumServer Jar
directConnect=false :: It considers seleniumAddress and need to start selenium server explictly
Locators:

var iDwebElement = element(by.id('idLocator'));
var xpWebelement= element(by.xpath(".//span[contains(text(),'xpath locator')]"));
var cssWebelement= element(by.css('input[value=cssLocator]'));
var cnWebelement= element(by.className("className"));
var listWebElemets=element.all(by.css("all locators")); // return array of web elements
var pltWebelement=element(by.partialLinkText("partila ltext locator"));
var pBtntext = element(by.partialButtonText('btntext'));
var BtnText=element(by.buttonText('Btntext'));
var ngrepeatWebelement= element(by.repeater('one in Tens');
var ngexactrepeater=element(by.exactRepeater('repeat in exact')
var cssTextWebelement = element(by.cssContainingText('.class', 'Text'));
var allOptionsWebElement = element.all(by.options('one for one in numbers'));
var modelWebelement = element(by.model('ng.modellocator'));
var ngBindWebelement = element(by.binding('ng-bindlocator'));
var TagNameWebelement=element(by.tagName('div'));
var nameWebelement = element(by.name('nameLocator'));
Custom Locator: we can create your own locator
by.addLocator('yourOwnLocator', function (eleText, parentEle) {
    var using = parentEle || document;
    var spanText = using.querySelector('span');
    console.log(eleText+"==="+spanText);
    return span;
});
var customLoct=element(by.yourOwnLocator("eleText"))
element:

var webElementVariable=element(by.xpath("some text"));
var ListOfElementsWebelement= element.all(by.xpath("some xpath for list of elements"));

webElementVariable.getText() //return text of a element
webElementVariable.clear() //it will clear text in element
webElementVariable.sendKeys("enterText") //will send text in textfield
webElementVariable.isEnabled() //return its enabled or disabled (true or false)
webElementVariable.isSelected() // return whether it is selected or not
webElementVariable.submit() // submit if element is in form
webElementVariable.getTagName() // return tag name of element
webElementVariable.getAttribute("class") //return attribute value
ListOfElementsWebelement.count() // it will number of elements(size)
ListOfElementsWebelement.first().click() //will click first element in a list
ListOfElementsWebelement.last().click() //will click last element in a list

Protractor Waits:
var webElementVar=element(by.xpath("some element"));

var until= protractor.ExpectedConditions;

browser.wait(until.alertIsPresent(), 5000);  //waits for alert popup
browser.wait(until.elementToBeClickable(webElementVar, 4000)); //wait for element to be clickable
browser.wait(until.textToBePresentInElement(webElementVar, "expectedText"), 4000, "expectedText" + "is not present in element"); //wait for element contains text
browser.wait(until.textToBePresentInElementValue(webElementVar, "expectedValue"), 3000, "expectedValue" + "is not present in element"); //wait for element contains value
browser.wait(until.titleContains("expectedTitle"), 4000, "expectedTitle" + " is not present in element"); //wait for page title contains "expectedTitle"
browser.wait(until.titleIs("expectedTitle"), 4000, "expectedTitle" + " is not matched"); //wait for title should be "expectedTitle"
browser.wait(until.urlContains("url"), 3000); //wait for page url contains "url"
browser.wait(until.urlIs('url'), 3000); //wait for page url should be "url"
browser.wait(until.presenceOf(webElementVar, 3000)); //wait for element present in DOM
browser.wait(until.stalenessOf(webElementVar, 3000)); //wait for element not present in DOM - opposite to presenceOf
browser.wait(until.visibilityOf(webElementVar), 2000, 'timed out'); //wait for element visible in DOM
browser.wait(until.invisibilityOf(webElementVar), 3000); //wait for element not present in DOM -opposite to visibilityOf
browser.wait(until.elementToBeSelected(webElementVar), 4000, "element is not selected"); //wait for element to be selected

Jasmine Matchers:

        expect(2).toBe(2);
        expect("abcdefg").toMatch("bcde");
        expect(undefined).toBe(undefined);
        expect(undefined).toBeUndefined();
        expect(true).toBe(true);
        expect(true).toBeTruthy()
        expect(false).not.toBe(true);
        expect(67).toBeLessThan(100);
        expect(67).toBeGreaterThan(60);
        expect(null).toBe(null);
        expect(2).toEqual(2);

        var value1;
        var value2 = "abcdefg";
        var value3 = null;
        expect(value1).toBeUndefined();
        expect(value2).toBeDefined();
        expect(value3).toBeNull();

        var array = [true, true]
        expect(array).toBeTruthy();
        expect(array).toBe(true);//Expectation fails

        expect("123").toContain("2");
        expect("123").not.toContain("4");

Please comment below to feedback or ask questions.