From 4d247fe058e3cefd557a166717a753683754f1c4 Mon Sep 17 00:00:00 2001
From: Nick Gerleman <ngerlem@microsoft.com>
Date: Mon, 12 Oct 2020 19:53:39 -0700
Subject: [PATCH] Avoid Repo Structure Assumptions in RNTester Imports (#30141)

Summary:
RNTester has some imports left over that operate on directory traversal, assuming it is contained within react-native sources. This change makes these imports relative to react-native, enabling usage outside of the RN repo.

Relates to https://github.com/microsoft/react-native-windows/issues/6210

## Changelog

[Internal] [Fixed] - Avoid File Structure Assumptions in RNTester Imports

Pull Request resolved: https://github.com/facebook/react-native/pull/30141

Test Plan: Validated we can bundle and flow-check both iOS + Android

Reviewed By: cpojer

Differential Revision: D24259628

Pulled By: appden

fbshipit-source-id: 0c21b5d354b01785d8402599da3b0a5be81b4c6d
---
 .../NativeModuleExample/NativeScreenshotManager.js          | 4 ++--
 packages/rn-tester/RCTTest/RCTSnapshotNativeComponent.js    | 6 +++---
 packages/rn-tester/js/components/RNTesterButton.js          | 2 +-
 .../rn-tester/js/examples/Appearance/AppearanceExample.js   | 2 +-
 packages/rn-tester/js/examples/FlatList/FlatListExample.js  | 2 +-
 .../rn-tester/js/examples/Image/ImageCapInsetsExample.js    | 2 +-
 .../rn-tester/js/examples/Layout/LayoutEventsExample.js     | 2 +-
 .../rn-tester/js/examples/MultiColumn/MultiColumnExample.js | 2 +-
 .../js/examples/NativeAnimation/NativeAnimationsExample.js  | 4 ++--
 .../js/examples/NewAppScreen/NewAppScreenExample.js         | 2 +-
 .../examples/OrientationChange/OrientationChangeExample.js  | 2 +-
 .../js/examples/PanResponder/PanResponderExample.js         | 4 ++--
 .../js/examples/PlatformColor/PlatformColorExample.js       | 2 +-
 .../rn-tester/js/examples/ScrollView/ScrollViewExample.js   | 2 +-
 .../rn-tester/js/examples/SectionList/SectionListExample.js | 2 +-
 .../js/examples/Snapshot/SnapshotViewIOS.android.js         | 2 +-
 .../rn-tester/js/examples/Snapshot/SnapshotViewIOS.ios.js   | 4 ++--
 packages/rn-tester/js/examples/Text/TextExample.ios.js      | 2 +-
 .../js/examples/TurboModule/SampleTurboModuleExample.js     | 4 ++--
 19 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/packages/rn-tester/NativeModuleExample/NativeScreenshotManager.js b/packages/rn-tester/NativeModuleExample/NativeScreenshotManager.js
index 023a8e32956..862ffa5213f 100644
--- a/packages/rn-tester/NativeModuleExample/NativeScreenshotManager.js
+++ b/packages/rn-tester/NativeModuleExample/NativeScreenshotManager.js
@@ -10,8 +10,8 @@
 
 'use strict';
 
-import type {TurboModule} from '../../../Libraries/TurboModule/RCTExport';
-import * as TurboModuleRegistry from '../../../Libraries/TurboModule/TurboModuleRegistry';
+import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport';
+import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry';
 
 export interface Spec extends TurboModule {
   +getConstants: () => {||};
diff --git a/packages/rn-tester/RCTTest/RCTSnapshotNativeComponent.js b/packages/rn-tester/RCTTest/RCTSnapshotNativeComponent.js
index 9d8b9b949e2..f9a30031b15 100644
--- a/packages/rn-tester/RCTTest/RCTSnapshotNativeComponent.js
+++ b/packages/rn-tester/RCTTest/RCTSnapshotNativeComponent.js
@@ -12,9 +12,9 @@
 
 const {requireNativeComponent} = require('react-native');
 
-import type {HostComponent} from '../../../Libraries/Renderer/shims/ReactNativeTypes';
-import type {SyntheticEvent} from '../../../Libraries/Types/CoreEventTypes';
-import type {ViewProps} from '../../../Libraries/Components/View/ViewPropTypes';
+import type {HostComponent} from 'react-native/Libraries/Renderer/shims/ReactNativeTypes';
+import type {SyntheticEvent} from 'react-native/Libraries/Types/CoreEventTypes';
+import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';
 
 type SnapshotReadyEvent = SyntheticEvent<
   $ReadOnly<{testIdentifier: string, ...}>,
diff --git a/packages/rn-tester/js/components/RNTesterButton.js b/packages/rn-tester/js/components/RNTesterButton.js
index 25ffd42ceec..d006e17f2b1 100644
--- a/packages/rn-tester/js/components/RNTesterButton.js
+++ b/packages/rn-tester/js/components/RNTesterButton.js
@@ -14,7 +14,7 @@ const React = require('react');
 
 const {StyleSheet, Text, TouchableHighlight} = require('react-native');
 
-import type {PressEvent} from '../../../../Libraries/Types/CoreEventTypes';
+import type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';
 
 type Props = $ReadOnly<{|
   children?: React.Node,
diff --git a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js
index f4e23a6871e..38a7e68fd8f 100644
--- a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js
+++ b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js
@@ -12,7 +12,7 @@
 
 import * as React from 'react';
 import {Appearance, Text, useColorScheme, View} from 'react-native';
-import type {AppearancePreferences} from '../../../../../Libraries/Utilities/NativeAppearance';
+import type {AppearancePreferences} from 'react-native/Libraries/Utilities/NativeAppearance';
 import {RNTesterThemeContext, themes} from '../../components/RNTesterTheme';
 
 class ColorSchemeSubscription extends React.Component<
diff --git a/packages/rn-tester/js/examples/FlatList/FlatListExample.js b/packages/rn-tester/js/examples/FlatList/FlatListExample.js
index b62e95fb302..4dec5886a01 100644
--- a/packages/rn-tester/js/examples/FlatList/FlatListExample.js
+++ b/packages/rn-tester/js/examples/FlatList/FlatListExample.js
@@ -13,7 +13,7 @@
 const RNTesterPage = require('../../components/RNTesterPage');
 const React = require('react');
 
-const infoLog = require('../../../../../Libraries/Utilities/infoLog');
+const infoLog = require('react-native/Libraries/Utilities/infoLog');
 
 const {
   FooterComponent,
diff --git a/packages/rn-tester/js/examples/Image/ImageCapInsetsExample.js b/packages/rn-tester/js/examples/Image/ImageCapInsetsExample.js
index c0df4a58bf9..f474ca6c9ba 100644
--- a/packages/rn-tester/js/examples/Image/ImageCapInsetsExample.js
+++ b/packages/rn-tester/js/examples/Image/ImageCapInsetsExample.js
@@ -13,7 +13,7 @@
 const React = require('react');
 const ReactNative = require('react-native');
 
-const nativeImageSource = require('../../../../../Libraries/Image/nativeImageSource');
+const nativeImageSource = require('react-native/Libraries/Image/nativeImageSource');
 const {Image, StyleSheet, Text, View} = ReactNative;
 
 type Props = $ReadOnly<{||}>;
diff --git a/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js b/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js
index 48c4cb5d718..55e9e275e48 100644
--- a/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js
+++ b/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js
@@ -23,7 +23,7 @@ const {
 import type {
   ViewLayout,
   ViewLayoutEvent,
-} from '../../../../../Libraries/Components/View/ViewPropTypes';
+} from 'react-native/Libraries/Components/View/ViewPropTypes';
 
 type Props = $ReadOnly<{||}>;
 type State = {
diff --git a/packages/rn-tester/js/examples/MultiColumn/MultiColumnExample.js b/packages/rn-tester/js/examples/MultiColumn/MultiColumnExample.js
index ca822b22c07..7d6b554cd59 100644
--- a/packages/rn-tester/js/examples/MultiColumn/MultiColumnExample.js
+++ b/packages/rn-tester/js/examples/MultiColumn/MultiColumnExample.js
@@ -12,7 +12,7 @@
 const RNTesterPage = require('../../components/RNTesterPage');
 const React = require('react');
 
-const infoLog = require('../../../../../Libraries/Utilities/infoLog');
+const infoLog = require('react-native/Libraries/Utilities/infoLog');
 
 const {
   FooterComponent,
diff --git a/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js b/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js
index 7afe58e886b..81851e1e2f7 100644
--- a/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js
+++ b/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js
@@ -195,13 +195,13 @@ class InternalSettings extends React.Component<
           initialValue={false}
           label="Track JS Stalls"
           onEnable={() => {
-            require('../../../../../Libraries/Interaction/JSEventLoopWatchdog').install(
+            require('react-native/Libraries/Interaction/JSEventLoopWatchdog').install(
               {
                 thresholdMS: 25,
               },
             );
             this.setState({busyTime: '<none>'});
-            require('../../../../../Libraries/Interaction/JSEventLoopWatchdog').addHandler(
+            require('react-native/Libraries/Interaction/JSEventLoopWatchdog').addHandler(
               {
                 onStall: ({busyTime}) =>
                   this.setState(state => ({
diff --git a/packages/rn-tester/js/examples/NewAppScreen/NewAppScreenExample.js b/packages/rn-tester/js/examples/NewAppScreen/NewAppScreenExample.js
index 277cdc9a5d8..5dad9e2fc52 100644
--- a/packages/rn-tester/js/examples/NewAppScreen/NewAppScreenExample.js
+++ b/packages/rn-tester/js/examples/NewAppScreen/NewAppScreenExample.js
@@ -18,7 +18,7 @@ const {
   Colors,
   DebugInstructions,
   ReloadInstructions,
-} = require('../../../../../Libraries/NewAppScreen');
+} = require('react-native/Libraries/NewAppScreen');
 
 exports.title = 'New App Screen';
 exports.description = 'Displays the content of the new app screen';
diff --git a/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js b/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js
index 1cf3d45e20f..c8b2df92d3e 100644
--- a/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js
+++ b/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js
@@ -14,7 +14,7 @@ const React = require('react');
 
 const {DeviceEventEmitter, Text, View} = require('react-native');
 
-import {type EventSubscription} from '../../../../../Libraries/vendor/emitter/EventEmitter';
+import {type EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter';
 
 class OrientationChangeExample extends React.Component<{...}, $FlowFixMeState> {
   _orientationSubscription: EventSubscription;
diff --git a/packages/rn-tester/js/examples/PanResponder/PanResponderExample.js b/packages/rn-tester/js/examples/PanResponder/PanResponderExample.js
index 33dcf037b43..fcb807edb9d 100644
--- a/packages/rn-tester/js/examples/PanResponder/PanResponderExample.js
+++ b/packages/rn-tester/js/examples/PanResponder/PanResponderExample.js
@@ -17,8 +17,8 @@ const RNTesterPage = require('../../components/RNTesterPage');
 import type {
   PanResponderInstance,
   GestureState,
-} from '../../../../../Libraries/Interaction/PanResponder';
-import type {PressEvent} from '../../../../../Libraries/Types/CoreEventTypes';
+} from 'react-native/Libraries/Interaction/PanResponder';
+import type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';
 
 type CircleStyles = {
   backgroundColor?: string,
diff --git a/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js b/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
index 345b609ac31..e542f70ff3b 100644
--- a/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
+++ b/packages/rn-tester/js/examples/PlatformColor/PlatformColorExample.js
@@ -12,7 +12,7 @@
 
 const React = require('react');
 const ReactNative = require('react-native');
-import Platform from '../../../../../Libraries/Utilities/Platform';
+import Platform from 'react-native/Libraries/Utilities/Platform';
 const {DynamicColorIOS, PlatformColor, StyleSheet, Text, View} = ReactNative;
 
 function PlatformColorsExample() {
diff --git a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js
index 76e9147080e..7aa352b4228 100644
--- a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js
+++ b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js
@@ -23,7 +23,7 @@ const {
 
 const nullthrows = require('nullthrows');
 
-import type {ViewStyleProp} from '../../../../../Libraries/StyleSheet/StyleSheet';
+import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 
 exports.displayName = 'ScrollViewExample';
 exports.title = 'ScrollView';
diff --git a/packages/rn-tester/js/examples/SectionList/SectionListExample.js b/packages/rn-tester/js/examples/SectionList/SectionListExample.js
index f65cc8196f2..b00cc81c71e 100644
--- a/packages/rn-tester/js/examples/SectionList/SectionListExample.js
+++ b/packages/rn-tester/js/examples/SectionList/SectionListExample.js
@@ -12,7 +12,7 @@
 const RNTesterPage = require('../../components/RNTesterPage');
 const React = require('react');
 
-const infoLog = require('../../../../../Libraries/Utilities/infoLog');
+const infoLog = require('react-native/Libraries/Utilities/infoLog');
 
 const {
   HeaderComponent,
diff --git a/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.android.js b/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.android.js
index 824ac6a0ef4..29970c1f7b4 100644
--- a/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.android.js
+++ b/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.android.js
@@ -9,4 +9,4 @@
 
 'use strict';
 
-module.exports = require('../../../../../Libraries/Components/UnimplementedViews/UnimplementedView');
+module.exports = require('react-native/Libraries/Components/UnimplementedViews/UnimplementedView');
diff --git a/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.ios.js b/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.ios.js
index dd0596eadf9..89296d7d3d7 100644
--- a/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.ios.js
+++ b/packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.ios.js
@@ -16,8 +16,8 @@ const {NativeModules, StyleSheet, UIManager, View} = require('react-native');
 
 const {TestModule} = NativeModules;
 
-import type {SyntheticEvent} from '../../../../../Libraries/Types/CoreEventTypes';
-import type {ViewProps} from '../../../../../Libraries/Components/View/ViewPropTypes';
+import type {SyntheticEvent} from 'react-native/Libraries/Types/CoreEventTypes';
+import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';
 
 // Verify that RCTSnapshot is part of the UIManager since it is only loaded
 // if you have linked against RCTTest like in tests, otherwise we will have
diff --git a/packages/rn-tester/js/examples/Text/TextExample.ios.js b/packages/rn-tester/js/examples/Text/TextExample.ios.js
index 9562f1c45b4..1acdfd2e3aa 100644
--- a/packages/rn-tester/js/examples/Text/TextExample.ios.js
+++ b/packages/rn-tester/js/examples/Text/TextExample.ios.js
@@ -11,7 +11,7 @@
 'use strict';
 
 const React = require('react');
-const TextAncestor = require('../../../../../Libraries/Text/TextAncestor');
+const TextAncestor = require('react-native/Libraries/Text/TextAncestor');
 const TextInlineView = require('../../components/TextInlineView');
 const TextLegend = require('../../components/TextLegend');
 
diff --git a/packages/rn-tester/js/examples/TurboModule/SampleTurboModuleExample.js b/packages/rn-tester/js/examples/TurboModule/SampleTurboModuleExample.js
index c55e2d2ae60..bc227cdc94c 100644
--- a/packages/rn-tester/js/examples/TurboModule/SampleTurboModuleExample.js
+++ b/packages/rn-tester/js/examples/TurboModule/SampleTurboModuleExample.js
@@ -10,8 +10,8 @@
 
 'use strict';
 
-import NativeSampleTurboModule from '../../../../../Libraries/TurboModule/samples/NativeSampleTurboModule';
-import type {RootTag} from '../../../../../Libraries/ReactNative/RootTag';
+import NativeSampleTurboModule from 'react-native/Libraries/TurboModule/samples/NativeSampleTurboModule';
+import type {RootTag} from 'react-native/Libraries/ReactNative/RootTag';
 import {
   StyleSheet,
   Text,