Generator-jhipster: Angular 2 Protractor & Karma migration

[deepu105]

The protractor and Karma test cases needs to be migrated in order to be compatible with Angular2. The migration needs to be done in the client-2 subgen
Related to #3664
@mraible hoping you would be able to help?

TODO:

• [ ] migrate karma tests for core
• [x] migrate karma tests for entity
• [x] migrate protractor tests for core
• [x] migrate protractor tests for entity

[mraible]

@deepu105 Yes, I should be able to help. Probably not until later this week though.

[deepu105]

Sure

Thanks & Regards,
Deepu

On Mon, Oct 10, 2016 at 5:48 PM, Matt Raible [email protected]
wrote:

@deepu105 https://github.com/deepu105 Yes, I should be able to help.
Probably not until later this week though.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/jhipster/generator-jhipster/issues/4302#issuecomment-252601892,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABDlF84XpFb-xWRl5FnRYAgKEK5Sn6zXks5qyi0LgaJpZM4KSSXP
.

[deepu105]

@jhipster/developers guys can anyone take up this?
also we need to decide if we need to keep the same folder structure or move the tests into the same folders as the src similar to angular style guide and angular CLI this will be important if we are gonna support CLI later

[jdubois]

• If nobody takes this, I have a new trainee arriving in the middle of November. But that means it won't be finished before several weeks.
• For the folder structure, we need to keep the "Maven" folder structure or everyone will be lost: that would just be the root of the folder structure, then we should follow AngularJS style guide and Angular CLI. I remember @jmirc did a trick for that, so we could support the Angular Yeoman generator with JHipster 2, but I can't find the code anymore...

[mraible]

Is it possible to disable the UI-Router state viewer? I think it might be causing issues with Protractor tests.

[deepu105]

Should be possible I guess. @christopherthielen

[christopherthielen]

Can you toggle debug mode for the tests?

https://github.com/jhipster/generator-jhipster/blob/angular-2/generators/client-2/templates/src/main/webapp/app/blocks/config/_router.config.ts#L11-L14

        if (DEBUG_INFO_ENABLED) {
            trace.enable(Category.TRANSITION);
            SystemJS.import('ui-router-visualizer').then(vis => vis.visualizer(router));
        }

[mohamed2a]

I'm working on Protractor migration, I'll upgrade it to version 4 to make it compatible with Angular2.
@jdubois

[mraible]

I spent an hour today trying to setup Karma and Webpack to run a simple hello world test. Unfortunately, I failed. I used https://github.com/AngularClass/angular2-webpack-starter as a guide.

I posted my progress so far to https://github.com/mraible/jhipster-ng2-testing. Use npm test to run it, but it doesn't seem that webpack compiles and no tests are run.

[mraible]

I made some progress and got webpack to run when running "npm test". However, now I get a strange error:

