Open louiechristie opened 3 years ago
I resolve this problem adding before the describe this: jest.mock('react-native-keyboard-aware-scroll-view');
, but with this change I don't have access the childrens of component
You can mock with access to childrens with this way:
Another workaround I found below is similar but it mocks it with KeyboardAwareScrollView
@salomaoluiz, do you think there might be pros and cons to using KeyboardAwareScrollView instead of mockImplementation?
FYI: I was having problems with the KeyboardAwareFlatList
.
My workaround:
import { FlatList } from 'react-native';
jest.mock('react-native-keyboard-aware-scroll-view', () => {
const KeyboardAwareScrollView = ({ children }) => children;
const KeyboardAwareFlatList = FlatList;
return { KeyboardAwareScrollView, KeyboardAwareFlatList };
});
I solved this a little different:
jest.mock('react-native/Libraries/Utilities/Platform', () => {
const platform = jest.requireActual('react-native/Libraries/Utilities/Platform');
return {
...platform,
constants: {
...platform.constants,
reactNativeVersion: {
major: 0,
minor: 65,
patch: 1,
}
},
};
});
I solved this a little different:
jest.mock('react-native/Libraries/Utilities/Platform', () => { const platform = jest.requireActual('react-native/Libraries/Utilities/Platform'); return { ...platform, constants: { ...platform.constants, reactNativeVersion: { major: 0, minor: 65, patch: 1, } }, }; });
It works for me, thanks a lot!! How did you get to this solution?
I am using expo and to get RN version I adapted @lucipacurar code.
jest.mock('react-native/Libraries/Utilities/Platform', () => {
const fs = require('fs')
const json = JSON.parse(fs.readFileSync('node_modules/react-native/package.json', 'utf8'))
const platform = jest.requireActual('react-native/Libraries/Utilities/Platform');
const version = json.version.toString().split('.')
return {
...platform,
constants: {
...platform.constants,
reactNativeVersion: {
major: version[0],
minor: version[1],
patch: version[2],
}
},
};
});
Here's a mock that swaps out KeyboardAwareScrollView with a ScrollView to avoid massive diffs in your jest snapshots compared to using ({ children }) => children
jest.mock('react-native-keyboard-aware-scroll-view', () => {
const KeyboardAwareScrollView = require('react-native').ScrollView;
return { KeyboardAwareScrollView };
});
jest.mock("react-native-keyboard-aware-scroll-view", () => {
return {
KeyboardAwareScrollView: (props: { children: React.ReactNode }) =>
props.children,
};
});
Solution provided by @salomaoluiz worked too 🙌
I solved this a little different:
jest.mock('react-native/Libraries/Utilities/Platform', () => { const platform = jest.requireActual('react-native/Libraries/Utilities/Platform'); return { ...platform, constants: { ...platform.constants, reactNativeVersion: { major: 0, minor: 65, patch: 1, } }, }; });
This solution conflicts with
import mockSafeAreaContext from 'react-native-safe-area-context/jest/mock'
jest.mock('react-native-safe-area-context', () => mockSafeAreaContext)
Thus I strongly discourage it.
When running upgrading react-native-keyboard-aware-scroll-view ^0.9.3 → ^0.9.4
by using
I get Jest with react-native-testing-library testing error:
Workaround
Use the built in KeyboardAvoidingView, and ScrollView from React Native
Inspired by this post by pepperedpopcorn on Reddit