In this post we are going to see how we can unit testing the Angular Js application using Jasmine Framework in Visual Studio
Angular Applications can test the unit test cases using the Jasmine Framework By Karma Js or Chutzpah Js, First Let we see about the Chutzpah, later we can see how we can test the unit test case using karma.
First we have to configure the Visual studio for Chutzpah and jasmine
1. Install the Chutzpah visual studio extension from the following link
https://visualstudiogallery.msdn.microsoft.com/71a4e9bd-f660-448f-bd92-f5a65d39b7f0
2. Open your project in Visual studio and install the Angular js using package manager console window.
Tools ---> Nuget Package Manager ---> Package Manager Console
3. Type install-package AngularJS.Core in package manager console and press enter, this command will download the core files needed for angular application
PM> install-package AngularJS.Core
4. Type install-package JasmineTest in package manager console and press enter, This command download the package of jasmine along with tests and controller. Jasmine is a framework used for testing the Js Appplications.
PM> install-package JasmineTest
you can see above that the files are download for jasmineTest command, A controller, Jasmine Core, Spec Files.
5. Now create a sample app js for angular module
6. Now create a unit test case for app.js , so create a new file Test,js and add the references in comment, i,e the file which are mentioned in reference are loaded by runner by considering it as Dependencies. We can mention the files separately also in Chutzpah configuration file
you can see above we are reference three files two angular js files, one is core and another one is used in mocking i.e testing angular-mocks.js is used for angular testing along with jasmine framework
7. Now right click in the visual studio on the unit test case file and select the Run Js Tests. It will give you the unit test case results.
8. If you want to debug the test case , then place a breakpoint in some case and select the Debugger in Run Chutzpah with menu option present in right click. Now you can able to debug the application.
Above image clear shows how to debug a unit testing js file in Chutzpah, set the debug point in the application.
9. Output Window will look like below, below image consists of lot of test cases so don't bother about that, if the cases are success it is highlighted in green and failed cases are highlighted in red, we can see the error message for failed cases.
From this post you can see how to configure the visual studio for Unit testing the Angular js Application using jasmine in Chutzpah. In the future post we can see how we can configure the Karma Js in visual studio for testing the Angular unit test cases.
Angular Applications can test the unit test cases using the Jasmine Framework By Karma Js or Chutzpah Js, First Let we see about the Chutzpah, later we can see how we can test the unit test case using karma.
First we have to configure the Visual studio for Chutzpah and jasmine
1. Install the Chutzpah visual studio extension from the following link
https://visualstudiogallery.msdn.microsoft.com/71a4e9bd-f660-448f-bd92-f5a65d39b7f0
2. Open your project in Visual studio and install the Angular js using package manager console window.
Tools ---> Nuget Package Manager ---> Package Manager Console
3. Type install-package AngularJS.Core in package manager console and press enter, this command will download the core files needed for angular application
PM> install-package AngularJS.Core
4. Type install-package JasmineTest in package manager console and press enter, This command download the package of jasmine along with tests and controller. Jasmine is a framework used for testing the Js Appplications.
PM> install-package JasmineTest
you can see above that the files are download for jasmineTest command, A controller, Jasmine Core, Spec Files.
5. Now create a sample app js for angular module
6. Now create a unit test case for app.js , so create a new file Test,js and add the references in comment, i,e the file which are mentioned in reference are loaded by runner by considering it as Dependencies. We can mention the files separately also in Chutzpah configuration file
you can see above we are reference three files two angular js files, one is core and another one is used in mocking i.e testing angular-mocks.js is used for angular testing along with jasmine framework
7. Now right click in the visual studio on the unit test case file and select the Run Js Tests. It will give you the unit test case results.
8. If you want to debug the test case , then place a breakpoint in some case and select the Debugger in Run Chutzpah with menu option present in right click. Now you can able to debug the application.
While Debugging
Above image clear shows how to debug a unit testing js file in Chutzpah, set the debug point in the application.
9. Output Window will look like below, below image consists of lot of test cases so don't bother about that, if the cases are success it is highlighted in green and failed cases are highlighted in red, we can see the error message for failed cases.
Detail explanation of error in the output window
From this post you can see how to configure the visual studio for Unit testing the Angular js Application using jasmine in Chutzpah. In the future post we can see how we can configure the Karma Js in visual studio for testing the Angular unit test cases.
No comments:
Post a Comment