cdk-virtual-scroll-viewport error on server side rendering

[miguelchico]

What is the expected behavior?

Server side render version should work as expected.

What is the current behavior?

Error in server:

ReferenceError: requestAnimationFrame is not defined

What are the steps to reproduce?

SSR can't be reproduced on StackBlitz.
Just first example in https://material.angular.io/cdk/scrolling/overview is failing with ssr.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular: 7.2.5
Material: 7.3.2
TypeScript: 3.2.2
Browser: Chrome (not important)

Is there anything else we should know?

I've trace the error to virtual-scroll-viewport.ts ngOnInit method:

this.ngZone.runOutsideAngular(() => Promise.resolve().then(() => {
      this._measureViewportSize();
      this._scrollStrategy.attach(this);

      this.elementScrolled()
          .pipe(
              // Start off with a fake scroll event so we properly detect our initial position.
              startWith<Event | null>(null!),
              // Collect multiple events into one until the next animation frame. This way if
              // there are multiple scroll events in the same frame we only need to recheck
              // our layout once.
              auditTime(0, animationFrameScheduler))
          .subscribe(() => this._scrollStrategy.onContentScrolled());

      this._markChangeDetectionNeeded();
    }));

The line:

 auditTime(0, animationFrameScheduler))

is using the animation frame scheduler which is not available in ssr.

I guess that code should be only executed in browser.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}