Skip to content

Commit 16c0109

Browse files
committed
Replace invariant with console.error in View
Jest dumps the invariant error to the console when unit tests run, which is both annoying and more likely to cause unwanted error to go unnoticed. We're also moving away from using 'invariant' in React. This patch replaces the invariant with a call to 'console.error', which won't crash an app that is using raw text nodes as View children, but it's better than nothing.
1 parent 287251a commit 16c0109

File tree

2 files changed

+27
-17
lines changed

2 files changed

+27
-17
lines changed

packages/react-native-web/src/exports/View/__tests__/index-test.js

Lines changed: 22 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -10,27 +10,37 @@ describe('components/View', () => {
1010
expect(container.firstChild).toMatchSnapshot();
1111
});
1212

13-
test('text node throws error (single)', () => {
14-
const subject = () => render(<View>hello</View>);
15-
expect(subject).toThrow();
13+
test('non-text is rendered', () => {
14+
const children = <View testID="1" />;
15+
const { container } = render(<View>{children}</View>);
16+
expect(container.firstChild).toMatchSnapshot();
1617
});
1718

18-
test('text node throws error (array)', () => {
19-
const subject = () =>
19+
describe('raw text nodes as children', () => {
20+
beforeEach(() => {
21+
jest.spyOn(console, 'error');
22+
console.error.mockImplementation(() => {});
23+
});
24+
25+
afterEach(() => {
26+
console.error.mockRestore();
27+
});
28+
29+
test('error logged (single)', () => {
30+
render(<View>hello</View>);
31+
expect(console.error).toBeCalled();
32+
});
33+
34+
test('error logged (array)', () => {
2035
render(
2136
<View>
2237
<View />
2338
hello
2439
<View />
2540
</View>
2641
);
27-
expect(subject).toThrow();
28-
});
29-
30-
test('non-text is rendered', () => {
31-
const children = <View testID="1" />;
32-
const { container } = render(<View>{children}</View>);
33-
expect(container.firstChild).toMatchSnapshot();
42+
expect(console.error).toBeCalled();
43+
});
3444
});
3545

3646
describe('prop "hitSlop"', () => {

packages/react-native-web/src/exports/View/index.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ import applyNativeMethods from '../../modules/applyNativeMethods';
1515
import createElement from '../createElement';
1616
import css from '../StyleSheet/css';
1717
import filterSupportedProps from './filterSupportedProps';
18-
import invariant from 'fbjs/lib/invariant';
1918
import StyleSheet from '../StyleSheet';
2019
import TextAncestorContext from '../Text/TextAncestorContext';
2120
import React from 'react';
@@ -42,10 +41,11 @@ class View extends React.Component<ViewProps> {
4241

4342
if (process.env.NODE_ENV !== 'production') {
4443
React.Children.toArray(this.props.children).forEach(item => {
45-
invariant(
46-
typeof item !== 'string',
47-
`Unexpected text node: ${item}. A text node cannot be a child of a <View>.`
48-
);
44+
if (typeof item === 'string') {
45+
console.error(
46+
`Unexpected text node: ${item}. A text node cannot be a child of a <View>.`
47+
);
48+
}
4949
});
5050
}
5151

0 commit comments

Comments
 (0)