Errors using famous with grunt-html-snapshots

[lonormaly]

When using grunt-html-snapshots (https://github.com/cburgdorf/grunt-html-snapshot) to render the page to support SEO in angularjs, there are several errors that prevent from the grunt deployment process to succeed:

1. Warning: error: TypeError: 'undefined' is not a function (evaluating 'window.requestAnimationFrame(loop)') Use --force to continue.

And then I read about this polyfill that solved this issus (bower install requestAnimationFrame).

2. Now i'm getting:
   Warning: error: TypeError: 'undefined' is not a function (evaluating 'handler.pipe.bind(handler)') Use --force to continue.

Without this process I can't deploy it on production.

Please help in solving this.

[MylesBorins]

Hi @lonormaly,

as of right now we don't officially support offline rendering of the scene graph. There are a number of factors that will need to be taken into account to get an app rendering on the server (a.k.a phantomjs support).

This has been added to the backlog and is something that we will explore once the framework has stabilized a bit more.

[stefanRitter]

The second error your getting is related to the function(){}.bind() method.
I use Famous / Angular's polyfills for phantom.js to run my Karma tests in PhantomJS, you could try using the same file for your snapshots:
https://github.com/Famous/famous-angular/blob/master/test/phantomjs-polyfills.js

[MylesBorins]

There is a solution offered here as well ariya/phantomjs#10522 (comment)

if (!Function.prototype.bind) {
  Function.prototype.bind = function (oThis) {
    if (typeof this !== "function") {
      // closest thing possible to the ECMAScript 5 internal IsCallable function
      throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
    }

    var aArgs = Array.prototype.slice.call(arguments, 1), 
        fToBind = this, 
        fNOP = function () {},
        fBound = function () {
          return fToBind.apply(this instanceof fNOP && oThis
                                 ? this
                                 : oThis,
                               aArgs.concat(Array.prototype.slice.call(arguments)));
        };

    fNOP.prototype = this.prototype;
    fBound.prototype = new fNOP();

    return fBound;
  };
}

It looks like the head of phantom.js might be fixing this, but only time will tell.