2019-07-12
Angular universal with Domino : Getting Right-hand side of 'instanceof' is not an object
stackoverflow
Question

I'm using angular universal and domino to "fake" DOM server side on express server. Everything was working fine until a npm cache clean --force and then a npm install

I'm getting the following error :

/path/to/app/src/gui/dist/server/server.js:2378
 */(s),2))[0],l=i[1]),this.engine.listen(this.namespaceId,a,s,l,function(e){var t=e._data||-1;o.factory.scheduleListenerCallback(t,n,e)})}return this.delegate.listen(e,t,n)},t}(h);var g=function(e){function t(t,n,r){return e.call(this,t.body,n,r)||this}return Object(r.c)(t,e),t=Object(r.b)([Object(i.Injectable)(),Object(r.e)(0,Object(i.Inject)(l.DOCUMENT)),Object(r.d)("design:paramtypes",[Object,s.AnimationDriver,s["ɵAnimationStyleNormalizer"]])],t)}(s["ɵAnimationEngine"]);function v(){return Object(s["ɵsupportsWebAnimations"])()?new s["ɵWebAnimationsDriver"]:new s["ɵCssKeyframesDriver"]}function y(){return new s["ɵWebAnimationsStyleNormalizer"]}function b(e,t,n){return new f(e,t,n)}var w=new i.InjectionToken("AnimationModuleType"),_=[{provide:a.AnimationBuilder,useClass:u},{provide:s["ɵAnimationStyleNormalizer"],useFactory:y},{provide:s["ɵAnimationEngine"],useClass:g},{provide:i.RendererFactory2

TypeError: Right-hand side of 'instanceof' is not an object
    at bt (/path/to/app/src/gui/dist/server/server.js:2378:180688)
    at yt (/path/to/app/src/gui/dist/server/server.js:2378:180563)
    at ir (/path/to/app/src/gui/dist/server/server.js:2378:203358)
    at We.insertToken (/path/to/app/src/gui/dist/server/server.js:2378:179949)
    at /path/to/app/src/gui/dist/server/server.js:2378:183251
    at kt (/path/to/app/src/gui/dist/server/server.js:2378:183266)
    at Xe (/path/to/app/src/gui/dist/server/server.js:2378:178211)
    at Object.parse (/path/to/app/src/gui/dist/server/server.js:2378:177177)
    at Object.t.createDocument (/path/to/app/src/gui/dist/server/server.js:2833:9750)
    at Object.t.createWindow (/path/to/app/src/gui/dist/server/server.js:2833:10129)

The error occurs in HTMLParser.js of domino, line: 2177 at the following lines :

doc._appendChild(root);
stack.push(root);
if (fragmentContext instanceof impl.HTMLTemplateElement) {
  templateInsertionModes.push(in_template_mode);
}

impl.HTMLTemplateElement is actually empty.

My server.ts fragment using domino declaration is :

// const domino = require('@angular/platform-server/node_modules/domino');
const domino = require('domino');

const template = fs.readFileSync(path.join(process.cwd(), 'dist', 'browser', 'index.html')).toString();
const win = domino.createWindow(template);
global['window'] = win;
global['document'] = win.document;
global['DOMTokenList'] = win.DOMTokenList;
global['Node'] = win.Node;
global['Text'] = win.Text;
global['jQuery'] = {};
// global['$'] = require('jquery');
// global['window.$'] = require('jquery');
global['HTMLElement'] = win.HTMLElement;
global['Materialize'] = win.Materialize;
global['navigator'] = win.navigator;

Any suggestion to this problem ?

Answer
1

I found that the origin of the problem is due to setting 'production' mode to webpack. In fact, for performance reasons I set in my webpack.server.config.js

module.exports = {
    mode: 'production',
    ...
}

This mode causes unexpected behavior with domino. Setting mode: 'none' solved the problem.

Angular universal with Domino : Getting Right-hand side of 'instanceof' is not an object
See more ...