admin管理员组

文章数量:1023187

I have following angular documentation in official site. but in documentation testing part is outdated and not working with the current angular 2 beta versions. I need to write a basic test for check the if condition are working correctly. how can i do that using jasmine in angular 2.

I have following angular documentation in official site. but in documentation testing part is outdated and not working with the current angular 2 beta versions. I need to write a basic test for check the if condition are working correctly. how can i do that using jasmine in angular 2.

  • javascript
  • unit-testing
  • angular
Share Improve this question edited Feb 26, 2016 at 13:41 Tuan Ha 6402 gold badges8 silver badges26 bronze badges asked Feb 26, 2016 at 9:40 Rumes ShyamanRumes Shyaman 1,0822 gold badges15 silver badges30 bronze badges 1
  • Can you please post what you tried and where you failed? Any error message? – Günter Zöchbauer Commented Feb 26, 2016 at 9:44
Add a ment  | 

3 Answers 3

Reset to default 9

Setup jasmine to run typescript unit tests with angular2 (beta.7):

  1. Setup an Angular-Project
    (see description 5 Min Quickstart https://angular.io/guide/quickstart )

    Rootdir is myproject

  2. install jasmine with mpm 

    npm install jasmine-core --save-dev --save-exact

  3. Install live-server
    https://www.npmjs./package/live-server

  4. Get syntax/intellisense support:
    in myproject/typings make a new file jasmine.d.ts 

    /// <reference path="jasmine\jasmine.d.ts" />

    Get the jasmine.d.ts from
    https://github./DefinitelyTyped/DefinitelyTyped/blob/master/jasmine/jasmine.d.ts

    and save it in myproject\typings\jasmine as file jasmine.d.ts

  5. Save unit-test.html in myproject

    <html>
 <head>
   <title>Angular2: Jasmine Tests</title>
   <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>
 </head>
 <body>
  <!-- #1. add the system.js library -->
  <script src="../node_modules/systemjs/dist/system.src.js"></script>
  <script>
       // #2. Configure SystemJS to use the .js extension
       //     for imports from the app folder
    System.config({
    packages: {
    'app': {defaultExtension: 'js'}
    }
  });
       // #3. Import the spec file explicitly
   System.import('app/app.spec')
       // #4. wait for all imports to load ...
       //     then re-execute `window.onload` which
       //     triggers the Jasmine test-runner start
       //     or explain what went wrong
  .then(window.onload)
  .catch(console.error.bind(console));
 </script>
   </body>
   </html>

    .then (window.onload) is important to start testexecution.

    see here Wait for a module to be loaded to execute the tests it contains

  6. Create new file app.spec.ts in dir myproject\app

    import {AppComponent} from './app.ponent';


// Jasmin Test  App title property
describe('AppComponent', () => {
    var app: AppComponent = null

    beforeEach(() => {
    app = new AppComponent();
    app.title = "App in Test";
    });

   it('should have an title property', () => {

      expect(app.title).toBeDefined();
   });

   it('should have the title App in Test', () => {

      expect(app.title).toBe("App in Test");
   })
});


// Jasmin Test without Angular
describe("A suite", function() {
    it("contains spec with an expectation", function() {
        expect(true).toBe(true);
    });
});

  7. From the cmdline start

    live-server --open=unit-test.html

This is my working setup for running Unit-Tests with Jasmine written in typescript with Angular 2.

If you have any errors please post what you tried and where you failed like Günther proposed in his ment.

I found this to be a good guide for angular testing

It is missing the following mand though:

typings install jasmine --save-dev --ambient

Now angular have good documentation on angular 2 unit test and end to end testing using jasmine and karma. it have explain it using example and very easy to understand and follow.

Reference : angular 2 test

I have following angular documentation in official site. but in documentation testing part is outdated and not working with the current angular 2 beta versions. I need to write a basic test for check the if condition are working correctly. how can i do that using jasmine in angular 2.

I have following angular documentation in official site. but in documentation testing part is outdated and not working with the current angular 2 beta versions. I need to write a basic test for check the if condition are working correctly. how can i do that using jasmine in angular 2.

  • javascript
  • unit-testing
  • angular
Share Improve this question edited Feb 26, 2016 at 13:41 Tuan Ha 6402 gold badges8 silver badges26 bronze badges asked Feb 26, 2016 at 9:40 Rumes ShyamanRumes Shyaman 1,0822 gold badges15 silver badges30 bronze badges 1
  • Can you please post what you tried and where you failed? Any error message? – Günter Zöchbauer Commented Feb 26, 2016 at 9:44
Add a ment  | 

3 Answers 3

Reset to default 9

Setup jasmine to run typescript unit tests with angular2 (beta.7):

  1. Setup an Angular-Project
    (see description 5 Min Quickstart https://angular.io/guide/quickstart )

    Rootdir is myproject

  2. install jasmine with mpm 

    npm install jasmine-core --save-dev --save-exact

  3. Install live-server
    https://www.npmjs./package/live-server

  4. Get syntax/intellisense support:
    in myproject/typings make a new file jasmine.d.ts 

    /// <reference path="jasmine\jasmine.d.ts" />

    Get the jasmine.d.ts from
    https://github./DefinitelyTyped/DefinitelyTyped/blob/master/jasmine/jasmine.d.ts

    and save it in myproject\typings\jasmine as file jasmine.d.ts

  5. Save unit-test.html in myproject

    <html>
 <head>
   <title>Angular2: Jasmine Tests</title>
   <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>
 </head>
 <body>
  <!-- #1. add the system.js library -->
  <script src="../node_modules/systemjs/dist/system.src.js"></script>
  <script>
       // #2. Configure SystemJS to use the .js extension
       //     for imports from the app folder
    System.config({
    packages: {
    'app': {defaultExtension: 'js'}
    }
  });
       // #3. Import the spec file explicitly
   System.import('app/app.spec')
       // #4. wait for all imports to load ...
       //     then re-execute `window.onload` which
       //     triggers the Jasmine test-runner start
       //     or explain what went wrong
  .then(window.onload)
  .catch(console.error.bind(console));
 </script>
   </body>
   </html>

    .then (window.onload) is important to start testexecution.

    see here Wait for a module to be loaded to execute the tests it contains

  6. Create new file app.spec.ts in dir myproject\app

    import {AppComponent} from './app.ponent';


// Jasmin Test  App title property
describe('AppComponent', () => {
    var app: AppComponent = null

    beforeEach(() => {
    app = new AppComponent();
    app.title = "App in Test";
    });

   it('should have an title property', () => {

      expect(app.title).toBeDefined();
   });

   it('should have the title App in Test', () => {

      expect(app.title).toBe("App in Test");
   })
});


// Jasmin Test without Angular
describe("A suite", function() {
    it("contains spec with an expectation", function() {
        expect(true).toBe(true);
    });
});

  7. From the cmdline start

    live-server --open=unit-test.html

This is my working setup for running Unit-Tests with Jasmine written in typescript with Angular 2.

If you have any errors please post what you tried and where you failed like Günther proposed in his ment.

I found this to be a good guide for angular testing

It is missing the following mand though:

typings install jasmine --save-dev --ambient

Now angular have good documentation on angular 2 unit test and end to end testing using jasmine and karma. it have explain it using example and very easy to understand and follow.

Reference : angular 2 test

本文标签： javascriptHow we write basic unit test in angular 2Stack Overflow

版权声明：本文标题：javascript - How we write basic unit test in angular 2? - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745587922a2157710.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。