WARNING in ./src/test/javascript/spec/helloWorld.component.spec.ts
Module parse failed: /Users/mraible/dev/jhipster-ng2-testing/src/test/javascript/spec/helloWorld.component.spec.ts Unexpected token (15:21)
You may need an appropriate loader to handle this file type.
|
|     it('should say hello world', () => {
|         const fixture: ComponentFixture<HelloWorldComponent> = TestBed.createComponent(HelloWorldComponent);
|         fixture.detectChanges();
|         expect(fixture.nativeElement.innerHTML.trim()).toEqual('Hello world!');
 @ ./src/test/javascript/spec \.spec\.ts
 @ ./src/test/javascript/spec-bundle.js

WARNING in ./~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
46:15 Critical dependency: the request of a dependency is an expression

WARNING in ./~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
58:15 Critical dependency: the request of a dependency is an expression
webpack: bundle is now VALID.
02 12 2016 20:54:16.331:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
02 12 2016 20:54:16.333:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
02 12 2016 20:54:16.400:INFO [launcher]: Starting browser PhantomJS
02 12 2016 20:54:16.950:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#pXOISkdNJRtDzfNnAAAA with id 3571477

Here's my changes: https://github.com/mraible/jhipster-ng2-testing/commit/a2491f9f533a21a9d7b65eb3ccf0ad590cb5fc86

[deepu105]

@mraible did you take a look at https://github.com/mgechev/angular-seed they seem to have karma but with systemJs

[sendilkumarn]

@mraible in ng-bootstrap, this was the reason why there was systemJs loader to load the karma ( not totally sure ).

this helps in loading the library. Spent a lot of time in this 😑

[deepu105]

@mraible did you have any luck with Karma tests?

[mraible]

Nope. Haven't had a chance to look at it since last week. Doesn't look like I'll have time this week either. Maybe next week.

[mohamed2a]

I'll work on it this week-end, I could run a simple karma tests without modules import.

[sendilkumarn]

The problem raises when we import modules only

[mraible]

Figured it out after migrating another project to webpack 2 last week. I'll create a PR for the infrastructure.

$ yarn test
yarn test v0.18.1
$ karma start src/test/javascript/karma.conf.js
keywords if/then/else require v5 option
Hash: e0bdc8cc97632b01d813
Version: webpack 2.2.0-rc.2
Time: 36ms
webpack: bundle is now VALID.
webpack: bundle is now INVALID.
Hash: 95bcd67125e89b8a7004
Version: webpack 2.2.0-rc.2
Time: 5485ms
        Asset     Size  Chunks                    Chunk Names
spec/entry.ts  3.05 MB       0  [emitted]  [big]  spec/entry.ts
chunk    {0} spec/entry.ts (spec/entry.ts) 2.57 MB [entry] [rendered]
  [144] ./~/@angular/core/bundles/core-testing.umd.js 45 kB {0} [built]
  [366] ./~/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js 4.63 kB {0} [built]
  [367] ./~/core-js/index.js 639 bytes {0} [built]
  [368] ./~/rxjs/Rx.js 9.58 kB {0} [built]
  [369] ./~/zone.js/dist/async-test.js 3.59 kB {0} [built]
  [370] ./~/zone.js/dist/fake-async-test.js 11.4 kB {0} [built]
  [371] ./~/zone.js/dist/jasmine-patch.js 6.36 kB {0} [built]
  [372] ./~/zone.js/dist/long-stack-trace-zone.js 5.49 kB {0} [built]
  [373] ./~/zone.js/dist/proxy.js 5.61 kB {0} [built]
  [374] ./~/zone.js/dist/sync-test.js 1.42 kB {0} [built]
  [375] ./~/zone.js/dist/zone.js 67 kB {0} [built]
  [376] ./src/test/javascript/spec \.spec 207 bytes {0} [built]
  [784] ./~/rxjs/add/operator/toPromise.js 223 bytes {0} [built]
  [785] ./~/rxjs/add/operator/window.js 205 bytes {0} [built]
  [940] ./src/test/javascript/spec/entry.ts 728 bytes {0} [built]
     + 926 hidden modules

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (250 kB).
This can impact web performance.
Assets:
  spec/entry.ts (3.05 MB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (250 kB). This can impact web performance.
Entrypoints:
  spec/entry.ts (3.05 MB)
      spec/entry.ts


WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/
webpack: bundle is now VALID.
23 12 2016 16:03:14.894:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
23 12 2016 16:03:14.897:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
23 12 2016 16:03:14.907:INFO [launcher]: Starting browser PhantomJS
23 12 2016 16:03:15.815:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#XIl2yG80-eBB4g36AAAA with id 74626926
PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 SUCCESS (0.002 secs / 0.002 secs)

=============================== Coverage summary ===============================
Statements   : 100% ( 0/0 )
Branches     : 100% ( 0/0 )
Functions    : 100% ( 0/0 )
Lines        : 100% ( 0/0 )
================================================================================
✨  Done in 8.33s.

[jdubois]

I just tested everything here, and it looks like we have a very good progress.

I'm seeing 3 main issues:

• Firefox still hangs with Protractor. I would like to use Chrome by default instead -> I think we stick to Firefox as it's easier to get it installed on a CI server, but we can't stay with something broken for so long. @pascalgrimaud you're the boss here, are you OK to move to Chrome?
• I'm having 7 test errors with Protractor. I'm going to have a look at this, but of course all tests should pass!
• With Karma I have Cannot find namespace 'webdriver'. errors, not sure if that's important or not, but of course those tests should all be green without any errors

[pascalgrimaud]

@jdubois : yes, I'm ok! I'm pretty sure it's possible with Travis

[jdubois]

Thanks @pascalgrimaud ! I'm also doing this for AngularJS, so we are consistent in our builds.

[jdubois]

Migration to Chrome done: https://github.com/jhipster/generator-jhipster/commit/4976da7060c3cfe5fbcd8132dc81f70d50fd8131

[jdubois]

Concerning my 3 issues:

• Migration to Chrome is done
• Protractor issues are because it doesn't work with i18n yet -> not really a bug, that's a use case that hasn't been coded yet. I'll have a look at it.
• Karma issue is fixed with https://github.com/jhipster/generator-jhipster/issues/4768#issuecomment-269471299

This is looking good!

[pascalgrimaud]

@jdubois : I didn't expect that it would work immediatly, without doing anything to our Travis build!

See the Travis logs:

[Wed Dec 28 23:22:44 AEDT 2016] Connected to application. Start protractor tests.
[23:22:46] Using gulpfile ~/app/gulpfile.js
[23:22:46] Starting 'protractor'...
[23:22:47] I/direct - Using ChromeDriver directly...
[23:22:47] I/launcher - Running 1 instances of WebDriver
(...)
76 specs, 0 failures
Finished in 192.192 seconds
[23:26:00] I/launcher - 0 instance(s) of WebDriver still running
[23:26:00] I/launcher - chrome #01 passed
[23:26:00] Finished 'protractor' after 3.23 min
[23:26:00] Starting 'itest'...
[23:26:00] Finished 'itest' after 14 μs

[jdubois]

@pascalgrimaud magic :-)

[mraible]

Just for some background, the reason we switched to Firefox is documented in v2.0 of the JHipster book: https://gist.github.com/mraible/0edc33c496dc55632bd9826ec9766789

"I discovered that logout wasn’t happening consistently for Chrome and Safari, causing some tests to fail. Finally, I switched back to Firefox and was able to get consistent results."

If logout is happening consistently for Chrome, 👍 for this change.

However, I do like to use Firefox for Protractor because I develop in Chrome and having a Firefox window popup doesn't yank my browser away from me.

[jdubois]

@mraible well, I have no issue with logout in Chrome, so I guess it's solved :-)

I have the same issue as you, it's really annoying to run the integration tests on my laptop as I can't use my browser anymore during that time.

But I don't have a better solution: this has been failing on Firefox for a long, long time, and we can't release JHipster 4.0 with something broken.

[deepu105]

@jhipster/developers guys is anybody working on finishing the remaining karma tests?

[pascalgrimaud]

@deepu105 : maybe @mohamed2a ? Related to what he tried here https://github.com/jhipster/generator-jhipster/pull/4795

[mraible]

@deepu105 Not me, too many other things to work on right now. Maybe the week of Jan 16.

[mohamed2a]

@deepu105 I will work on fixing the karma test during the next week

[ramzimaalej]

@mohamed2a can we pair on that ?

[mohamed2a]

Okey @ramzimaalej

[jdubois]

@mohamed2a @ramzimaalej I'm currently testing everything, we don't have a lot of Karma tests, and no tests at all on entities -> will you do a PR soon on those? Otherwise this won't be in JHipster 4

[deepu105]

Im working on karma test for entities. will commit today

Thanks & Regards,
Deepu

On Sun, Jan 29, 2017 at 1:57 PM, Julien Dubois [e-mail]
wrote:

@mohamed2a https://github.com/mohamed2a @ramzimaalej
https://github.com/ramzimaalej I'm currently testing everything, we
don't have a lot of Karma tests, and no tests at all on entities -> will
you do a PR soon on those? Otherwise this won't be in JHipster 4

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/jhipster/generator-jhipster/issues/4302#issuecomment-275912162,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABDlF3Hg4LX3M945EAX5NMFFRZSyWq7iks5rXIy_gaJpZM4KSSXP
.

[deepu105]

@mohamed2a @ramzimaalej are you guys planning to write any more karma tests? else lets close this

[jdubois]

@deepu105 I thought you were going to push something here? Otherwise let's close this. It's too late to add those tests in JHipster 4, they should be very complex, and we don't have time for this.

[jdubois]

Oh @deepu105 I didn't see you pushed some entities tests. That's already great for me, let's close this.
@mohamed2a @ramzimaalej you can still add more later, this is just for the initial JHipster 4 release.

And let's not make a ticket to "add more tests", that's always a good idea to add more tests, so that ticket would never be closed.

[deepu105]

I already pushed entity tests. But didnt tag them here :)

[mohamed2a]

I will add more karma tests today

[jdubois]

Great 👍