Implement Text input example use cases and e2e tests

packages/rn-tester/e2e/__tests__/TextInput-test.js

@@ -19,44 +19,51 @@ describe('TextInput', () => {
     await device.reloadReactNative();
     await openComponentWithLabel(
       'TextInput',
-      'Single and multi-line text inputs.',
+      'TextInput A foundational component for inputting text into the app via a keyboard.',
     );
   });
 
-  it('Live rewrite with spaces should replace spaces and enforce max length', async () => {
-    await openExampleWithTitle('Live Re-Write \\(<sp>');
+  it('should accept input', async () => {
+    await openExampleWithTitle('TextInput with autoFocus={true}');
 
-    await element(by.id('rewrite_sp_underscore_input')).typeText(
-      'this is a long sentence',
-    );
-    await expect(element(by.id('rewrite_sp_underscore_input'))).toHaveText(
-      'this_is_a_long_sente',
+    await element(by.id('check_text_input')).typeText('Check text input');
+    await expect(element(by.id('check_text_input'))).toHaveText(
+      'Check text input',
     );
   });
 
-  it('Live rewrite with no spaces should remove spaces', async () => {
-    await openExampleWithTitle('Live Re-Write \\(no spaces');
+  it('should not allow spaces in no-spaces-input', async () => {
+    await openExampleWithTitle(
+      "TextInput that replaces spaces with underscore '_'",
+    );
 
-    await element(by.id('rewrite_no_sp_input')).typeText(
+    await element(by.id('rewrite_sp_underscore_input')).typeText(
       'this is a long sentence',
     );
-    await expect(element(by.id('rewrite_no_sp_input'))).toHaveText(
-      'thisisalongsentence',
+
+    await expect(element(by.id('rewrite_sp_underscore_input'))).toHaveText(
+      'this_is_a_long_sentence',
     );
   });
 
-  it('Live rewrite with clear should remove spaces and clear', async () => {
-    await openExampleWithTitle('and clear');
+  it('should not exceed maximum length when maxLength is used', async () => {
+    await openExampleWithTitle('TextInput with maxLength={limit}');
 
-    await element(by.id('rewrite_clear_input')).typeText(
-      'this is a long sentence',
+    await element(by.id('max_length_input')).typeText(
+      'this is a very long sentence.',
     );
-    await expect(element(by.id('rewrite_clear_input'))).toHaveText(
-      'thisisalongsentence',
+
+    await expect(element(by.id('max_length_input'))).toHaveText(
+      'this is a very long ',
     );
+  });
 
+  it("should be cleared by tapping 'Clear' button", async () => {
+    await openExampleWithTitle("TextInput along with 'Clear' button");
+    await element(by.id('clear_text_input')).typeText(
+      'this text needs to be cleared',
+    );
     await element(by.id('rewrite_clear_button')).tap();
-
-    await expect(element(by.id('rewrite_clear_input'))).toHaveText('');
+    await expect(element(by.id('clear_text_input'))).toHaveText('');
   });
 });

packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js

@@ -751,6 +751,7 @@ class AnnounceForAccessibility extends React.Component<{}> {
 }
 
 exports.title = 'Accessibility';
+exports.documentationURL = 'https://reactnative.dev/docs/accessibilityinfo';
 exports.description = 'Examples of using Accessibility APIs.';
 exports.examples = [
   {

packages/rn-tester/js/examples/Animated/AnimatedExample.js

@@ -33,6 +33,7 @@ const styles = StyleSheet.create({
 
 exports.framework = 'React';
 exports.title = 'Animated - Examples';
+exports.documentationURL = 'https://reactnative.dev/docs/animated';
 exports.description = ('Animated provides a powerful ' +
   'and easy-to-use API for building modern, ' +
   'interactive user experiences.': string);

packages/rn-tester/js/examples/AppState/AppStateExample.js

@@ -71,6 +71,7 @@ class AppStateSubscription extends React.Component<
 }
 
 exports.title = 'AppState';
+exports.documentationURL = 'https://reactnative.dev/docs/appstate';
 exports.description = 'app background status';
 exports.examples = [
   {

packages/rn-tester/js/examples/Appearance/AppearanceExample.js

@@ -77,6 +77,7 @@ const ThemedText = props => (
 );
 
 exports.title = 'Appearance';
+exports.documentationURL = 'https://reactnative.dev/docs/appearance';
 exports.description = 'Light and dark user interface examples.';
 exports.examples = [
   {

packages/rn-tester/js/examples/Button/ButtonExample.js

@@ -23,6 +23,7 @@ exports.displayName = 'ButtonExample';
 exports.framework = 'React';
 exports.category = 'UI';
 exports.title = 'Button';
+exports.documentationURL = 'https://reactnative.dev/docs/button';
 exports.description = 'Simple React Native button component.';
 
 exports.examples = [