Appium是一款開(kāi)源的App 界面自動(dòng)化測(cè)試軟件. C/S架構(gòu), 客戶端語(yǔ)言支持Java, JavaScript, Python等.
[參考資料]
如何定位元素及代碼編寫(xiě) https://appium.io/docs/en/commands/element/find-elements/index.html
[安裝命令行工具]
brew install node # get node.js
npm install -g appium # 安裝 appium, 只需一次
appium & # 啟動(dòng) appium
[運(yùn)行測(cè)試]
[準(zhǔn)備安卓測(cè)試環(huán)境]
由于React Native的一些限制, 目前還無(wú)法運(yùn)行iOS測(cè)試. 因此只能針對(duì)安卓設(shè)備進(jìn)行自動(dòng)UI測(cè)試.
可以用模擬器AVD, Genymotion(需要先安裝VirtualBox)或者真機(jī)運(yùn)行.
啟動(dòng)模擬器或者真機(jī), 用數(shù)據(jù)線連接到電腦上.
[修改安卓運(yùn)行參數(shù)]
修改文件app/flags.js, 設(shè)置GUI_TEST為true.
// 本文件內(nèi)容在 Jenkins 自動(dòng)打包時(shí)會(huì)被覆蓋, release 模式會(huì)自動(dòng)設(shè)置為 false, dev 會(huì)設(shè)置為true, 修改僅對(duì)本地環(huán)境生效
export const DEBUG = true;
export const GUI_TEST = true;
[打安卓GUI測(cè)試包或者直接進(jìn)入調(diào)試模式]
運(yùn)行命令
chmod +x *.sh
build_android_debug_UI測(cè)試.sh
或直接用調(diào)試模式, 運(yùn)行 react-native run-android
注意這時(shí)候要同時(shí)修改文件 __tests__/Helper.js (不要提交此文件):
app: process.cwd() + "/android/app/build/outputs/apk/li-debug.apk"
[運(yùn)行UI測(cè)試腳本]
使用WebStorm打開(kāi)文件__tests__/GUI.android.test.js 或 __tests__/GUI.android.service.test.js, 點(diǎn)擊運(yùn)行箭頭測(cè)試單個(gè)測(cè)試?yán)?
[使用Android Monitor定位元素的ID或者描述ID]
啟動(dòng)Monitor: android-sdk-macosx/tools/monitor
點(diǎn)擊工具欄上的 Dump view UI hierarchy for Automator
此處對(duì)應(yīng)的resource-id的用法:
let tab = await driver.waitForElementsById("cn.***.***:id/bottom_navigation_container", 15000);
下面的content-desc對(duì)應(yīng)testID, 用法:
let phoneLoginSubmit = await driver.waitForElementsByAccessibilityId('phoneLoginSubmit',20000);
[修改代碼給界面加入測(cè)試定位ID]
大部分元素默認(rèn)都是很不好定位的. 所以必須在RN中給元素加入testID:
<Label accessibilityLabel="phoneLoginSubmit" testID="phoneLoginSubmit"
如果一個(gè)組件是用自定義組件開(kāi)發(fā)的, 必須再自定義組件里面加上對(duì)應(yīng)的testID:
<SubmitButton onPress={this._doPhoneLogin}
accessibilityLabel="phoneLoginSubmit" testID="phoneLoginSubmit"
子組件中的代碼:
{...this.props}> 很重要 或者手動(dòng)寫(xiě)入 accessibilityLabel="phoneLoginSubmit" testID="phoneLoginSubmit"
app/view/SubmitButton.js文件定義
<TouchableOpacity {...this.props}>
<Image source={require('../img/Rectangle.png')} style={styles.buttonView}>
<Text style={styles.loginText}>{this.props.text}</Text>
</Image>
</TouchableOpacity>
