Angular 7 compatibility

[sabeurch]

Actually the Angular Slick grid is not compatible Angular 6, errors of kind :

node_modules/angular-slickgrid/app/modules/angular-slickgrid/models/backendEventChanged.interface.d.ts(3,10): error TS2305: Module '"E:/WS/Angular6App/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/angular-slickgrid/app/modules/angular-slickgrid/models/backendServiceApi.interface.d.ts(5,10): error TS2305: Module '"E:/WS/Angular6App/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/angular-slickgrid/app/modules/angular-slickgrid/services/export.service.d.ts(3,10): error TS2305: Module '"E:/WS/Angular6App/node_modules/rxjs/Subject"' has no exported member 'Subject'.

To by pass this issue, I downgraded the RXJS version from 6.0.0 to 5.6.0-forward-compat.5
This is a temporary solution, all errors related to angular slick grid disapeared, but when starting the application, this alert is displayed (in red):

This project uses a temporary compatibility version of RxJs (5.6.0-forward-compat.5).
Please visit the link below to find instructions on how to update RxJs.
https://docs.google.com/document/d/12nlLt71VLKb-z3YaSGzUfx6mJbc34nsMXtByPUN35cg/edit# 

Should this be worrying ?

[ghiscoding]

The RxJS dependency is in devDependency, technically you should be able to install any version. I didn't try Angular 6 yet, I'm still too busy trying to release the new 1.x Major version.

If I look at one of your error with Export Service on this [line] it's imported this way

import { Subject } from 'rxjs/Subject';

did that change in version 6? I need to support both RxJS 5 and 6

[ghiscoding]

I see they changed their imports yet again (using this article as reference)

Observable, Subject etc.

import { Observable } from 'rxjs/Observable';`
import { Subject } from 'rxjs/Subject';

becomes

import { Observable, Subject } from 'rxjs';

I moved the RxJS 5 into the dependencies, not sure if that is a good thing though.
I really don't have time at this moment to work on Angular 6, if you have time to help me figure out a way to support both Angular/RxJS 5 & 6 that would be ideal.

I am also finished refactoring for the new Major Release, can you please reply me on this RxJS ASAP since I'm already doing a Major (breaking) release. Also make sure to follow the Migration Guide, the new version changed quite a lot to support multiple grids

[sabeurch]

Unfortunately, the support of C/C++ like macros is not yet supported in type script: microsoft/TypeScript#4892
Also, precompile hooks is not a good idea, so source code should be kept as it is.
Until now, I'll remain using the compatible rxjs version '5.6.0-forward-compat.5' as a temporary solution.
Do you have any planning on when to migrate into Angular 6 ? (I know this could only be done after the stablilty of current major version). Or maybe creating a separate branch for rxjs 6: This solution is not good as well, as we should perform the update twice.
For now, I am hopping angular team remain supporting the RXJS forward-compat version for a long time.

[sabeurch]

This is an offcial migration document https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md . It accentuates on the necessity of refactoring source code after a step of compatibility.
To make Angular Slick grid temporarly working on Angular 6:
$npm install rxjs@6 rxjs-compat@6 --save
It will install "rxjs": "^6.2.0" as devDependencies and "rxjs-compat": "^6.2.0" as dependencies,

[ghiscoding]

So did you get it working without warnings? or are you saying that there's something to modify in my lib?

[sabeurch]

With the use of rxjs@6 and rxjs-compat@6 , the waring disapeared.
The angular slick grid works fine on Angular 6.
So, I have both rxjs v6 and rxjs-compat (for compatibility with angular 5) installed.
When all libraries (that I am using) finished migrating to Angular 6 , I 'll then drop the compatibility layer defined by rxjs-compat.
You will not have to change in Angular Slick grid for the moment, otherwise you will be supporting 2 versions of the source code (one compatible with Angular 4, 5 and other sources compatible with Angular 6)

[ghiscoding]

That's good news, I don't expect to support Angular 6 yet. Maybe in over a month but not now and I would not want to create 2 major versions just because of RxJS compatibility.

Thanks for this info, I will leave the issue open in case someone else has the problem

[sabeurch]

You Are Welcome 👍

[ctung]

Here's an attempt at the basic grid in Angular6 with rxjs-compat

The grid looks exactly like what I got when I tried building it from angular.cli

Any ideas?

[ghiscoding]

@ctung
I'm not sure how to put that in Starblitz, I haven't used it much, but you are missing the CSS (or SASS) Styling, you should see the Wiki - Styling

[ctung]

Thanks, that fixed it!
stackblitz

[sabeurch]

@ctung
In your stackblitz, this error is displayed for 1 second (on startup)

Then I got the datagrid correctly displayed. Is there any thing wrong with your css import ?

[ghiscoding]

Just so everyone knows, since there is a known way to bypass this issue.
I will most probably wait for Angular 7 to be out before addressing this one.

There are a few reasons

1. There is a know bypass mentioned in previous post, thanks to @sabeurch
2. I would like to finish working on all features
   • last major feature to work on is Editor/Filter collection async which is in the work (should be out within a month or so)
3. This will be a Major version 2.x since there are breaking changes because of newer RxJS, and I would rather wait to see if there's more breaking changes with Angular 7 to avoid making 2 Major versions back to back

So will all these reasons, don't expect any resolution any time soon.
Please use the bypass that was mentioned in previous post