karma

一：package.json文件详解 　　管理你本地安装的npm包 。定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。 npm install 命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。 { "name": "vue2-manage", "version": "1.0.1", "description": "vue2-manage", "author": "cangdu <1264889788@qq.com>", "license": "GPL", "private": true, "scripts": { "dev": "cross-env NODE_ENV=online node build/dev-server.js", "local": "cross-env NODE_ENV=local node build/dev-server.js", "build": "node build/build.js", "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run", "e2e": "node test/e2e/runner.js", "test": "npm run unit && npm run

Now, it's time to make the web page dynamic — with AngularJS. We will also add a test that verifies the code for the controller we are going to add. There are many ways to structure the code for an application. For Angular applications, we encourage the use of the Model-View-Controller (MVC) design pattern to decouple the code and separate concerns. With that in mind, let's use a little Angular and JavaScript to add models, views, and controllers to our app. The list of three phones is now generated dynamically from data Workspace Reset Instructions ➤ The most important changes are listed

测试目的 测试controller是否被正确执行 测试所有的 $scope 成员变量被正确设置 在单元测试中使用 mock 抓取 XHR 请求。 测试 controller 需要知道，通过 controller 的 scope 会传什么数据到模板中。因此你需要先测试一下 controller 它自己是否正常工作，然后再测试一下数据是否绑到模板中。最好是知道在 controller 执行的时候，你希望 scope 中应该有什么值。如果你想写单元测试，那么它依赖 controller 中的逻辑。E2E 测试也可以，但是你不能保证 controller 工作正常。所以这章的测试，最好是使用 Midway 测试。 单元测试 <!-- lang: js --> // // test/unit/controllers/controllersSpec.js // describe("Unit: Testing Controllers", function() { beforeEach(module('App')); it('should have a VideosCtrl controller', function() { expect(App.VideosCtrl).not.to.equal(null); }); it('should have a VideoCtrl controller',

你要的移动web前端都在这里！ 大前端方向：移动Web前端、Native客户端、Node.js、 大前端框架：React、Vue.js、Koa 跨终端技术：HTML 5、CSS 3、JavaScript 跨平台框架：React Native、Cordova 前端工程化：Grunt、Gulp、Webpack 前端预编译：Babel、Sass、Less 自动化测试：Jasmine、Mocha、Karma 一图在手，应有尽有！ 更多信息参考： 来源： oschina 链接： https://my.oschina.net/u/59463/blog/1539543

拦截器是 AngularJS 内置的一个特性，你可以插入一个请求或者回调方法链，修改或者打断各终结点之间的逻辑流。但在 AngularJS 应用的单元测试中，拦截器是用来捕捉 XHR 请求， 以避免外部请求，因为它会触发内部路由(解析的时候)，Controller，Service 甚至是 Directive (不要在 Directive上这样做 :P)。这就是一个单纯的 AngualrJS 方法，任何外部请求都会被过滤(比如你在做这些的时候用 $http)，不过用拦截器会增加测试的复杂度和额外代码。因此如果你想避免拦截和 Mock，那么用 Midway 测试来对应你的路由， Controller， Service 和 Directive。 另一种避免 XHR 操作的方法是使用 Mock。Mock 是用来模拟提供请求的返回数据的。所以如果你有一个开销非常大的操作(比如说调用外部 API )的时候，它需要用很长时间来获取数据，那么最好的办法就是用 Mock 来欺骗你的代码，让它继续干接下来的事情而非等待。Mock 是一个非常有用的方法，用来分离测试代码，排除噪音。 AngularJS 提供了内部的 Mock 模块 angular-mocks.js，用于 单元测试(不是 Midway 或者 E2E 测试) 。 Karma 配置文件查找 / test 文件夹下面的每个测试文件，执行

Yeoman是什么？ Yeoman按照官方说法，它不只是一个工具，还是一个工作流。它其实包括了三个部分yo、grunt、bower，分别用于项目的启动、文件操作、包管理。 Yo: Yo是一个项目初始化工具，可以生成一套启动某类项目必需的项目文件。 Bower： 一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。 GruntJS： GruntJS是基于JavaScript的命令行构建工具，它可以帮助开发者们自动化重复性的工作。 安装 基于nodejs，需要先安装 node ，安装时要确保 Add to PATH 被安装进去，然后安装依赖的包。 –安装git， http://git-scm.com/downloads ，我是windows版本，安装的时候需要注意勾选Run git from the Windows Command prompt (从Windows命令提示符下运行git)项。 –安装gruntjs，参考之前的文章： 一步一步安装Grunt –Bower是一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。 安装国内cnpm源 sudo npm install cnpm 安装bower： sudo cnpm install -g bower 安装完成后执行：

从网上找了很多例子关于单元测试，都是如何新建项目的时候的添加单元测试，用vue-cli中怎么添加，但是我的项目已经生成了，不能再一次重新初始化，这时如何添加单元测试，这里面遇到了好多坑，写在这里记录一下心得。 1、用vue-cli生成一个新的项目，把单元测试需要的文件直接复制到你的项目中 vue init webpack vuetest 文件下载地址 源代码Github链接 2、安装Karma+Mocha模块，这个模块依赖比较多，我在遇到了坑，解决问题半天发现缺少了某个模块，在这里全部列出需要的模块 npm i -D karma karma-webpack phantomjs-prebuilt karma-phantomjs-launcher karma-phantomjs-shim karma-chrome-launcher karma-sourcemap-loader mocha karma-mocha sinon chai sinon-chai karma-sinon-chai karma-spec-reporter karma-coverage istanbul-instrumenter-loader 3、修改package.json，在scripts里添加启动代码(如果有unit就替换掉) "unit": "karma start test/unit/karma.conf

可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm having trouble trying to figure out the reason for this error when trying to start karma: bash-3.2$ NODE_ENV=test karma start INFO [karma]: Karma v0.12.31 server started at http://localhost:9876/ INFO [launcher]: Starting browser PhantomJS INFO [PhantomJS 1.9.8 (Mac OS X)]: Connected on socket FONtQ1oNxIxRecRxYgnS with id 73511945 PhantomJS 1.9.8 (Mac OS X) ERROR ReferenceError: Can't find variable: require at /public/components/angular-cookies/index.js:1 The index.js file contains: require('./angular-cookies'); module.exports =

可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: In one angular directive, I have this code: $('[name=' + formName + ']').bind('submit', function () { validate(); }); In the beforeEach clause of a Karma test, I have this code: bootstrapInput = $compile('<form novalidate name="aForm">' + '<input-field icon="true" for="email">' + '<div>' + '<input class="form-control" class="email" name="email" id="email" type="email" ng-model="user.email" required />' + '</div>' + '<input-validation for="email" custom-error="custom error" required="Email is required" email="Email must be in valid format"/>'

可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm developing a github repository (with angular 4 and angular-cli), and I have some tests with Karma and Jasmine working in the master branch. Now I'm trying to add lazy loading feature, and I've created a new branch that you can see here . The thing is, that the tests that before passed, now they do not. It's funny because only the tests from the lazy loading module are failing... Here is the code and the error: import {async, TestBed} from '@angular/core/testing'; import {APP_BASE_HREF} from '@angular/common'; import {AppModule} from '../