查看详情

[译]使用karma进行angular测试

紧随前文如何对Angular Controller进行单元测试, 但是我们也提到了前文工作流程的不方便,简单总结上前文进行测试的一个流程: 修改测试代码; 刷新浏览器; 查看测试结果; 该方法最大的缺陷就是,我们每次都得手动的去刷新我们的浏览器。但是如果我们需要测试不同的浏览器我们又应该如何处理呢? 而本文将提出一个自动化测试的方案,从而解决这些问题。 关于Karma Karma是一个由AngularJS 团队创造的JavaScript测试工具。前面我们写过了Jasmine的一篇文章《开始对Angular App进行单元测试》 而Karma提供了非常有用的工具去帮助我们进行Jasminede的测试。 安装 Karma 你在这里可以看到更为详细的安装文章,而本文随后也会概括总结一些。首先你得安装node.js,如果安装了则跳过,没有安装的可以看这里 注意官方文档中有说明,Karma在某些版本的node工作不那么友好。然而作者本身的v0.12.x并没遇见什么问题。打开你的命令行软件,我们输入下面命令, mkdir CalculatorKarma cd CalculatorKarma echo {} >> package.json bash 接下来我么用npm安装karma, npm install karma --save-dev 如果安装成功, package.json中将会有下面内容: { "devDependencies": { " 详情 »

查看详情

[译]如何对Angular Controller进行单元测试

上面一篇文章简单介绍了如何使用 Jasmine 进行JavaScript的单元测试 我们用了一段简单的代码进行计算的测试。 接下来我们将其延伸到我们对Angular Controller的测试中。如果你不太了解angular也没关系,下文也会提及关于Angular的一些知识。 写个简单的Angular App 在开始写测试之前,我们先写一个简单的计算App,它会计算两个数字之和。 代码如下: <html> <head> <script type="text/javascript" src="https://code.angularjs.org/1.4.0-rc.2/angular.min.js"></script> </head> <body> <!-- This div element 详情 »

查看详情

[译]开始对Angular App进行单元测试(1)

这是一些列文章,陆续翻译整理中... 原文地址:http://www.bradoncode.com/blog/2015/05/12/angularjs-testing-getting-started/ @ Bradley Braithwaite 前言 在写测试之前,我们还得对基础的JS的单元测试框架和如何写测试用例等一些问题做一个简要的介绍。 先说说 jasmine ,它算作一个行为驱动开发(behaviour driven development,BBD)的 JavaSciprt的框架,会让人困惑的是,它也可以用测试驱动开发(test driven development,TBD)的思想来写测试。 BBD和TBD两种风格会有些区别,但是使用jasmine确实可以用TBD的方式。jasmine会提供一种结构去组织你的测试以及一些函数来进行代码输出的断言。究竟是TBD还是BBD实际取决于开发者自己的如何去组织自己的测试,当然下文我们仅仅用TBD来进行讲解。 开始你的第一个测试 先建一个项目文件比如jasmine-test,然后粘贴下面的代码到一个html文件中。 <html> <head> <link rel="stylesheet" type="text/ 详情 »

查看详情

使用 JavaScript 进行语音识别

之前写过了语音合成,即是进行文字发音,当然现在也支持了语音识别, 即将你所说的转化成文字。Chrome 浏览器在版本25之后开始对这一特性的支持。 基础用法 var recognition = new webkitSpeechRecognition(); recognition.onresult = function(event) { console.log(event) } recognition.start(); 这里操作实际会让用户授权页面开启麦克风,如果用户允许的话,用户可以开始说话了,如果你停说话了,onresult注册的时间 则会被触发,并会讲捕获的音频返回成一个JavaScript对象。 响应流 DEMO地址 你需要等待用户准备好对话,并且知道对话结束; var recognition = new webkitSpeechRecognition(); recognition.continuous = true; recognition.interimResults = true; recognition.onresult = function(event) { console.log(event) } recognition.start(); 这样你可以在用户开始讲话时,提前渲染结果。 你可以自动以识别的语言,默认情况为所在地区语言。 x-webkit-speech Webkit 详情 »

查看详情

OAuth2 学习笔记

在日常的网站中,我们经常会看见一些来自社交网站的登录按钮,类似使用facebook,twitter登录等。而在这背后则是建立在OAuth基础之上。OAuth2是一套提供授权功能的框架,通过它我们可以使第三方站点获取到我们的用户授权,就像可以拿到facebook 或者微博的用户昵称和头像。OAuth2 提供了包括桌面,web以及移动端应用的授权功能。 授权角色 授权一般会定义下面四种身份: 用户 客户端 资源服务器 授权服务器 用户 我们通常定义资源的所有者(Resource Owner)即是我们的用户,是他们允许这些应用去访问他们自己的账户信息。当然这些应用所能访问的权限是有限的,它被限制在一个受保护的作用域内(比如只能读取信息,当然这取决于我们自己的设计). 授权服务器和接口服务 用户请求授权服务后成功后,会返回一个aceess token给应用,这样应用再访问其他接口服务时候都需要这个凭证. 客户端应用 客户端应用既是用户当前所用的这个产品了。它通过它用户授权成功后,可以对用户的一些信息进行访问或者修改,但无论如何,再请求用户信息的时候,我们的api和授权服务必须对它进行合法性验证。 授权流程 应用注册 使用授权之前,你必须让这些客户端应用登记在案,你需要它提供一些基本的信息名称比如,应用名称,网站地址,回调地址等等。其中回调地址既是用户完成授权后跳向的地址,在那里应用能够处理我们返回的授权代码以及access tokens. Cient ID 以及 Client Secret 详情 »

查看详情

# 10个值得深思的PHP面试问题

本文翻译自:https://www.toptal.com/php/interview-questions ,文章所罗列的问题虽然看似简单,但是每个背后都涵盖了一个或几个大家容易忽视的基础知识点,希望能够帮助到你的面试和平时工作。 Q1 第一个问题关于弱类型 $str1 = 'yabadabadoo'; $str2 = 'yaba'; if (strpos($str1,$str2)) { echo "\"" . $str1 . "\" contains \"" . $str2 . "\""; } else { echo "\"" . $str1 . "\" does not contain \"" . $str2 . "\""; } 正确运行的输出结果: "yabadabadoo" does 详情 »

查看详情

SVG Sprite 入门(SVG图标解决方案)

关于浏览器图标解决方案,一直就有很多 CSS Sprite,Icon Font,CSS Icon以及SVG.相对而言svg矢量图标以及支持浏览器自身解析的优点,很多团队都已经在使用了。这篇文章主要说明svg图标的使用和制作。 演示地址 代码 SVG Sprite 传统的做法 使用AI或者合并SVG图像,然后用background-postion; 打开AI,新建一个30 * 60(px)的画布,设置好网格和参考线. 用AI打开svg文件,然后复制路径到画布上调整大小 其他就和css-sprite没有差异了 .icon-bg{ display: inline-block; width: 30px; height: 30px; background: url(./res/svg-sprite-background.svg); background-size:100% 100%; vertical-align: middle; } .icon-facebook-logo{ background-position: 0 0; } .icon-earth{ background-position: 0 -30px; } .icon-like{ background-position: 0 -60px; 详情 »

查看详情

使用JavaScript 进行单词发音

在w3c草案中增加了对Web Speech Api的支持;主要作用在 两个非常重要的方面: 语音识别 (将所说的转换成文本文字 / speech to text); 语音合成 (将文本文字读出来 / text to speech); 而chrome在版本33发布后宣布对该特性的支持;今天重要介绍第二部分。 演示地址 文档和演示代码 开始使用 // 你可以直接打开你的控制台粘贴下面代码 var words = new SpeechSynthesisUtterance('Hello captain'); window.speechSynthesis.speak(words); 当然你还可以修改很多参数去调整你的发音: volume:声音; rate:发音速度; pitch:音调; voice:声音; language:语言(en,zh,ja...更多参考) var msg = new SpeechSynthesisUtterance(); var voices = window.speechSynthesis.getVoices(); msg. 详情 »

查看详情

React Native最佳学习模版- F8 App开源了

在刚刚结束的Facebook f8开发者大会不久。FB开源了自己的f8 App。 界面和体验都是相当精美的。 React Native 项目用的自己啊的React Native,可以同时build iOS和 Android.相信不少学习react native的人也希望看看FB团队自己怎样去写App的吧。正如介绍中一样,我们可以看到他们所用到的一些关键词:React Native, Redux, Relay, GraphQL。 开始构建 环境需要React Native,CocoaPods 1.0+ (only for iOS),MongoDb(服务端使用) git clone项目 $ git clone https://github.com/fbsamples/f8app.git $ cd f8app 安装依赖 (npm v3+): $ npm install $ (cd ios; pod install) # only for iOS 详情 »

解决git Unable to create temporary file ...

搞计算机的总会莫名奇妙的遇到一些问题,之前做了那么多的项目,突然就出现了,在push 时候抛出这样的错误 fatal: Unable to create temporary file: Permission denied error: pack-objects died of signal 13 搜索后,发现也挺频繁的。大致就是这样: // 登录git服务器,进入你的项目 cd your_rep.git chmod -R g+ws * chgrp -R git * git config core.sharedRepository true 然后再回到你本地目录,输入 git repack master 参考: http://stackoverflow.com/questions/1918524/error-pushing-to-github-insufficient-permission-for-adding-an-object-to-reposi git 常用命令:http://www. 详情 »