ReferenceError: MutationObserver is not defined at CloudinaryImage.ngOnInit when using domino

[r3plica]

ERROR ReferenceError: MutationObserver is not defined at CloudinaryImage.ngOnInit Facing above error with below version of Cloudinary with Angular 11 SSR (Server Side Rendering)

"@angular/core": "^11.0.5", "@cloudinary/angular-5.x": "^1.3.3", "cloudinary-core": "^2.11.3", "@nguniversal/express-engine": "^11.0.1" "domino": "^2.1.6",

node v12.18.3 npm 6.14.6

Bug Description Cloudinary and Domino don't work together. After a bit of investigation I figured out it was because in my server.ts I have this code:

const domino = require('domino');
const fs = require('fs');

// Use the browser index.html as template for the mock window
const template = fs
  .readFileSync(join(process.cwd(), 'dist/website/browser', 'index.html'))
  .toString();

const window = domino.createWindow(template);

window.crypto = {};

global['window'] = window;
global['document'] = window.document;

If I comment this code out, then Cloudinary will work. But with it included, the error I get is this:

ERROR ReferenceError: MutationObserver is not defined at CloudinaryImage.ngOnInit (D:\GitHub\86sparks\website\dist\website\server\main.js:42175:33) at callHook (D:\GitHub\86sparks\website\dist\website\server\main.js:48902:18) at callHooks (D:\GitHub\86sparks\website\dist\website\server\main.js:48872:17) at executeInitAndCheckHooks (D:\GitHub\86sparks\website\dist\website\server\main.js:48824:9) at selectIndexInternal (D:\GitHub\86sparks\website\dist\website\server\main.js:54597:17) at Module.ɵɵadvance (D:\GitHub\86sparks\website\dist\website\server\main.js:54580:5) at ImageComponent_cl_image_0_Template (D:\GitHub\86sparks\website\dist\website\server\main.js:84749:60) at executeTemplate (D:\GitHub\86sparks\website\dist\website\server\main.js:55726:9) at refreshView (D:\GitHub\86sparks\website\dist\website\server\main.js:55595:13) at refreshEmbeddedViews (D:\GitHub\86sparks\website\dist\website\server\main.js:56715:17)

When I click the main.js I highlights this.observer = new MutationObserver(() => { which is in the ngOnInit in the CloudinaryImage class.

[r3plica]

You can probably close this. I found a workaround by adding this to my server.ts:

global['MutationObserver'] = getMockMutationObserver();

function getMockMutationObserver() {
  return class {
    observe(node, options) {}
    disconnect() {}
    takeRecords() {
      return [];
    }
  };
}

[roeeba]

Thanks for the update, @r3plica. Closing.