fix: check and fixed failing tests (#1673)

Author: greenfrvr

src/components/devsupport/components/falsyFC/falsyFC.spec.tsx

@@ -30,11 +30,10 @@ it('should render provided function component', () => {
 
 it('should render provided function component with hooks', () => {
   const HookComponent = (props): React.ReactElement => {
-    const state = React.useState(1);
+    const [state] = React.useState(1);
     return (
       <Text {...props}>
-        I love Babel
-        {state}
+        {`I love Babel ${state}`}
       </Text>
     );
   };

src/components/devsupport/components/falsyText/falsyText.spec.tsx

@@ -35,11 +35,10 @@ it('should render provided function component', () => {
 
 it('should render provided function component with hooks', () => {
   const HookComponent = (props): React.ReactElement => {
-    const state = React.useState(1);
+    const [state] = React.useState(1);
     return (
       <Text {...props}>
-        I love Babel
-        {state}
+        {`I love Babel ${state}`}
       </Text>
     );
   };

src/components/ui/calendar/calendar.spec.tsx

@@ -33,7 +33,7 @@ describe('@calendar: component checks', () => {
    * Get rid of useNativeDriver warnings
    */
   beforeAll(() => {
-    jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');
+    jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');
   });
 
   afterAll(() => {

src/components/ui/calendar/rangeCalendar.spec.tsx

@@ -25,7 +25,7 @@ describe('@range-calendar: component checks', () => {
    * Get rid of useNativeDriver warnings
    */
   beforeAll(() => {
-    jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');
+    jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');
   });
 
   afterAll(() => {

src/components/ui/shared/tabIndicator.component.tsx

@@ -14,6 +14,7 @@ import {
   View,
   ViewProps,
   ViewStyle,
+  StyleSheet,
 } from 'react-native';
 import { RTLService } from '../../devsupport';
 
@@ -99,7 +100,7 @@ export class TabIndicator extends React.Component<TabIndicatorProps> {
   };
 
   private renderIndicatorLine = (style: StyleProp<ViewStyle>): React.ReactElement => {
-    const styles = [{ width: '100%', alignSelf: 'center', style }] as StyleProp<ViewStyle>;
+    const styles = [{ width: '100%', alignSelf: 'center' }, StyleSheet.flatten(style)] as StyleProp<ViewStyle>;
     return (
       <View
         testID="indicator body"

src/components/ui/tab/tab.spec.tsx

@@ -7,7 +7,7 @@
 import React from 'react';
 import {
   Image,
-  ImageProps,
+  ImageProps, StyleSheet,
   Text,
   TouchableOpacity,
 } from 'react-native';
@@ -175,19 +175,11 @@ describe('@tab-bar: component checks', () => {
       <TestTabBar indicatorStyle={styles} />,
     );
 
-    const el = ((
-      (component.UNSAFE_queryByType(TabIndicator).children[0] as ReactTestInstance)
-        .children[0] as ReactTestInstance)
-      .children[0] as ReactTestInstance)
-      .children[0] as ReactTestInstance;
+    const el = component.queryByTestId('indicator body');
+    const style = StyleSheet.flatten(el.props.style);
 
-    // default styles
-    expect(el.props.style[0].width).toEqual('100%');
-    expect(el.props.style[1][0].backgroundColor).toEqual('#3366FF');
-
-    // custom styles
-    expect(el.props.style[1][1].width).toEqual(99);
-    expect(el.props.style[1][1].backgroundColor).toEqual('red');
+    expect(style.width).toEqual(99);
+    expect(style.backgroundColor).toEqual('red');
   });
 });
 
@@ -245,19 +237,11 @@ describe('@tab-view: component checks', () => {
       <TestTabView indicatorStyle={styles} />,
     );
 
-    const el = ((
-      (component.UNSAFE_queryByType(TabIndicator).children[0] as ReactTestInstance)
-        .children[0] as ReactTestInstance)
-      .children[0] as ReactTestInstance)
-      .children[0] as ReactTestInstance;
-
-    // default styles
-    expect(el.props.style[0].width).toEqual('100%');
-    expect(el.props.style[1][0].backgroundColor).toEqual('#3366FF');
+    const el = component.queryByTestId('indicator body');
+    const style = StyleSheet.flatten(el.props.style);
 
-    // custom styles
-    expect(el.props.style[1][1].width).toEqual(99);
-    expect(el.props.style[1][1].backgroundColor).toEqual('red');
+    expect(style.width).toEqual(99);
+    expect(style.backgroundColor).toEqual('red');
   });
 });