protractor的安裝與基本使用教程
前言
Protractor是一個(gè)建立在WebDriverJS基礎(chǔ)上的端到端(E2E)的AngularJS JavaScript Web應(yīng)用程序測(cè)試框架。Protractor全自動(dòng)化真實(shí)的模擬用戶在真正的瀏覽器中操作、運(yùn)行并測(cè)試開(kāi)發(fā)者的應(yīng)用程序。下面就來(lái)一起看看關(guān)于protractor安裝與基本使用的相關(guān)內(nèi)容吧。
1、JDK的安裝和環(huán)境的配置
關(guān)于JDK的安裝配置這里就不說(shuō)了,需要的朋友們可以參考這篇文章
2、npm protractor
npm install -g protractor
3、npm install protractor的依賴項(xiàng)
基于第二步下載到的文件,在命令行里面進(jìn)入到nodejs ->protractor的目錄
npm install
4、test工程
包括一個(gè)簡(jiǎn)單的angular的頁(yè)面,一個(gè)配置文件和一個(gè)測(cè)試文件

配置文件protractor_conf.js代碼:
/**
* Created by Administrator on 2015/4/24.
*/
exports.config = {
directConnect: true,
// Capabilities to be passed to the webdriver instance.
capabilities: {
'browserName': 'chrome'
},
// Spec patterns are relative to the current working directly when
// protractor is called.
specs: ['test.js'],
// Options to be passed to Jasmine-node.
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000
}
};
test.js文件代碼
/**
* Created by Administrator on 2015/4/24.
*/
describe('angularjs homepage', function () {
it('should greet the named user', function () {
browser.get('http://localhost:63342/protractor/Index.html');
element(by.id('userName')).sendKeys(' Sparrow');
browser.sleep(4000);
});
});
Index.html的代碼
<!DOCTYPE html>
<html data-ng-app="protractor">
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div data-ng-controller="myAppController">
{{userName}}
<input id="userName" data-ng-model="userName" />
</div>
</body>
<script src="lib/angular.min.js"></script>
<script>
var app = angular.module('protractor',[]);
app.controller('myAppController',['$scope',function($scope){
$scope.userName = 'Jackey';
}]);
</script>
</html>
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,如果有疑問(wèn)大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
AngularJS動(dòng)態(tài)生成select下拉框的方法實(shí)例
這篇文章主要給大家介紹了關(guān)于AngularJS動(dòng)態(tài)生成select下拉框的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用AngularJS具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
angular將html代碼輸出為內(nèi)容的實(shí)例
今天小編就為大家分享一篇angular將html代碼輸出為內(nèi)容的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
Angular項(xiàng)目中$scope.$apply()方法的使用詳解
這篇文章主要給大家介紹了關(guān)于Angular項(xiàng)目中$scope.$apply()方法使用的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用Angularjs具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面跟著小編一起來(lái)看看吧。2017-07-07
AngulerJS學(xué)習(xí)之按需動(dòng)態(tài)加載文件
本篇文章主要介紹了AngulerJS學(xué)習(xí)之按需動(dòng)態(tài)加載文件,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-02-02
Angular.js如何從PHP讀取后臺(tái)數(shù)據(jù)
這篇文章主要為大家簡(jiǎn)單介紹了Angular.js如何從PHP讀取后臺(tái)數(shù)據(jù),本文將Angular和PHP相結(jié)合,從后臺(tái)讀取數(shù)據(jù),感興趣的小伙伴們可以參考一下2016-03-03

