Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

protractor-pageobject

Package Overview
Dependencies
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

protractor-pageobject

Page object pattern implementation for protractor and webdriverjs.

  • 0.0.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1
Maintainers
1
Weekly downloads
 
Created
Source

Protractor Page Object

Protractor Page Object pattern for Protractor.

Features

  • encapsulate your page or components interactions and selectors in classes
  • allows to abstract elements and components in your tested page, which facilitate refactoring when changing the html structure.
  • allows to easily set input fields

Installation

# not published to npm yet...
npm install --save-dev protractor-pageobject

Examples

check the examples folder.

For more examples, you can also check the pages and components created for integration tests.

API

Base

This is the Page and Component parent class.

els

A map of element selectors, which defines the elements you want to interact with. Used to retrieve elements or components without having to specify a selector. Check base.element(elName), base.elements(elName) and base.component(elName).

els: {
  'searchBox': by.name('q')
}
comps

A map of component classes. Each key should have a corresponding key in els map.

comps: {
  searchBox: require('./path/to/component-subclass'),  // short version
  anotherComponent: {
    model: require('./path/to/another-component-subclass'),
    opts: {opt1: 'val1'}
  }
}
element(elName)

Returns a protractor element. elName should be key in the els map.

elements(elName)

Returns a protractor elements (array). elName should be a key in the els map.

components(elName)

Returns a protractor-pageobject Component instance. elNameshould be a key in theels` map.

isElementPresent(elName)

Returns a promise which resolves to a boolean value.

setFieldValue(elName, value)

Sets the value of a field. It will use the following rules (in the specified order):

  • If elName is a key in comps and this component has a method setValue, then it will call that method.

  • If the Page or Component instance has a setElName. using camelCase. For example, if elName = 'my-el-1', then the method should be called setMyEl1`

  • If none of the above works, then it will detect the field type and use the proper selenium command to set the value (sendKeys(), click() on dropdown or checkboxes...). Here is the list of supported fields for now:

    • input[type=email]
    • input[type=file]
    • input[type=number]
    • input[type=password]
    • input[type=search]
    • input[type=tel]
    • input[type=text]
    • input[type=textarea]
    • input[type=url]
    • input[type=checkbox]
    • input[type=radio]
    • select (regular or mutli)
setFields(opts)

Sets multiple fields at the same time, using setFieldValue(elName, value). Each key should be present in els map.

myComponent.setFields({
  elName1: 'value1',
  elName2: 'value2',
  ...
});

Page

Page inherits from Base so all Base methods and properties are inherited. Here is the list of additional methods.

url

A property or a method that is used to navigate using the get() method below.

get()

Navigate to the url property.

title()

returns a promise that will resolve with the current page title (usually the <title> tag in <head>). Alias of browser.getTitle().

getCurrentUrl()

returns a promise that will resolve with the current page title. Alias of `browser.getCurrentUrl()

Component

Like Page, Component inherits from Base so all Base methods and properties are inherited.

new Component(opts)

When creating a new instance of a component, you need to at least provide one property called el which should be a protractor ElementFinder.

ItemList

TODO

License

MIT.

Keywords

FAQs

Package last updated on 08 May 2015

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc