React Native 0.60 UI Testing with Appium in 10 Easy Steps

 

Our very own React Native Developer, Mahmoud Hamed wrote a great tutorial on Medium on how to get React Native UI Testing up and running with Appium in 10 easy steps. Please read the article below:

First of all why Appium?

0_86Dvg79D9rD99tSs

MemeGenerator — JuniorsLoveToCode — Automated Testing Meme

Why did I write this article?

0_ahL1WmiTyoQ02CWN

MemeGenerator — Appium Meme

Lets get it done!



		
yarn add appium appium-doctor
yarn run appium-doctor
yarn add wd

<TouchableOpacityaccessibilityLabel=’alertButton’

style={{width:100,height:100,backgroundColor:’aqua’}}

onPress={() => alert(‘Hello’)}>

<Text>Hello</Text>

</TouchableOpacity>

import wd from ‘wd’;

jasmine.DEFAULT_TIMEOUT_INTERVAL = 60000;

const PORT = 4723;

const config = {

platformName: ‘Android’,

deviceName: ‘Android Emulator’,

app: ‘Users/user/yourProjectName/android/app/build/outputs/apk/app-debug.apk’};

const driver = wd.promiseChainRemote(‘localhost’, PORT);

beforeAll(async () => {

await driver.init(config);

await driver.sleep(3000);

}) // Sometime for the app to load

test(‘my first appium test’, async () => {

expect(await
driver.hasElementByAccessibilityId(‘alertButton’)).toBe(true);

const element = await driver.elementByAccessibilityId(‘alertButton’)

await element.click()

expect(await
driver.hasElementByAccessibilityId(‘notHere’)).toBe(false);
});

0_ZfE-U6jpqdZJ3Ie6

MemeGenerator — StarWars Meme

Written by: Mahmoud Hamed. 

An IT wiz made of many parts: part Software Engineer, part ReactJS/React Native Developer, part gamer, part technology curious geek and part gym enthusiast.