Front-end development--the test framework of the actual combat article

Source: Internet
Author: User

If you do not understand the front-end development environment, refer to building a front-end development environment

If you do not know the actual project configuration, please refer to the front-end development-the actual combat chapter

Step One: Stand by

Inside CMD, go to the public folder and stand by.

Step Two: Initialize the Karma configuration file Karma.conf.js

To execute a command that initializes the configuration file:

Karma Init

Depending on the wizard, most of the default configurations are available. See details:

Step Three: According to the current directory structure, modifyconfiguration fileKarma.conf.js

Add the JS file you want to test:

Files: [' app/dist/lib/angular/*.js ', ' app/dist/lib/**/*.js ', ' app/js/**/*.js ', ' test/**/*.js '],

Note: You must first introduce the JS file under angular.

Step four: Write a test case try it

Create a new file in the test directory testhello.js, content:

Describe ("A suite of Test", function () {It ("always true", function () {Expect ("1"). Toequal ("1"); });});    Describe ("A suite of Test", function () {It ("always false", function () {Expect ("1"). Toequal ("2"); });});

Two test cases were written. If you want to learn more, please refer to the Jasmine documentation.

Can't wait to run one, execute the command:

Karma Start

You will find that the Chrome browser opens and executes the test case automatically, with the following results:

Chrome 45.0.2454 (Windows 0.0.0) A suite of test always false FAILED expected ' 1 ' to equal ' 2 '. At Object.<anonymous> (f:/workspace1/public/test/testhello.js:9:21) Chrome 45.0.2454 (Windows 10 0.0.0): Executed 2 of 2 (1 FAILED) (0.02 secs/0.007 secs)
Step Five: Code Coverage

Edit the configuration file karma.conf.js, modify or append the content:

Preprocessors: {' app/js/**/*.js ': ' Coverage '}
Coveragereporter: {type: ' html ', dir: ' coverage/'}
Reporters: [' progress ', ' coverage ']

Run Karma start again, find the public directory to generate a coverage folder, open index.html, look like this:


Front-end development--the test framework of the actual combat article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.