1.0.0 • Published 6 years ago

protractor-highlight-plugin v1.0.0

Weekly downloads
2
License
ISC
Repository
-
Last release
6 years ago

Plugin description

The plugin highlights elements on which actions are performed by protractor, so that QA (or developer) can see what element is protractor exactly working on.

Installation

npm install protractor-highlight-plugin where your package.json is will add plugin to your node_modules

Using

Add plugin to your protractor config file, like this:

plugins: [{
     package: 'protractor-highlight-plugin'
}],

Now, after you run your tests, you will see that the elements on which actions are performed are highlighted:

Ooops, something is not properly shown! Tell me about it, so I can fix it.

If you do not like the color, you can easily change it by adding some additional options to the plugin:

plugins: [{
     package: 'protractor-highlight-plugin',
     options: {
          style: 'green'
     }
}],

This way protractor-highlight-plugin can use various colors as a highlight color:

Ooops, something is not properly shown! Tell me about it, so I can fix it. Ooops, something is not properly shown! Tell me about it, so I can fix it. Ooops, something is not properly shown! Tell me about it, so I can fix it.

You can find any color you like using color pickers

Options in details

OptionDescriptionValuesExamples
styleChanges color of the highlight (default is Blue)anything from color pickerGreen, yellow, #ff66d9, LightGoldenRodYellow
focusTimeChanges time of highlighting (default is 500ms)any number in ms300, 400, 1000 etc.
includeEventsChanges events for which element will be highlighted (defaults are 'click' and 'textInput'anything from this list should work: ['mousedown', 'focus', 'change', 'mouseup', 'click', 'dblclick', 'mousemove', 'mouseover', 'mouseout', 'mousewheel', 'keydown', 'keyup', 'keypress', 'textInput', 'touchstart', 'touchmove', 'touchend', 'touchcancel', 'resize', 'scroll', 'zoom', 'blur', 'select', 'change', 'submit', 'reset'];click, change, mouseover, keydown etc.

Example of options:

plugins: [{
     package: 'protractor-highlight-plugin',
          options: {
               style: 'DarkSlateBlue',
               focusTime: 450,
               includeEvents: ['click', 'keydown', 'dblclick', 'textInput']
          }
}]