Download to read offline
Uploaded byRon Apelbaum
Javascript unit tests with angular 1.x
This document discusses using Jasmine for unit testing JavaScript and Angular 1.x applications. It covers setting up a test framework with Jasmine and Karma, writing testable code, and testing Angular services, controllers, directives, and common patterns. Real-world examples are provided for testing Angular services using spies and dependency injection. The document emphasizes writing tests with a Given-When-Then structure, using matchers like toBe() and toEqual(), and spies for method stubs. Links are included for code samples, exercises, and the author's blog for further information on testing Angular applications with Jasmine.
More Related Content
Similar to Javascript unit tests with angular 1.x
![Support, Monitoring, Continuous Improvement & Scaling Agentic Automation [3/3]](https://cdn.slidesharecdn.com/ss_thumbnails/agenticcommunityseries-day3-cfd-251120170304-ddef8112-thumbnail.jpg?width=640&height=640&fit=bounds)
Javascript unit tests with angular 1.x
- 1. javascript Unit Testswith Angular 1.x Ron Apelbaum AppPulse, HPE July 2016
- 2. Agenda • javascript dangers •Testable code Motivation • Test framework Jasmine • Understand angular 1.x Angular unit test • Karma, IntelliJ Real world 2
- 3.
- 4.
- 5.
- 6.
- 7. javascript: welcome toruntime errors 7
- 8.
- 9.
- 10. JavaScript Unit Testing 10 1Runtime Compilation 2 3 Modular coding Very Fast
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20. 20 1. test afunction 2. test an object 3. testable code
- 21.
- 22.
- 23. 23 Spies (1): spyOn Spyon an existing object member
- 24.
- 25.
- 26. Spies (4): createSpyObj 26 Createan object and Spy on ‘virtual’ members
- 27. 27 1. Testable code? 2.spyOn 3. createSpyObj 4. CallFake
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34.
- 35. test a service 35 namespace getinstance
- 36. test a service: inject()+ spyOn() 36 spyOn the instance from DI
- 37. 37 1. Test aservice 2. inject () + spyOn()
- 38. $provide Registering components withthe $injector angular.module(...).service(...) angular.module(...).factory(...) 38
- 39. test a service: createSpyObj()+ $provide 39 Create another module Override namespace Gets mock instance
- 40.
- 41.
- 42.
- 43.
- 44. test a controller($scope) 44 $controller test $rootScope DI
- 45. 45 1. Stateless controller 2.Controller as 3. $scope
- 46.
- 47. $compile Compiles DOM intoa template and produces a template function 47
- 48. test a directive 48 Createelement test $compile with scope Change scope Test element
- 49. 49 1. Directive +attrs 2. Directive + scope + watch
- 50.
- 51. 51 1. $http 2. $timeout 3.Events 4. Promises
- 52.
- 53. Summary Core Angular • Service •Controller • Directive Patters • $http • $watch • $q • Events Real Life • Karma • Debug • coverage 53
- 54. Links JsFiddle examples: https://github.com/ronapelbaum/angular-jasmine Summary exercise: https://github.com/ronapelbaum/mangal My Blog: https://ronapelbaum.wordpress.com/tag/angular-jasmine 54
- 55.
Editor's Notes
- #2 Who am I Who are you
- #4 Questions?
- #6 state machine black box
- #8 Motivation
- #9 no compile runtime Static analysis
- #10 jsFiddle
- #11 Questions?
- #13 Jasmine.github.io
- #14 Describe = spec (not test) It (...should)
- #15 beforeEach
- #16 Matchers.
- #19 Other matchers
- #20 Other matchers Questions?
- #21 Questions?
- #23 Spies.
- #24 spyOn = exist object Special matchers
- #25 “and”
- #27 Questions?
- #31 new
- #33 Module === namespace injects instances
- #34 Module === namespace for mock injector Inject – get the instance
- #37 Questions?
- #38 Test service with DI https://jsfiddle.net/ronapelbaum/2fb53hbr/ spyOn DI https://jsfiddle.net/ronapelbaum/2fb53hbr/1/ NOTE: the service constructor has been called!
- #39 Core angular
- #40 Questions?
- #41 Real DI NOTE: module must be before inject NOTE: constructor NOT called
- #44 $controller - angular Service – singleton Controller – not singleton
- #45 We are testing the $scope We can inject dependencies Questions?
- #46 Questions?
- #48 Core angular
- #49 Questions?
- #52 Questions?