Karma fails to resolve rxjs/operators

[emilio-simoes]

Importing 'rxjs/operators' with require('rxjs/operators') in ngx-prefect-scroolbar.umd.js is causing Karma tests to fail because it will cause it to try to resolve an index.js file that does not exit:

05 04 2018 10:01:34.797:WARN [web-server]: 404: /base/node_modules/rxjs/operators/index.js
HeadlessChrome 65.0.3325 (Linux 0.0.0) ERROR: 'Error: Fetch error: 404 Not Found
    at http://localhost:9876/base/node_modules/systemjs/dist/system.src.js?610237a348a4c9eb69fcb56c437cb7fd5869fbde:1454:15
    at ZoneDelegate.invoke (http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:388:26)
    at Zone.run (http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:138:43)
    at http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:858:57
    at ZoneDelegate.invokeTask (http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:421:31)
    at Zone.runTask (http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:188:47)
    at drainMicroTaskQueue (http://localhost:9876/base/node_modules/zone.js/dist/zone.js?2b3b3ace034984aafeb0176c04a56eb07a693ea1:595:35)'

Using Angular 2.5.9, RxJS 5.5.8.

[sconix]

The file is generated by the angular compiler so not sure how I could effect the way its generated. So do you know what would fix that?

And if it works for normal build then shouldn't it be something in the karma setup causing it?

[emilio-simoes]

Change the way you import the operators, e.g.:
Instead of:

import { map, takeUntil, distinctUntilChanged } from 'rxjs/operators';

Use:

import 'rxjs/operator/add/map';
import 'rxjs/operator/add/takeUntil';
import 'rxjs/operator/add/distinctUntilChanged';

This will cause the operators to be loaded individually.

[sconix]

The current way is the recommended way according to the rxjs 5.5 pipeable documentation. And our karma unit tests do run properly for components that use this library.

So I guess you are using some build system that requires using deep imports, but I am not planning to change to using those since all the imports are again different with the rxjs 6. So I already have next version ready for rxjs 6 and there deep imports are not allowed anymore.

[emilio-simoes]

I understand that, but I don't know other way of fixing it. I've been using that method in all my projects and haven't had an issue yet.

And I just find out it's also breaking the Prod/AoT build with SystemJS:

Message:
    Error on fetch for rxjs/operators at file:///home/.../node_modules/rxjs/operators/index.js
        Loading ngx-perfect-scrollbar/bundles/ngx-perfect-scrollbar.umd.js
        Loading dist/tmp/app/app.module.js
        Loading dist/tmp/app/main.js
        ENOENT: no such file or directory, open '/home/.../node_modules/rxjs/operators/index.js'
Details:
    originalErr: Error: ENOENT: no such file or directory, open '/home/.../node_modules/rxjs/operators/index.js'

Stack:
Error on fetch for rxjs/operators at file:///home/.../node_modules/rxjs/operators/index.js
        Loading ngx-perfect-scrollbar/bundles/ngx-perfect-scrollbar.umd.js
        Loading dist/tmp/app/app.module.js
        Loading dist/tmp/app/main.js
        Error: ENOENT: no such file or directory, open '/home/.../node_modules/rxjs/operators/index.js'

[sconix]

Yes its a known rxjs bug that was supposed to be fixed in rxjs 5.5.3. So not sure why you are still experiencing it even you are using 5.5.8. There are many workarounds for the bug though, but those should not be needed anymore.

So something is most likely wrong in your setup. Maybe there is some help in the rxjs issue: ReactiveX/rxjs#2971

[emilio-simoes]

It's not a project setup problem, I'm using this project https://github.com/mgechev/angular-seed as base project which already handles those issues.
Also I'm using other dependencies that import RxJS the same way you do (e.g. https://github.com/robisim74/angular-l10n) and never had a problem before.

This appears to be a ngx-perfect-scrollbar issue.

[sconix]

Ok well hopefully somebody can give more info about this since I don't know what I could do differently since the library is build with angular compiler which does not need any special configuration. The library works in angular-cli, webpack and systemjs example app setup so not sure why it would fail in angular-seed setup. Most likely this issue will be resolved with the move to rxjs 6 anyway.

[emilio-simoes]

You where right about the build, is an angular-seed issue.
But I still haven't figured out what is wrong with Karma.

[emilio-simoes]

Found it, configuration issue, my bad, closing issue

[koolkav1]

What did you do to fix this issue?