kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-01-12 22:50:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add setNativeProps support for SafeAreaView (#24589)

Browse Source 
Summary:
Fixes #24576 .
cc. cpojer .

[iOS] [Fixed] - Add setNativeProps support for SafeAreaView
Pull Request resolved: https://github.com/facebook/react-native/pull/24589

Differential Revision: D15099303

Pulled By: cpojer

fbshipit-source-id: f694f19fd932236c001056f38cc976db38db68a6
This commit is contained in:
zhongwuzw
2019-04-26 08:43:47 -07:00
committed by Facebook Github Bot
parent 243070afe2
commit cc2b3d0ebf
3 changed files with 141 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
Libraries/Components/SafeAreaView/SafeAreaView.js
View File

@@ -4,7 +4,7 @@
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow strict-local
* @flow
* @format
*/
@@ -13,6 +13,7 @@ const React = require('React');
const View = require('View');
import type {ViewProps} from 'ViewPropTypes';
import type {NativeComponent} from 'ReactNative';
type Props = $ReadOnly<{|
...ViewProps,
@@ -31,24 +32,36 @@ let exported;
* sensor housing area on iPhone X).
*/
if (Platform.OS === 'android') {
exported = class SafeAreaView extends React.Component<Props> {
render(): React.Node {
const {emulateUnlessSupported, ...props} = this.props;
return <View {...props} />;
}
const SafeAreaView = (
props: Props,
forwardedRef?: ?React.Ref<typeof View>,
) => {
const {emulateUnlessSupported, ...localProps} = props;
return <View {...localProps} ref={forwardedRef} />;
};
const SafeAreaViewRef = React.forwardRef(SafeAreaView);
SafeAreaViewRef.displayName = 'SafeAreaView';
exported = ((SafeAreaViewRef: any): Class<React.Component<Props>>);
} else {
const RCTSafeAreaViewNativeComponent = require('RCTSafeAreaViewNativeComponent');
exported = class SafeAreaView extends React.Component<Props> {
render(): React.Node {
return (
<RCTSafeAreaViewNativeComponent
emulateUnlessSupported={true}
{...this.props}
/>
);
}
const SafeAreaView = (
props: Props,
forwardedRef?: ?React.Ref<typeof RCTSafeAreaViewNativeComponent>,
) => {
return (
<RCTSafeAreaViewNativeComponent
emulateUnlessSupported={true}
{...props}
ref={forwardedRef}
/>
);
};
const SafeAreaViewRef = React.forwardRef(SafeAreaView);
SafeAreaViewRef.displayName = 'SafeAreaView';
exported = ((SafeAreaViewRef: any): Class<NativeComponent<Props>>);
}
module.exports = exported;

68
Libraries/Components/SafeAreaView/__tests__/SafeAreaView-test.js Normal file
View File

@@ -0,0 +1,68 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @emails oncall+react_native
* @flow
*/
'use strict';
const React = require('React');
const SafeAreaView = require('SafeAreaView');
const render = require('../../../../jest/renderer');
const View = require('View');
const Text = require('Text');
describe('<SafeAreaView />', () => {
it('should render as <SafeAreaView> when mocked', () => {
const instance = render.create(
<SafeAreaView>
<View>
<Text>Hello World!</Text>
</View>
</SafeAreaView>,
);
expect(instance).toMatchSnapshot();
});
it('should shallow render as <ForwardRef(SafeAreaView)> when mocked', () => {
const output = render.shallow(
<SafeAreaView>
<View>
<Text>Hello World!</Text>
</View>
</SafeAreaView>,
);
expect(output).toMatchSnapshot();
});
it('should shallow render as <ForwardRef(SafeAreaView)> when not mocked', () => {
jest.dontMock('SafeAreaView');
const output = render.shallow(
<SafeAreaView>
<View>
<Text>Hello World!</Text>
</View>
</SafeAreaView>,
);
expect(output).toMatchSnapshot();
});
it('should render as <SafeAreaView> when not mocked', () => {
jest.dontMock('SafeAreaView');
const instance = render.create(
<SafeAreaView>
<View>
<Text>Hello World!</Text>
</View>
</SafeAreaView>,
);
expect(instance).toMatchSnapshot();
});
});

45
Libraries/Components/SafeAreaView/__tests__/__snapshots__/SafeAreaView-test.js.snap Normal file
View File

@@ -0,0 +1,45 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<SafeAreaView /> should render as <SafeAreaView> when mocked 1`] = `
<RCTSafeAreaView
emulateUnlessSupported={true}
>
<View>
<Text>
Hello World!
</Text>
</View>
</RCTSafeAreaView>
`;
exports[`<SafeAreaView /> should render as <SafeAreaView> when not mocked 1`] = `
<RCTSafeAreaView
emulateUnlessSupported={true}
>
<View>
<Text>
Hello World!
</Text>
</View>
</RCTSafeAreaView>
`;
exports[`<SafeAreaView /> should shallow render as <ForwardRef(SafeAreaView)> when mocked 1`] = `
<ForwardRef(_SafeAreaView)>
<View>
<Text>
Hello World!
</Text>
</View>
</ForwardRef(_SafeAreaView)>
`;
exports[`<SafeAreaView /> should shallow render as <ForwardRef(SafeAreaView)> when not mocked 1`] = `
<ForwardRef(_SafeAreaView)>
<View>
<Text>
Hello World!
</Text>
</View>
</ForwardRef(_SafeAreaView)>
`;