Module causes errors in prerendered application

I’m submitting a …

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter

Current behavior When importing the module in an application that uses prerendering, loading the application will fail, even if the ngx-datatable component is not used anywhere, but merely imported.

Expected behavior Any page should be able to prerender, regardless of whether the ngx-datatable component is on it or not. It’s ok for the ngx-datatable component itself to just prerender to an empty element.

Reproduction of the problem

• Setup a dotnetcore application with ASP.NET Core 2.0 & Angular 5+
• npm install ngx-datatable
• Import NgxDatatableModule in app.module.ts
• Try to start the application

What is the motivation / use case for changing the behavior? ngx-datatable is currently unusable in an application that uses prerendering, not even for the parts that are not prerendered. This can be easily fixed by checking the window variable before using it:

export const MouseEvent = ((window as any) || (global as any)).MouseEvent as MouseEvent;
export const KeyboardEvent = ((window as any) || (global as any)).KeyboardEvent as KeyboardEvent;
export const Event = ((window as any) || (global as any)).Event as Event;

This should become something like:

export const MouseEvent = (((typeof window !== 'undefined' && window) as any) || (global as any)).MouseEvent as MouseEvent;
export const KeyboardEvent = (((typeof window !== 'undefined' && window) as any) || (global as any)).KeyboardEvent as KeyboardEvent;
export const Event = (((typeof window !== 'undefined' && window) as any) || (global as any)).Event as Event;

Please tell us about your environment: Windows 10, Visual Studio 2017 Community Edition, dotnetcore 2.0

• Table version: 11.3.2

• Angular version: 5.0.0

• Browser: platformBrowser (server side)

• Language: TypeScript 2.6

[GrimaceOfDespair]

For now, I’m working around this with webpack. Ugly, but it does the job. Note that I use 3 identical replacements to replace the three occurrences.

    module: {
        rules: [
            {
                test: /\.(ts|js)$/, use: {
                    loader: 'string-replace-loader', options: {
                        multiple: [{
                            search: '(window || global)',
                            replace: '((typeof window !== \'undefined\' && window) || global)'
                        }, {
                            search: '(window || global)',
                            replace: '((typeof window !== \'undefined\' && window) || global)'
                        }, {
                            search: '(window || global)',
                            replace: '((typeof window !== \'undefined\' && window) || global)'
                        }]
                    }
                }
            }
        ]
    }

[xstation1021]

exports.MouseEvent = (window || global).MouseEvent; ^ ReferenceError: window is not defined

We also have a similar issue. NodeJS Table version: 13.0.0 Angular 5/ Angular Universal TypeScript 2.6