Testing strategies with Angular 2 – Julie Ralph
Why Stack Overflow recommends it
Stack Overflow users link it as a tutorial companion when answering questions about unit testing Angular 2 components and services.
Recommended by 2 people across 2 different months, 2015 to 2018.
What it is
A 22-minute AngularConnect 2015 conference talk by Julie Ralph of the Angular team on testing Angular 2 apps. It covers setting up and debugging tests with Karma, how the Angular team builds its own test suite, and new test helpers for Angular 2 components.
What people said
Recommends JayChase · 2016-07 · Stack Overflow · on “How to spy a service call in Angular2”
@RogérioRodriguesdeAlcântara spyOn is part of Jasmine [LINK] . There is a sample project here [LINK] which I have found good to use as a guide and also has this [this video] tutorial to go with it.
Recommends Aleksandar · 2018-01 · Stack Overflow · on “Unit testing click event in Angular”
I had a similar problem (detailed explanation below), and I solved it (in jasmine-core: 2.52 ) by using the tick function with the same (or greater) amount of milliseconds as in original setTimeout call. For example, if I had a setTimeout(() => {...}, 2500); (so it will trigger after 2500 ms), I would call tick(2500) , and that would solve the problem. What I had in my component, as a reaction on a Delete button click: delete() { this.myService.delete(this.id) .subscribe( response => { this.message = 'Successfully deleted! Redirecting...'; setTimeout(() => { this.router.navigate(['/home']); }, 2500); // I wait for 2.5 seconds before redirect }); } Her is my working test: it('should delete th
Cites Eric Martinez · 2015-12 · Stack Overflow · on “Test Angular 2 component in ES5?”
Following what you see in the docs and the repo source code is not that difficult. Here's the setup I made and it works. First from the docs I took jasmine example setup <link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> <script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script> Then angular2's setup. You may already know that when you write in ES5 you must use UMD bundles <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script> <script src="node_modules/rxjs/bundl
Cites LJ Wadowski · 2016-06 · Stack Overflow · on “Public or private - Angular 2 component class methods confusion”
I struggle to understand which methods should be private and which should be public in component class. It seems to be fairly easy in service to judge if method is public or private e.g: export class MyServiceClass { private _cache = {}; // this value is private and shouln't be accessed from outside public accessCache(){ // it's public as it's an API method return this._cache; } public setCache(newVal){ this._cache = newVal; } } Following that logic all methods in component should be private because none of the methods should be exposed outside of the class. (according to to that post [LINK] component and its view are one entity) export class MyComponent { private _getRandomNumbers(){ // thi