How to take screenshot in protractor on failure of test cases
Solution 1
You can use protractor-jasmine2-screenshot-reporter
module for this, it has some good features which would serve your purpose.
var HtmlScreenshotReporter = require('protractor-jasmine2-screenshot-reporter');
var reporter = new HtmlScreenshotReporter({
dest: 'target/screenshots',
filename: 'my-report.html',
captureOnlyFailedSpecs: true
});
This will capture screenshots when your specs have failed, you have many more options, you can checkout this link : https://www.npmjs.com/package/protractor-jasmine2-screenshot-reporter
Solution 2
The code below can be placed within the exports.config block of protractor.conf.js:
const fs = require('fs');
. . .
exports.config = {
. . .
onPrepare: function() {
jasmine.getEnv().addReporter({
specDone: function(result) {
browser.takeScreenshot().then(function(screenShot) {
// Saving File.
// Param filePath : where you want to store screenShot
// Param screenShot : Screen shot file which you want to store.
fs.writeFile(filePath, screenShot, 'base64', function (err) {
if (err) throw err;
console.log('File saved.');
});
});
}
});
}
I hope it helps! :)
Similarly, if you want it to only take screenshots on failures, you can place the call to takeScreenshot within a conditional matching a result.failedExpectations.length greater than 0:
jasmine.getEnv().addReporter({
specDone: (result) => {
if(result.failedExpectations.length > 0) {
browser.takeScreenshot().then((screenShot) => {
fs.writeFile('./protractorFailure.png', screenShot, 'base64', (err) => {
if (err) throw err;
});
});
}
}
});
Solution 3
protractor-beautiful-reporter is capable of building nice html reports including the screenshots.
Installation:
npm install protractor-beautiful-reporter --save-dev
Configuration in protractor.conf.js
:
const HtmlReporter = require('protractor-beautiful-reporter');
exports.config = {
// your config here ...
onPrepare: function() {
jasmine.getEnv().addReporter(new HtmlReporter({
baseDirectory: 'target/screenshots',
takeScreenShotsOnlyForFailedSpecs: true
}).getJasmine2Reporter());
}
}
Solution 4
If you're using framework: 'custom'
in protractor.conf.js then using Jasmine or a Jasmine reporter doesn't seem to work.
You can do something like the following in your post-test hook (e.g. cucumber.After):
protractor.browser.takeScreenshot().then(function(screenshot) {
const screenshots = path.join(process.cwd(), 'e2e/reports/screenshots');
fs.writeFile(screenshots + '/test.png', screenshot, 'base64', function (err) {
if (err) {
throw err;
}
console.log('File saved.');
});
});
Jatin
Updated on June 15, 2022Comments
-
Jatin almost 2 years
I am new to the protractor and would like to take screenshots of my failed test cases in browsers.
Can you please help me out by advising how should I go about it?
Thank you :)
-
FrEaKmAn over 3 yearsAnd to check if test case passed or not, check stackoverflow.com/a/54367506/73010
-
Y-B Cause over 3 yearsWow this is awesome thank you for this advice :)