@syngrisi/syngrisi-wdio-screenshot
v1.0.6
Published
Screenshot commands for WebdriverIO > 5 and Syngrisi
Downloads
1
Readme
syngrisi-wdio-screenshot
A WebdriverIO plugin. Additional commands for taking screenshots with WebdriverIO adapted for Syngrisi.
Working properly with WebdriverIO > 5.0.0. Old repository: https://github.com/mjdch/wdio-screenshot-v5 ,
Browser Support
Firefox
Chrome
Safari / Opera / etc - not tested
Installation
Install syngrisi-wdio-screenshot via NPM as usual:
$ npm install @syngrisi/syngrisi-wdio-screenshot --save-dev
Instructions on how to install WebdriverIO
can be found here.
Note: If you want to improve performance, you can install GraphicsMagick.
Configuration
Setup wdio-screenshot by adding a @syngrisi/syngrisi-wdio-screenshot
key to the service section of your WebdriverIO config.
More information Custom Services
const WdioScreenshot = require('@syngrisi/syngrisi-wdio-screenshot');
// wdio.conf.js
exports.config = {
// ...
services: [..., [WdioScreenshot]]
// ...
};
Usage
wdio-screenshot enhances an WebdriverIO instance with the following commands:
browser.saveViewportScreenshot([fileName], [{options}]);
browser.saveDocumentScreenshot([fileName], [{options}]);
browser.saveElementScreenshot([fileName], elementSelector, [{options}]);
All of these provide options that will help you to exclude unrelevant parts (e.g. content). The following options are available:
hideScrollBar
String
hide scrollbar forsaveViewportScreenshot
exclude
String[]|Object[]
(not yet implemented) exclude frequently changing parts of your screenshot, you can either pass all kinds of different WebdriverIO selector strategies that queries one or multiple elements or you can define x and y values which stretch a rectangle or polygonhide
String[]
hides all elements queried by all kinds of different WebdriverIO selector strategies (viaopacity: 0
)remove
String[]
removes all elements queried by all kinds of different WebdriverIO selector strategies (viadisplay: none
)
Use GraphicsMagick
wdio-screenshot uses GraphicsMagick for image processing when available. Without GraphicsMagick installed, wdio-screenshot fallbacks to Jimp - a image processing library written in JS.
If you want to install GraphicsMagick, follow the instructions below.
Mac OS X using Homebrew
$ brew install graphicsmagick
Ubuntu using apt-get
$ sudo apt-get install graphicsmagick
Windows
Download and install executables for GraphicsMagick. Please make sure you install the right binaries desired for your system (32bit vs 64bit).
License
MIT
1 Scaling of iOS Simulator has to be 100% for properly recorded screenshots (see here)
2 iOS scales the zoom level to fit the website into the viewport when the width of your page is bigger than the viewport. Capturing screenshots of such scaled websites with iOS is experimental and error-prone. If you notice any errors, adjust your viewport settings in your meta tag to disable scaling with <meta name="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">