Call a function when an expect fails

[yentheo]

We want to take a screen shot when there is an expect that fails.

Is there a way to plug in to some sort of onFail event that runs with every 'expectation fail'.

I looked at writing a jasmine reporter. But these only have events that run after a spec is completed (or before). The problem with this is that I could have an expect in the middle of my test, I want to see a screenshot of that moment.

Is something like this possible with the current protractor version?

Thanks in advance!

[MexicanAce]

#161

[yentheo]

#161 expects me to write a try catch around all my expects, that's not really what I want.
In #161 there is a reference to #114, this is exactly what I want but he changed the source code to get what you get in #161. I can try to change the protractor code myself but I was wondering if there was some kind of event I can register to whenever an expect is verified. Something like this.

ptor.registerOnExpectation(function (expectation){
   if(expectation.passed) {
      // do something
   } else {
      // do something else
   }
});

[MexicanAce]

Then this is something that would probably be changed on the Jasmine code, since this where the expect(...) methods are created.

[juliemr]

You can do something like this. It doesn't quite do what you want - it's on every failed test case, not every failed expect call. To do every failed expect, we'd have to muck around in Jasmine as @MexicanAce said - which is worth looking into.

afterEach(function() {
  var passed = jasmine.getEnv().currentSpec.results().passed();
  if (!passed) {
    browser.takeScreenshot().then(function(png) {
      // do something with the screenshot.
    });
  }
});

[mcalthrop]

Hi

I'm scratching around trying to find out how to save the png parameter as a file on the filesystem – and not having any joy so far.

Here's what I have at this point:

browser.takeScreenshot().then(function (png) {
    var fs = require('fs'),
        buf = new Buffer(png, 'utf8'),
        stream = fs.createWriteStream('exception.png');

    stream.write(buf);
    stream.end();
});

The file is created, but is a straight ASCII file, not a PNG.

Any pointers?

thanks in advance

Matt

[mcalthrop]

Ok, I found the answer: the string is a base64-encoded version of the PNG. I discovered this by guesswork.

It would be really helpful to have this documented.

So here's the code that works:

browser.takeScreenshot().then(function (png) {
    var fs = require('fs'),
        buf = new Buffer(png, 'base64'),
        stream = fs.createWriteStream('exception.png');

    stream.write(buf);
    stream.end();
});

And here it is a bit more abstracted:

// at the top of the test spec:
var fs = require('fs');

// ... other code

// abstract writing screen shot to a file
function writeScreenShot(data, filename) {
    var buf = new Buffer(data, 'base64'),
        stream = fs.createWriteStream(filename);

    stream.write(buf);
    stream.end();
}

// ...

// within a test:
browser.takeScreenshot().then(function (png) {
    writeScreenShot(png, 'exception.png');
});

[mcalthrop]

Ah – I just discovered this documentation, describing the base-64 encoding:
https://github.com/angular/protractor/blob/master/docs/debugging.md#taking-screenshots

I've added some sample code to that page, and submitted a pull request.

[juliemr]

PR was accepted, closing this issue.

[yakshithkj]

The below code works well for capturing a screenshot of failure step by saving locally. But, how we can embed this screenshot to HTML report with in the same code? I've tried with this code stream.attach(new Buffer(png, 'base64').toString('binary'), 'image/png'); by including before stream,end(); but its throws an undefined error. Can you please provide me a solution for this?

browser.takeScreenshot().then(function (png) {
var fs = require('fs'),
buf = new Buffer(png, 'base64'),
stream = fs.createWriteStream('exception.png');
stream.write(buf);
stream.end();
});