From 9cd6ae2f4b8f3177ef4e75661a692861a2a8edab Mon Sep 17 00:00:00 2001
From: Josh Justice <me@codingitwrong.com>
Date: Mon, 10 Dec 2018 17:52:13 -0800
Subject: [PATCH] Updated Button e2e tests to look up elements via testID
 (#22593)

Summary:
Previously the e2e test for Butto looked up elements by label. This can be fragile, and based on my understanding from TheSavior we would prefer to use testIDs. This also sets a consistent pattern we can point future contributors to, to follow.

Note that we are still looking up elements in the alerts shown by label. I haven't yet looked into whether it would be possible to add testIDs to alerts; it might be too complex to be worth it.
Pull Request resolved: https://github.com/facebook/react-native/pull/22593

Differential Revision: D13410799

Pulled By: TheSavior

fbshipit-source-id: 4bda80f4b8e7fe3ef17cd33209ec86d9183fd5e9
---
 RNTester/e2e/__tests__/Button-test.js | 10 +++++-----
 RNTester/js/ButtonExample.js          |  5 +++++
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/RNTester/e2e/__tests__/Button-test.js b/RNTester/e2e/__tests__/Button-test.js
index 47e211ab790..9f0712f7522 100644
--- a/RNTester/e2e/__tests__/Button-test.js
+++ b/RNTester/e2e/__tests__/Button-test.js
@@ -24,29 +24,29 @@ describe('Button', () => {
   });
 
   it('Simple button should be tappable', async () => {
-    await element(by.label('Press Me')).tap();
+    await element(by.id('simple_button')).tap();
     await expect(element(by.text('Simple has been pressed!'))).toBeVisible();
     await element(by.text('OK')).tap();
   });
 
   it('Adjusted color button should be tappable', async () => {
-    await element(by.label('Press Purple')).tap();
+    await element(by.id('purple_button')).tap();
     await expect(element(by.text('Purple has been pressed!'))).toBeVisible();
     await element(by.text('OK')).tap();
   });
 
   it("Two buttons with JustifyContent:'space-between' should be tappable", async () => {
-    await element(by.label('This looks great!')).tap();
+    await element(by.id('left_button')).tap();
     await expect(element(by.text('Left has been pressed!'))).toBeVisible();
     await element(by.text('OK')).tap();
 
-    await element(by.label('Ok!')).tap();
+    await element(by.id('right_button')).tap();
     await expect(element(by.text('Right has been pressed!'))).toBeVisible();
     await element(by.text('OK')).tap();
   });
 
   it('Disabled button should not interact', async () => {
-    await element(by.label('I Am Disabled')).tap();
+    await element(by.id('disabled_button')).tap();
     await expect(
       element(by.text('Disabled has been pressed!')),
     ).toBeNotVisible();
diff --git a/RNTester/js/ButtonExample.js b/RNTester/js/ButtonExample.js
index 4892947c484..ccabd4ae786 100644
--- a/RNTester/js/ButtonExample.js
+++ b/RNTester/js/ButtonExample.js
@@ -34,6 +34,7 @@ exports.examples = [
       return (
         <Button
           onPress={() => onButtonPress('Simple')}
+          testID="simple_button"
           title="Press Me"
           accessibilityLabel="See an informative alert"
         />
@@ -50,6 +51,7 @@ exports.examples = [
       return (
         <Button
           onPress={() => onButtonPress('Purple')}
+          testID="purple_button"
           title="Press Purple"
           color="#841584"
           accessibilityLabel="Learn more about purple"
@@ -66,11 +68,13 @@ exports.examples = [
         <View style={styles.container}>
           <Button
             onPress={() => onButtonPress('Left')}
+            testID="left_button"
             title="This looks great!"
             accessibilityLabel="This sounds great!"
           />
           <Button
             onPress={() => onButtonPress('Right')}
+            testID="right_button"
             title="Ok!"
             color="#841584"
             accessibilityLabel="Ok, Great!"
@@ -87,6 +91,7 @@ exports.examples = [
         <Button
           disabled
           onPress={() => onButtonPress('Disabled')}
+          testID="disabled_button"
           title="I Am Disabled"
           accessibilityLabel="See an informative alert"
         />