UI自動(dòng)化測(cè)試之Headless browser容器化

目的

We recommend against using PhantomJS for tests with Protractor. There are many reported issues with PhantomJS crashing and behaving differently from real browsers.

Docker

?安裝

docker pull webnicer/protractor-headless

E2E之Protractor

可視化運(yùn)行E2E測(cè)試

  • 安裝Protractor
npm install -g protractor
  • 更新webdriver-manager
webdriver-manager update
  • 創(chuàng)建conf.js配制文件
// conf.js
exports.config = {
  framework: 'jasmine',
  seleniumAddress: 'http://127.0.0.1:4444/wd/hub',
  specs: ['**/**.js'],
  capabilities: {
    browserName: 'chrome'
  },
  jasmineNodeOpts: {
    showColors: true,
  }
};
  • 創(chuàng)建test-spec.js測(cè)試腳本
describe('angularjs homepage todo list', function() {
  it('should add a todo', function() {
    browser.get('https://angularjs.org');

    element(by.model('todoList.todoText')).sendKeys('write first protractor test');
    element(by.css('[value="add"]')).click();

    var todoList = element.all(by.repeater('todo in todoList.todos'));
    expect(todoList.count()).toEqual(3);
    expect(todoList.get(2).getText()).toEqual('write first protractor test');

    // You wrote your first test, cross it off the list
    todoList.get(2).element(by.css('input')).click();
    var completedAmount = element.all(by.css('.done-true'));
    expect(completedAmount.count()).toEqual(2);
  });
});
  • 運(yùn)行E2E測(cè)試: protractor conf.js影兽,會(huì)啟動(dòng)chrome瀏覽器曾撤,并在控制臺(tái)顯示對(duì)應(yīng)的執(zhí)行結(jié)果
?  protractorHeadless git:(master) ? protractor conf.js
[17:23:41] I/hosted - Using the selenium server at http://127.0.0.1:4444/wd/hub
[17:23:41] I/launcher - Running 1 instances of WebDriver
Started
.


1 spec, 0 failures
Finished in 19.912 seconds
[17:24:01] I/launcher - 0 instance(s) of WebDriver still running
[17:24:01] I/launcher - chrome #01 passed
  • E2E的可視化測(cè)試完成

Headless運(yùn)行E2E測(cè)試

  • 將下面內(nèi)容保存為可執(zhí)行程序夜赵,shell文件(unix)或bat文件(windows)
#!/bin/bashdocker run -it --privileged --rm --net=host -v /dev/shm:/dev/shm -v $(pwd):/protractor webnicer/protractor-headless $@
  • 進(jìn)入控制臺(tái)踱承,輸入protractor.sh --version潦闲,查看版本號(hào)厕氨,以確定配制成功辈讶。務(wù)必要啟動(dòng)docker服務(wù)

  • 修改conf.js文件內(nèi)容妄痪,啟用docker鏡像內(nèi)部的selenium server

// conf.js
exports.config = {
  framework: 'jasmine',
//  seleniumAddress: 'http://127.0.0.1:4444/wd/hub',
  specs: ['**/**.js'],
  capabilities: {
    browserName: 'chrome'
  },
  jasmineNodeOpts: {
    showColors: true,
  }
};
  • 進(jìn)入protractor的腳本根目錄,執(zhí)行protractor.sh conf.js,不會(huì)啟動(dòng)chrome瀏覽器卓起,且在控制臺(tái)顯示對(duì)應(yīng)的執(zhí)行結(jié)果
?  protractorHeadless git:(master) ? protractor.sh conf.js
[09:31:08] I/local - Starting selenium standalone server...
[09:31:08] I/launcher - Running 1 instances of WebDriver
[09:31:09] I/local - Selenium standalone server started at http://192.168.65.2:37226/wd/hub
Started
.


1 spec, 0 failures
Finished in 11.403 seconds
[09:31:23] I/local - Shutting down selenium standalone server.
[09:31:23] I/launcher - 0 instance(s) of WebDriver still running
[09:31:23] I/launcher - chrome #01 passed
  • E2E的Headless測(cè)試完成

詳解

Dockerfile文件

