Angular Universal XMLHttpRequest is not defined with HttpClient

I’ve recently had an extremely weird application behavior. The application is this server side rendered Angular page.  I discovered that the router outlet for this page was empty on the SSR result. I hadn’t noticed before since the site was bootstrapping really fast even without SSR. A quick look into Sentry – which holds our server logs  – revealed the cause. I got the following error:

XMLHttpRequest is not defined

This was really weird. The bug affected only one page of our site. On that page two components are included that make use of the HttpClient. A calendar and a feedback component. While the calendar was working, the feedback component was throwing the XMLHttpRequest is not defined error. But internally both use the same HttpClient. So what happended?

I had the HttpClient imported in the modules. While the feedback module was lazy loaded the calendar module was included in the app module. Somehow Angular Universal has issues if the HttpClient is included in several modules. The solution was to remove HttpClientModule from all lazy and eager loaded feature modules and move its import to the app.module.ts file. That fixed the issue to me.