Fix View/Text displayName (#21950)

Summary:
Adds the displayName prop to `View` and `Text` components. Because these now use `React.forwardRef`, they were showing as `Component` instead of their actual names.

Thanks to ljharb for helping to pinpoint the source of the issue!

Fixes #21937
Pull Request resolved: #21950

Differential Revision: D12827060

Pulled By: TheSavior

fbshipit-source-id: d812cae14d53ad821ab5873e737db63ad1a989e3

Libraries/Components/View/View.js

@@ -49,6 +49,7 @@ if (__DEV__) {
     };
     // $FlowFixMe - TODO T29156721 `React.forwardRef` is not defined in Flow, yet.
     ViewToExport = React.forwardRef(View);
+    ViewToExport.displayName = 'View';
   }
 }
 

Libraries/Text/Text.js

@@ -277,6 +277,7 @@ const Text = (
 };
 // $FlowFixMe - TODO T29156721 `React.forwardRef` is not defined in Flow, yet.
 const TextToExport = React.forwardRef(Text);
+TextToExport.displayName = 'Text';
 
 // TODO: Deprecate this.
 TextToExport.propTypes = DeprecatedTextPropTypes;

Libraries/YellowBox/Data/__tests__/__snapshots__/YellowBoxCategory-test.js.snap

@@ -2,94 +2,94 @@
 
 exports[`YellowBoxCategory renders a single substitution 1`] = `
 Array [
-  <Component
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "A"
-  </Component>,
+  </Text>,
 ]
 `;
 
 exports[`YellowBoxCategory renders content with no substitutions 1`] = `
 Array [
-  <Component>
+  <Text>
     A
-  </Component>,
+  </Text>,
 ]
 `;
 
 exports[`YellowBoxCategory renders multiple substitutions 1`] = `
 Array [
-  <Component
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "A"
-  </Component>,
-  <Component>
+  </Text>,
+  <Text>
      
-  </Component>,
-  <Component
+  </Text>,
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "B"
-  </Component>,
-  <Component>
+  </Text>,
+  <Text>
      
-  </Component>,
-  <Component
+  </Text>,
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "C"
-  </Component>,
+  </Text>,
 ]
 `;
 
 exports[`YellowBoxCategory renders substitutions with leading content 1`] = `
 Array [
-  <Component>
+  <Text>
     !
-  </Component>,
-  <Component
+  </Text>,
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "A"
-  </Component>,
+  </Text>,
 ]
 `;
 
 exports[`YellowBoxCategory renders substitutions with trailing content 1`] = `
 Array [
-  <Component
+  <Text
     style={
       Object {
         "fontWeight": "bold",
       }
     }
   >
     "A"
-  </Component>,
-  <Component>
+  </Text>,
+  <Text>
     !
-  </Component>,
+  </Text>,
 ]
 `;