FROM node:slim
MAINTAINER Yuanjie
WORKDIR /tmp
RUN npm install -g protractor mocha jasmine && \
    webdriver-manager update && \
    apt-get update && \
    apt-get install -y xvfb wget openjdk-7-jre && \
    wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb && \
    dpkg --unpack google-chrome-stable_current_amd64.deb && \
    apt-get install -f -y && \
    apt-get clean && \
    rm google-chrome-stable_current_amd64.deb && \
    mkdir /protractor
ADD protractor.sh /protractor.sh
# Fix for the issue with Selenium, as described here:
# https://github.com/SeleniumHQ/docker-selenium/issues/87
ENV DBUS_SESSION_BUS_ADDRESS=/dev/null
WORKDIR /protractor
ENTRYPOINT ["/protractor.sh"]

鏡像主要配制說明

  • 獲取基準(zhǔn)鏡像: node:slim
  • 安裝protractor,mocha,jasmine: E2E測(cè)試執(zhí)行所需
  • 更新driver: webdriver-manager update
  • 安裝Xvfb:apt-get install -y xvfb,headless的核心赵辕,使用虛擬內(nèi)存既绩,來模擬UI顯示
  • 安裝wget,jdk
  • 使用wget下載chrome的deb版本
wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
  • 使用dpkg安裝chrome
  • 添加Xvfb的運(yùn)行參數(shù): ADD protractor.sh /protractor.sh,protractor.sh文件內(nèi)容
#!/bin/bash
xvfb-run --server-args='-screen 0 1280x1024x24' protractor $@

源代碼地址:https://github.com/aimer1124/protractor-headless

參考

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末还惠,一起剝皮案震驚了整個(gè)濱河市饲握,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌蚕键,老刑警劉巖救欧,帶你破解...
    沈念sama閱讀 216,651評(píng)論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異锣光,居然都是意外死亡笆怠,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,468評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門誊爹,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蹬刷,“玉大人,你說我怎么就攤上這事频丘“斐桑” “怎么了?”我有些...
    開封第一講書人閱讀 162,931評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵搂漠,是天一觀的道長迂卢。 經(jīng)常有香客問我,道長桐汤,這世上最難降的妖魔是什么而克? 我笑而不...
    開封第一講書人閱讀 58,218評(píng)論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮怔毛,結(jié)果婚禮上员萍,老公的妹妹穿的比我還像新娘。我一直安慰自己拣度,他們只是感情好充活,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,234評(píng)論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蜡娶,像睡著了一般。 火紅的嫁衣襯著肌膚如雪映穗。 梳的紋絲不亂的頭發(fā)上窖张,一...
    開封第一講書人閱讀 51,198評(píng)論 1 299
  • 那天,我揣著相機(jī)與錄音蚁滋,去河邊找鬼宿接。 笑死赘淮,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的睦霎。 我是一名探鬼主播梢卸,決...
    沈念sama閱讀 40,084評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼副女!你這毒婦竟也來了蛤高?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,926評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤碑幅,失蹤者是張志新(化名)和其女友劉穎戴陡,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體沟涨,經(jīng)...
    沈念sama閱讀 45,341評(píng)論 1 311
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡恤批,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,563評(píng)論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了裹赴。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片喜庞。...
    茶點(diǎn)故事閱讀 39,731評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖棋返,靈堂內(nèi)的尸體忽然破棺而出延都,到底是詐尸還是另有隱情,我是刑警寧澤懊昨,帶...
    沈念sama閱讀 35,430評(píng)論 5 343
  • 正文 年R本政府宣布窄潭,位于F島的核電站,受9級(jí)特大地震影響酵颁,放射性物質(zhì)發(fā)生泄漏嫉你。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,036評(píng)論 3 326
  • 文/蒙蒙 一躏惋、第九天 我趴在偏房一處隱蔽的房頂上張望幽污。 院中可真熱鬧,春花似錦簿姨、人聲如沸距误。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,676評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽准潭。三九已至,卻和暖如春域仇,著一層夾襖步出監(jiān)牢的瞬間刑然,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,829評(píng)論 1 269
  • 我被黑心中介騙來泰國打工暇务, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留泼掠,地道東北人怔软。 一個(gè)月前我還...
    沈念sama閱讀 47,743評(píng)論 2 368
  • 正文 我出身青樓,卻偏偏與公主長得像择镇,于是被迫代替她去往敵國和親挡逼。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,629評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容