码字仓颉

前端测试基本知识

2018-12-16

测试知识

前端常用测试库

  • Karma
    Karma（[ˈkɑrmə] 卡玛）是一个测试运行器，它可以呼起浏览器，加载测试脚本，然后运行测试用例

  • Mocha
    Mocha（[ˈmoʊkə] 摩卡）是一个单元测试框架/库，它可以用来写测试用例

  • Sinon
    Sinon（西农）是一个 spy / stub / mock 库，用以辅助测试（使用后才能理解）

步骤

  1. 安装各种工具

    1
    npm i -D karma karma-chrome-launcher karma-mocha karma-sinon-chai mocha sinon sinon-chai karma-chai karma-chai-spies

  2. 创建 karma 配置

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    // 新建 karma.conf.js，内容如下
    module.exports = function (config) {
         config.set({
             // base path that will be used to resolve all patterns (eg. files, exclude)
             basePath: '',
                // frameworks to use
                // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
                frameworks: ['mocha', 'sinon-chai'],
                client: {
                    chai: {
                        includeStack: true
                    }
                },
                // list of files / patterns to load in the browser
                files: [
                    'dist/**/*.test.js',
                    'dist/**/*.test.css'
                ],
                // list of files / patterns to exclude
                exclude: [],
                // preprocess matching files before serving them to the browser
                // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
                preprocessors: {},
                // test results reporter to use
                // possible values: 'dots', 'progress'
                // available reporters: https://npmjs.org/browse/keyword/karma-reporter
                reporters: ['progress'],
                // web server port
                port: 9876,
                // enable / disable colors in the output (reporters and logs)
                colors: true,
                // level of logging
                // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
                logLevel: config.LOG_INFO,
                // enable / disable watching file and executing tests whenever any file changes
                autoWatch: true,
                // start these browsers
                // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
                browsers: ['ChromeHeadless'],
                // Continuous Integration mode
                // if true, Karma captures browsers, runs the tests and exits
                singleRun: false,
                // Concurrency level
                // how many browser should be started simultaneous
                concurrency: Infinity
            })
        }
Tags: 测试
← CSS 实现多行文字截断 浏览器存储 →
赏
使用支付宝打赏
使用微信打赏

若你觉得我的文章对你有帮助，欢迎点击上方按钮对我打赏

扫描二维码，分享此文章