Protractor- Angular JS


Code Explanation of spec.js:
1.    describe('Explaining describe block', function()
The describe syntax is from the Jasmine framework. Here "describe" ('Explaining describe block') typically defines components of an application, which can be a class or function etc. In the code suite called as 'Explaining describe block' it's just a string and not a code.
2.    it('should add a Name as GURU99', function() – it’s the test
3.    browser.get('https://angularjs.org')
As like in Selenium Webdriver browser.get will open a new browser instance with mentioned URL.
4.    element(by.model('anyName')).sendKeys('protractor')
Here we are finding the web element using the Model name as "'anyName'," which is the value of "ng-model" on the webpage. 

Locators
by.css('.myclass')  // Find an element using a css selector.
by.id('myid') // Find an element with the given id.
// Note that at the moment, below are only supported for AngularJS apps.
by.model('name') // Find an element with a certain ng-model.
by.binding('bindingname') // Find an element bound to the given variable.

Actions
var el = element(locator);
el.click();  // Click on the element.
el.sendKeys('my text'); // Send keys to the element (usually an input).
el.clear(); // Clear the text in an element (usually an input).
el.getAttribute('value'); // Get the value of an attribute, for example, get the value of an input.
 
eg:
var el = element(locator);
el.getText().then(function(text) {
console.log(text);
});

Finding Sub-Elements

To find sub-elements, simply chain element and element.all functions together as shown below.
Using a single locator to find:
  • an element: element(by.css('some-css'));
  • a list of elements: element.all(by.css('some-css'));
Using chained locators to find:
  • a sub-element: element(by.css('some-css')).element(by.tagName('tag-within-css'));
  • to find a list of sub-elements: element(by.css('some-css')).all(by.tagName('tag-within-css'));
You can chain with get/first/last as well like so:
element.all(by.css('some-css')).first().element(by.tagName('tag-within-css'));
element.all(by.css('some-css')).get(index).element(by.tagName('tag-within-css'));
element.all(by.css('some-css')).first().all(by.tagName('tag-within-css'));


3 comments:

Different Types of Keyboard Inputs : Type, SendKeys & Device Replay

1. Most objects support the TYPE method.  Type will enter the specified string into an object or perform a certain keyboard combinat...