Skip to content

Commit

Permalink
RN: Refine StyleSheet.compose Flow Type
Browse files Browse the repository at this point in the history
Summary:
Refines `StyleSheet.compose` so that subtypes of `DangerouslyImpreciseStyleProp` can flow through the function call without losing their type.

This makes it so that if you supply two `ViewStyleProp` types, you will get a `ViewStyleProp` type out of it.

Reviewed By: TheSavior

Differential Revision: D8851699

fbshipit-source-id: e38e572e363a71fddf63d6b6bf5a96b3cdae5915
  • Loading branch information
yungsters authored and facebook-github-bot committed Jul 18, 2018
1 parent 732c3a4 commit 50a481d
Show file tree
Hide file tree
Showing 2 changed files with 87 additions and 5 deletions.
10 changes: 5 additions & 5 deletions Libraries/StyleSheet/StyleSheet.js
Original file line number Diff line number Diff line change
Expand Up @@ -272,12 +272,12 @@ module.exports = {
* array, saving allocations and maintaining reference equality for
* PureComponent checks.
*/
compose(
style1: ?DangerouslyImpreciseStyleProp,
style2: ?DangerouslyImpreciseStyleProp,
): ?DangerouslyImpreciseStyleProp {
compose<T: DangerouslyImpreciseStyleProp>(
style1: ?T,
style2: ?T,
): ?T | $ReadOnlyArray<T> {
if (style1 != null && style2 != null) {
return [style1, style2];
return ([style1, style2]: $ReadOnlyArray<T>);
} else {
return style1 != null ? style1 : style2;
}
Expand Down
82 changes: 82 additions & 0 deletions Libraries/StyleSheet/__flowtests__/StyleSheet-flowtest.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* 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
* @format
*/

'use strict';

const StyleSheet = require('StyleSheet');

import type {ImageStyleProp, TextStyleProp} from 'StyleSheet';

const imageStyle = {tintColor: 'rgb(0, 0, 0)'};
const textStyle = {color: 'rgb(0, 0, 0)'};

module.exports = {
testGoodCompose() {
(StyleSheet.compose(
imageStyle,
imageStyle,
): ImageStyleProp);

(StyleSheet.compose(
textStyle,
textStyle,
): TextStyleProp);

(StyleSheet.compose(
null,
null,
): TextStyleProp);

(StyleSheet.compose(
textStyle,
null,
): TextStyleProp);

(StyleSheet.compose(
textStyle,
Math.random() < 0.5 ? textStyle : null,
): TextStyleProp);

(StyleSheet.compose(
[textStyle],
null,
): TextStyleProp);

(StyleSheet.compose(
[textStyle],
null,
): TextStyleProp);

(StyleSheet.compose(
[textStyle],
[textStyle],
): TextStyleProp);
},

testBadCompose() {
// $FlowExpectedError - Incompatible type.
(StyleSheet.compose(
textStyle,
textStyle,
): ImageStyleProp);

(StyleSheet.compose(
// $FlowExpectedError - Incompatible type.
[textStyle],
null,
): ImageStyleProp);

// $FlowExpectedError - Incompatible type.
(StyleSheet.compose(
Math.random() < 0.5 ? textStyle : null,
null,
): ImageStyleProp);
},
};

0 comments on commit 50a481d

Please sign in to comment.