Upgrade to Angular 6 and the Test is not working

Question

I initiated a project using Angular 5. After some development, I upgraded to Angular 6.

After upgrade to Angular 6, doing some adjustment to the development code.

But, I'm facing this issue when I run the Test.

Based on what I got, I'm missing 'rxjs-compat/Observable' module.

So I just install npm install rxjs-compat --save and run 'ng test'.

The error is not showing anymore. But I'm facing new problem.

Now, the error is No captured browser.

Is there any idea about this?

What I have done

Upgrade both local and global angular-cli.
Delete all node_modules and re-install the new one

Additional Information

Here is the angular version I used :

Have you ran ´karma start´ in the same directory as your karma.json? — Maartenw, Aug 10 '18 at 08:23
Please read [Under what circumstances may I add “urgent” or other similar phrases to my question, in order to obtain faster answers?](//meta.stackoverflow.com/q/326569) - the summary is that this is not an ideal way to address volunteers, and is probably counterproductive to obtaining answers. Please refrain from adding this to your questions. — halfer, Aug 10 '18 at 11:20
Hi @Maartenw i'm so sorry, I just see the answer now. and previously i fixed it the way i create the answer in the comment. — Sherly Febrianti, Aug 13 '18 at 09:21
Please refrain from adding `code formatting` to proper nouns. The names of software libraries like Angular are _not_ themselves code, and should just be rendered in the correct case, nothing more. Thank you. — halfer, Aug 13 '18 at 09:42

score 0 · Answer 1 · answered Aug 10 '18 at 08:28

0

Run karma init in the same directory as your karma.conf.js
Make sure that your karma conf file includes Chrome
Run karma start in the same directory as your karma.conf.js file.

Let me know if it helped

answered Aug 10 '18 at 08:28

Maartenw

595
1
5
19

Hi, I already fixed my current problem. But I dont know if it is actually a fix or not. I'm rename current project folder to project-bak and then create a new project `ng new project`. And i copy all the `src` folder, and the `style.scss` to new project. – Sherly Febrianti Aug 13 '18 at 08:45

score 0 · Answer 2 · answered Aug 10 '18 at 08:35

0

When upgrading to Angular 6, you also need to upgrade to RxJS 6 API syntax. You need to rewrite your import statements associated to observable methods and rxjs-compat needs to be removed.

You can find more detailed instructions in the Angular Upgrade Guide https://update.angular.io/ (set it to upgrade from 5.2 to 6).

answered Aug 10 '18 at 08:35

Robert

1,710
2
18
35

In the OP she has ran the npm insdtall rxjs-compat package which should automatically install RxJS6 and update dependencies accordingly – Maartenw Aug 10 '18 at 09:08
Mmh. In the Angular Upgrade Guide it states: "Once you and all of your dependencies have updated to RxJS 6, remove rxjs-compat." The console screenshot however states that there is a type reference to rxjs-compat/Observable. – Robert Aug 10 '18 at 11:01

score 0 · Answer 3 · answered Aug 13 '18 at 09:16

Quick fix for my current problem (From Angular 5 to Angular 6)

Step 1 : Rename current project to `{project-name}-bak`

Step 2 : Make Sure your global Angular Version is the latest version

For this step, my global version is 6.1.3.

You can check your global version via ng -v outside your Angular Project.

Step 3 : Create a new Angular 6 project

Create a new Angular project using your project-name.

ng new project-name

Step 4 : Try to run the test

Run the test ng test to make sure if your newly generated Angular 6 project is working well.

Step 5 : Move your code (only if your Step 4 is ok)

Replace the src folder with the src from {project-name}-bak
Copy your styles.css or styles.scss and all you global stylesheet from {project-name}-bak
If you have stylesheet other than styles.css or styles.scss, you should update your angular.json.
Try to run the test ng test again. _{^{(For me, it works until here)}}

Note : If anyone have a better way to fix, please updates on comment, maybe another people can be helped.