##### Table of Contents

  * [Resolving promises](#resolving-promises)
  * [Working with the Browser](#browser)
  * [Working with Locators](#working-with-locators)
  * [Working with Elements](#working-with-elements)
  * [Jasmine expect and matchers](#jasmine-expect-and-matchers)
 

# Protractor Cheatsheet

### Resolving promises
most of the commands/functions return promises, which can be resolved by using `expect()` or `then()`.
```Javascript
 //using return to resolve promises
 <h1>Hello world</h1>
 return element(by.tagName('h1')).getText().then(function(text){
  expect(text).toContain('Hello');
 });
```

### Browser

```Javascript
browser.get('https://google.com') // Navigate to the given destination

browser.restart() // restart the browser

browser.close() // closes the browser

browser.refresh() // Makes a full reload of the current page

browser.getTitle() // get the title of the current page

browser.sleep(10000) // Schedules a command to make the driver sleep for the given amount of time.

browser.waitForAngular() // Instruct webdriver to wait until Angular has finished rendering and has no outstanding `$http` or `$timeout` calls before continuing.

browser.switchTo() // switch WebDriver's focus to a frame or window (e.g. an alert, an iframe, another window).

browser.getCurrentUrl() // returns the current url

browser.takeScreenshot() // takes a screenshot
```

### Working with Locators

```Javascript
by.css() // Locates elements using a CSS selector
    <h1 class="hello">hello world</h1>
    var h1 = element(by.css('.hello'));
```

```Javascript
by.cssContainingText() // Locate elements using CSS selector with certain string
    <h1 class="hello">hello world</h1>
    <h1 class="hello">hello universe</h1>
    var h1 = element(by.css('.hello world')); // retruns h1 with hello world
```

```Javascript
by.tagName() // Locate elements with a given tag name.
    <h1 class="hello">hello world</h1>
    var h1 = element(by.tagName('h1'));
```

```Javascript
by.linkText() // locate elements whose text matches the given text
    <a href="https://google.com">google</a>
    var link = element(by.linkText('google'));
```

```Javascript
by.partialLinkText() // locate elements whose text matches the given substring
    <a href="https://google.com">google</a>
    var link = element(by.linkText('goo'));
```

```Javascript
by.id() // locate element by its id
    <h1 id="hello">hello world</h1>
    var byId = element(by.id('#hello'));
```

```Javascript
by.className() // locate element by its class name
    <h1 id="hello">hello world</h1>
    var h1 = browser.findElement(by.className('hello'));
```

```Javascript
by.name() // Locates elements whose name attribute has the given value
   <ul>
     <li name="dog_name">Dog</li>
     <li name="cat_name">Cat</li>
   </ul>
   var dog = browser.findElement(by.name('dog_name'));
```

```Javascript
by.buttonText() // locate button by text
    <button>Protractor</button>
    var btn = element(by.buttonText('Protractor'));
```

```Javascript
by.partialButtonText() // locate button by partial text
    <button>Protractor</button>
    var btn = element(by.partialButtonText('Pro'));
```

```Javascript
by.binding() // Find an element by text binding
    <span>{{person.name}}</span>
    var bind = element(by.binding('person.name'));
```

```Javascript
by.model() // Find an element by ng-model
    <input type="text" ng-model="person.name">
    var model = element(by.model('person.name'));
```

```Javascript
by.repeator() // Find an element by ng-repeat
    <div ng-repeat="cat in pets">
      <span>{{cat.name}}</span>
      <span>{{cat.age}}</span>
    </div>
    var repeat = element.all(by.repeator('pets')); // returns a list of pets
    var cat = element(by.repeator('cat in pets').get(1)); //returns the second cat
```

```Javascript
by.options() // Find an element by ng-options
    <select ng-model="color" ng-options="c for c in colors">
      <option value="0" selected="selected">red</option>
      <option value="1">green</option>
    </select>
    var allOptions = element.all(by.options('c for c in colors'));
```

```Javascript
by.xpath() // Locates elements matching a XPath selector
   <ul>
     <li name="dog_name"><a href="to_dog.php">Dog</a></li>
   </ul>
   var li = browser.findElement(by.xpath('//ul/li/a'));
```

### Working with Elements
```Javascript
element.all() // retruns an array of elements
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list'))
```

```Javascript
element.get() // Get an element within the array by index
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list')) // retruns an array
    var first = ul.get(0)
```

```Javascript
element.first() // Get the first element in the array
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list')) // retruns an array
    var first = ul.first();
```

```Javascript
element.last() // Get the last element in the array
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list')) // retruns an array
    var first = ul.last();
```

```Javascript
element.count() // counts the number of elements
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list')) // retruns an array
    var total = ul.count();
```

```Javascript
element.isPresent() // Determine whether the element is present on the page.
    <input ng-model="person.name"/>
     element(by.model('person.name')).isPresent() // use expect to test for conditions  
```

```Javascript
element.each() // loops over array of elements
    <ul class="list">
        <li class="foo">2a</li>
        <li class="bar">2b</li>
    </ul>
    var ul = element.all(by.css('.list'));
    ul.each(function(elem, index) {
      //loops over each element
    });
```


```Javascript
element.click() // loops over array of elements
   <button class="register">Register</button>
   element(by.css('.register')).click(); // clicks the button
```

```Javascript
element.sendKeys() // send input to form inputs
   <input type="text" class="name" />
   element(by.css('.name')).sendKeys('John Doe'); // fills the input with text "John Doe"
```

```Javascript
by.getTagName() // get tag name of an element
    <h1 id="hello">hello world</h1>
    var tag = element(by.css('.hello')).getTagName();
```

```Javascript
by.getCssValue() // get css value of an element
    <h1 id="hello">hello world</h1>
    var cssValue = element(by.tagName('h1')).getCssValue();
```

```Javascript
by.getAttribute() // get value of an attribute
    <h1 id="hello">hello world</h1>
    var id = element(by.tagName('h1')).getAttribute('id');
```

```Javascript
by.getText() // get text of an element
    <h1 id="hello">hello world</h1>
    var text = element(by.tagName('h1')).getText();
```

```Javascript
by.getSize() // returns the size of an element in pixels
    <h1 id="hello">hello world</h1>
    var size = element(by.tagName('h1')).getSize(); // returns object with width and height
```

```Javascript
by.getLocation() // returns the location of the element
    <h1 id="hello">hello world</h1>
    var location = element(by.tagName('h1')).getLocation(); // returns the location of an element {x,y}
```

```Javascript
element.isEnabled() // Determine whether the element is enabled.
    <input ng-model="person.name" disabled="true"/>
    element(by.model('person.name')).isEnabled() // use with expect to test for conditions  
```

```Javascript
element.isSelected() // Determine whether the element is selected.
    <input id="foo" type="checkbox">
    element(by.id('foo')).isSelected() // use with expect to test for conditions  
```

```Javascript
element.submit() // submits a form
    <form id="login">
      <input name="user">
    </form>
    element(by.id('login')).submit();
```

```Javascript
element.sendKeys() // clears the value of an input
   <input type="text" class="name" />
   element(by.css('.name')).clear();
```

```Javascript
element.isDisplayed() // Determine whether the element is currently displayed.
    <input ng-model="person.name" hidden="true" />
    element(by.model('person.name')).isPresent() // use expect to test for conditions  
```
### Jasmine expect and matchers
```Javascript
expect(condition).toBeFalsy();
expect(condition).toBeNull();
expect(condition).toBeTruthy();
expect(condition).toBeUndefined();
expect(condition).toEqual(mixed);
expect(condition).toContain(member);
expect(condition).toBeCloseTo(number, decimalPlaces);
expect(condition).toBeGreaterThan(number);
expect(condition).toBeLessThan(number);
expect(condition).toBeNaN();
expect(condition).toHaveBeenCalled();
expect(condition).toHaveBeenCalledTimes(number);
expect(condition).toHaveBeenCalledWith(args);
expect(condition).toThrow(string);
expect(condition).toThrowError(string);
expect(condition).toBe(instance);
expect(condition).toBeDefined();
expect(condition).toMatch(pattern);
```