Angular Universal (SSR) - mocking nativeElement methods on server side

Viewed 416

In my app, I am using a few third-party libraries and right now I've started to using Angular Universal. I've mocked some window/document object to fix SSR issues, but I still face one and I don't have any idea how to mock it.

How can I mock on SSR ElementRef - nativeElement properties:

@ViewChild('elem') elem: ElementRef;
...
...
this.elem.nativeElement.getBoundingClientRect()

I already tried to mock it in some different ways inside my server.ts but it is not working and I ending up with getBoundingClientRect is not a function

global['window']['Element'].prototype.getBoundingClientRect = (): DOMRect => {
  return {
    height: 0,
    bottom: 0,
    left: 0,
    right: 0,
    top: 0,
    toJSON(): any {
      return '';
    },
    width: 0,
    x: 0,
    y: 0
  };
};

Is there any way to access ElementRef.nativeElement properties from the server-side?

I can fix it in my code by using isPlatformBrowser(this.platformId) but what about other libs? That's why I want to mock it in server.ts

0 Answers
Related