Fix inline styles in IntegrationTests (#22165)

Summary: Fix `react-native/no-inline-styles` eslint warning for IntegrationTests module. Pull Request resolved: #22165 Differential Revision: D12946915 Pulled By: TheSavior fbshipit-source-id: 438bb74cc34dd5893f725e4865568715ce949c3a
facebook · Nov 6, 2018 · 1d62e94 · 1d62e94
1 parent 8b46c9a
commit 1d62e94
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 6 deletions.
diff --git a/IntegrationTests/AsyncStorageTest.js b/IntegrationTests/AsyncStorageTest.js
@@ -12,7 +12,7 @@
 
 const React = require('react');
 const ReactNative = require('react-native');
-const {AsyncStorage, Text, View} = ReactNative;
+const {AsyncStorage, Text, View, StyleSheet} = ReactNative;
 const {TestModule} = ReactNative.NativeModules;
 
 const deepDiffer = require('deepDiffer');
@@ -191,7 +191,7 @@ class AsyncStorageTest extends React.Component<{}, $FlowFixMeState> {
 
   render() {
     return (
-      <View style={{backgroundColor: 'white', padding: 40}}>
+      <View style={styles.container}>
         <Text>
           {/* $FlowFixMe(>=0.54.0 site=react_native_fb,react_native_oss) This
              * comment suppresses an error found when Flow v0.54 was deployed.
@@ -205,6 +205,13 @@ class AsyncStorageTest extends React.Component<{}, $FlowFixMeState> {
   }
 }
 
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: 'white',
+    padding: 40,
+  },
+});
+
 AsyncStorageTest.displayName = 'AsyncStorageTest';
 
 module.exports = AsyncStorageTest;
diff --git a/IntegrationTests/ImageCachePolicyTest.js b/IntegrationTests/ImageCachePolicyTest.js
@@ -58,7 +58,7 @@ class ImageCachePolicyTest extends React.Component<Props, $FlowFixMeState> {
 
   render() {
     return (
-      <View style={{flex: 1}}>
+      <View style={styles.container}>
         <Text>Hello</Text>
         <Image
           source={{
@@ -110,6 +110,9 @@ class ImageCachePolicyTest extends React.Component<Props, $FlowFixMeState> {
 }
 
 const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
   base: {
     width: 100,
     height: 100,

diff --git a/IntegrationTests/IntegrationTestHarnessTest.js b/IntegrationTests/IntegrationTestHarnessTest.js
@@ -13,7 +13,7 @@
 const requestAnimationFrame = require('fbjs/lib/requestAnimationFrame');
 const React = require('react');
 const ReactNative = require('react-native');
-const {Text, View} = ReactNative;
+const {Text, View, StyleSheet} = ReactNative;
 const {TestModule} = ReactNative.NativeModules;
 
 type Props = $ReadOnly<{|
@@ -54,7 +54,7 @@ class IntegrationTestHarnessTest extends React.Component<Props, State> {
 
   render() {
     return (
-      <View style={{backgroundColor: 'white', padding: 40}}>
+      <View style={styles.container}>
         <Text>
           {/* $FlowFixMe(>=0.54.0 site=react_native_fb,react_native_oss) This
              * comment suppresses an error found when Flow v0.54 was deployed.
@@ -67,6 +67,13 @@ class IntegrationTestHarnessTest extends React.Component<Props, State> {
   }
 }
 
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: 'white',
+    padding: 40,
+  },
+});
+
 IntegrationTestHarnessTest.displayName = 'IntegrationTestHarnessTest';
 
 module.exports = IntegrationTestHarnessTest;
diff --git a/IntegrationTests/SimpleSnapshotTest.js b/IntegrationTests/SimpleSnapshotTest.js
@@ -34,7 +34,7 @@ class SimpleSnapshotTest extends React.Component<{}> {
 
   render() {
     return (
-      <View style={{backgroundColor: 'white', padding: 100}}>
+      <View style={styles.container}>
         <View style={styles.box1} />
         <View style={styles.box2} />
       </View>
@@ -43,6 +43,10 @@ class SimpleSnapshotTest extends React.Component<{}> {
 }
 
 const styles = StyleSheet.create({
+  container: {
+    backgroundColor: 'white',
+    padding: 100,
+  },
   box1: {
     width: 80,
     height: 50,