From 559e70d4866ac3ccfe7ebed60a1dedceb3e53b0d Mon Sep 17 00:00:00 2001 From: Simen Bekkhus Date: Sun, 27 Aug 2017 09:34:18 +0200 Subject: [PATCH] Flow upgrade (#4355) * Update to flow 0.52 * Update to flow 0.53 * Suppress flow errors from https://github.com/facebook/flow/issues/4658 * Remove redundant `$FlowFixMe`s * Add new workaround for `React.createElement(undefined)` --- .flowconfig | 2 +- examples/react-native/Intro.js | 2 +- examples/react-native/index.android.js | 2 +- examples/react-native/index.ios.js | 2 +- package.json | 2 +- packages/jest-repl/src/cli/repl.js | 2 ++ .../src/__tests__/immutable.test.js | 14 +++++++- .../pretty-format/src/__tests__/react.test.js | 32 +++++++++++++++---- .../src/plugins/react_element.js | 2 +- test_utils.js | 2 -- yarn.lock | 6 ++-- 11 files changed, 50 insertions(+), 18 deletions(-) diff --git a/.flowconfig b/.flowconfig index 22695855f3e6..17cf8641774d 100644 --- a/.flowconfig +++ b/.flowconfig @@ -13,4 +13,4 @@ module.name_mapper='^types/\(.*\)$' -> '/types/\1.js' module.name_mapper='\(jest-[^/]*\)' -> '/packages/\1/src/index.js' [version] -^0.50.0 +^0.53.1 diff --git a/examples/react-native/Intro.js b/examples/react-native/Intro.js index 71f96408028f..d532570341c6 100644 --- a/examples/react-native/Intro.js +++ b/examples/react-native/Intro.js @@ -26,7 +26,7 @@ const styles = StyleSheet.create({ }, }); -export default class Intro extends Component { +export default class Intro extends Component<{}> { render() { return ( diff --git a/examples/react-native/index.android.js b/examples/react-native/index.android.js index 7cffd18208e0..33cf77567e33 100644 --- a/examples/react-native/index.android.js +++ b/examples/react-native/index.android.js @@ -8,7 +8,7 @@ import Intro from './Intro'; import React, {AppRegistry} from 'react-native'; import {Component} from 'react'; -class App extends Component { +class App extends Component<{}> { render() { return ; } diff --git a/examples/react-native/index.ios.js b/examples/react-native/index.ios.js index 11b268704716..3463bbb41ba9 100644 --- a/examples/react-native/index.ios.js +++ b/examples/react-native/index.ios.js @@ -8,7 +8,7 @@ import Intro from './Intro'; import React, {Component} from 'react'; import {AppRegistry} from 'react-native'; -class App extends Component { +class App extends Component<{}> { render() { return ; } diff --git a/package.json b/package.json index 62bb7c6d48ee..c760695fe56d 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ "eslint-plugin-react": "^7.1.0", "eslint-plugin-relay": "0.0.8", "eslint-plugin-unicorn": "^2.1.2", - "flow-bin": "^0.50.0", + "flow-bin": "^0.53.1", "glob": "^7.1.1", "graceful-fs": "^4.1.11", "immutable": "^4.0.0-rc.1", diff --git a/packages/jest-repl/src/cli/repl.js b/packages/jest-repl/src/cli/repl.js index 6d7705183c17..532d4982fb98 100644 --- a/packages/jest-repl/src/cli/repl.js +++ b/packages/jest-repl/src/cli/repl.js @@ -33,6 +33,7 @@ const evalCommand = (cmd, context, filename, callback, config) => { } result = vm.runInThisContext(cmd); } catch (e) { + // $FlowFixMe: https://github.com/facebook/flow/pull/4713 return callback(isRecoverableError(e) ? new repl.Recoverable(e) : e); } return callback(null, result); @@ -76,6 +77,7 @@ const replInstance = repl.start({ useGlobal: true, }); +// $FlowFixMe: https://github.com/facebook/flow/pull/4713 replInstance.context.require = moduleName => { if (/(\/|\\|\.)/.test(moduleName)) { moduleName = path.resolve(process.cwd(), moduleName); diff --git a/packages/pretty-format/src/__tests__/immutable.test.js b/packages/pretty-format/src/__tests__/immutable.test.js index 20867fd464ac..9c5565765863 100644 --- a/packages/pretty-format/src/__tests__/immutable.test.js +++ b/packages/pretty-format/src/__tests__/immutable.test.js @@ -10,7 +10,7 @@ 'use strict'; -import React from 'react'; +import * as React from 'react'; import Immutable from 'immutable'; import prettyFormat from '../'; const {Immutable: ImmutablePlugin, ReactElement} = prettyFormat.plugins; @@ -98,6 +98,7 @@ describe('Immutable.OrderedSet', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.OrderedSet([reactElement, reactElement]), @@ -107,6 +108,7 @@ describe('Immutable.OrderedSet', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.OrderedSet([reactElement, reactElement]), @@ -181,6 +183,7 @@ describe('Immutable.List', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.List([reactElement, reactElement]), @@ -191,6 +194,7 @@ describe('Immutable.List', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect(Immutable.List([reactElement, reactElement])).toPrettyPrintTo( 'Immutable.List [\n \n Hello World\n ,\n \n Hello World\n ,\n]', @@ -264,6 +268,7 @@ describe('Immutable.Stack', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.Stack([reactElement, reactElement]), @@ -274,6 +279,7 @@ describe('Immutable.Stack', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect(Immutable.Stack([reactElement, reactElement])).toPrettyPrintTo( 'Immutable.Stack [\n \n Hello World\n ,\n \n Hello World\n ,\n]', @@ -343,6 +349,7 @@ describe('Immutable.Set', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.Set([reactElement, reactElement]), @@ -352,6 +359,7 @@ describe('Immutable.Set', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect(Immutable.Set([reactElement, reactElement])).toPrettyPrintTo( 'Immutable.Set [\n \n Hello World\n ,\n]', @@ -403,6 +411,7 @@ describe('Immutable.Map', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.Map({a: reactElement, b: reactElement}), @@ -413,6 +422,7 @@ describe('Immutable.Map', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect(Immutable.Map({a: reactElement, b: reactElement})).toPrettyPrintTo( 'Immutable.Map {\n "a": \n Hello World\n ,\n "b": \n Hello World\n ,\n}', @@ -471,6 +481,7 @@ describe('Immutable.OrderedMap', () => { }); it('supports React elements {min: true}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.OrderedMap({a: reactElement, b: reactElement}), @@ -481,6 +492,7 @@ describe('Immutable.OrderedMap', () => { }); it('supports React elements {min: false}', () => { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 const reactElement = React.createElement('Mouse', null, 'Hello World'); expect( Immutable.OrderedMap({a: reactElement, b: reactElement}), diff --git a/packages/pretty-format/src/__tests__/react.test.js b/packages/pretty-format/src/__tests__/react.test.js index 6bc0d1566bdf..846827b27e62 100644 --- a/packages/pretty-format/src/__tests__/react.test.js +++ b/packages/pretty-format/src/__tests__/react.test.js @@ -13,6 +13,7 @@ import type {OptionsReceived} from 'types/PrettyFormat'; const React = require('react'); const renderer = require('react-test-renderer'); +const elementSymbol = Symbol.for('react.element'); const testSymbol = Symbol.for('react.test.json'); const prettyFormat = require('../'); @@ -57,6 +58,7 @@ test('supports a single element with no props or children', () => { test('supports a single element with non-empty string child', () => { assertPrintedJSX( + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('Mouse', null, 'Hello World'), '\n Hello World\n', ); @@ -64,6 +66,7 @@ test('supports a single element with non-empty string child', () => { test('supports a single element with empty string child', () => { assertPrintedJSX( + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('Mouse', null, ''), '\n \n', ); @@ -71,6 +74,7 @@ test('supports a single element with empty string child', () => { test('supports a single element with non-zero number child', () => { assertPrintedJSX( + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('Mouse', null, 4), '\n 4\n', ); @@ -78,6 +82,7 @@ test('supports a single element with non-zero number child', () => { test('supports a single element with zero number child', () => { assertPrintedJSX( + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('Mouse', null, 0), '\n 0\n', ); @@ -85,6 +90,7 @@ test('supports a single element with zero number child', () => { test('supports a single element with mixed children', () => { assertPrintedJSX( + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('Mouse', null, [[1, null], 2, undefined, [false, [3]]]), '\n 1\n 2\n 3\n', ); @@ -100,6 +106,7 @@ test('supports props with strings', () => { test('supports props with multiline strings', () => { const val = React.createElement( 'svg', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, React.createElement('polyline', { id: 'J', @@ -168,6 +175,7 @@ test('escapes children properly', () => { assertPrintedJSX( React.createElement( 'Mouse', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, '"-"', React.createElement('Mouse'), @@ -294,19 +302,16 @@ test('supports a single element with custom React elements with a child', () => ); }); -test('supports Unknown element', () => { - // Suppress React.createElement(undefined) console error - const consoleError = console.error; - (console: Object).error = jest.fn(); - expect(formatElement(React.createElement(undefined))).toEqual( +test('supports undefined element type', () => { + expect(formatElement({$$typeof: elementSymbol, props: {}})).toEqual( '', ); - (console: Object).error = consoleError; }); test('supports a single element with React elements with a child', () => { assertPrintedJSX( React.createElement('Mouse', { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 prop: React.createElement('div', null, 'mouse'), }), '\n mouse\n \n }\n/>', @@ -318,8 +323,10 @@ test('supports a single element with React elements with children', () => { React.createElement('Mouse', { prop: React.createElement( 'div', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, 'mouse', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('span', null, 'rat'), ), }), @@ -330,6 +337,7 @@ test('supports a single element with React elements with children', () => { test('supports a single element with React elements with array children', () => { assertPrintedJSX( React.createElement('Mouse', { + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 prop: React.createElement('div', null, 'mouse', [ React.createElement('span', {key: 1}, 'rat'), React.createElement('span', {key: 2}, 'cat'), @@ -341,7 +349,9 @@ test('supports a single element with React elements with array children', () => test('supports array of elements', () => { const val = [ + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('dt', null, 'jest'), + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('dd', null, 'to talk in a playful manner'), React.createElement( 'dd', @@ -402,6 +412,7 @@ describe('test object for subset match', () => { describe('indent option', () => { const val = React.createElement( 'ul', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, React.createElement( 'li', @@ -451,6 +462,7 @@ describe('maxDepth option', () => { const val = React.createElement( // ++depth === 1 'dl', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, React.createElement('dt', {id: 'jest'}, 'jest'), // ++depth === 2 React.createElement( @@ -460,6 +472,7 @@ describe('maxDepth option', () => { id: 'jest-1', }, 'to talk in a ', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('em', null, 'playful'), // ++depth === 3 ' manner', ), @@ -473,6 +486,7 @@ describe('maxDepth option', () => { color: '#99424F', }, }, + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('em', null, 'painless'), // ++depth === 3 ' JavaScript testing', ), @@ -513,6 +527,7 @@ describe('maxDepth option', () => { id: 'jest-1', }, 'to talk in a ', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('em', null, 'playful'), // ++depth === 3 ' manner', ), @@ -526,6 +541,7 @@ describe('maxDepth option', () => { color: '#99424F', }, }, + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('em', null, 'painless'), // ++depth === 3 ' JavaScript testing', ), @@ -582,8 +598,10 @@ test('ReactElement plugin highlights syntax', () => { const jsx = React.createElement('Mouse', { prop: React.createElement( 'div', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, 'mouse', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('span', null, 'rat'), ), }); @@ -598,8 +616,10 @@ test('ReactTestComponent plugin highlights syntax', () => { const jsx = React.createElement('Mouse', { prop: React.createElement( 'div', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 null, 'mouse', + // $FlowFixMe: https://github.com/facebook/flow/issues/4658 React.createElement('span', null, 'rat'), ), }); diff --git a/packages/pretty-format/src/plugins/react_element.js b/packages/pretty-format/src/plugins/react_element.js index d6bf6e38d7a5..1418a888201b 100644 --- a/packages/pretty-format/src/plugins/react_element.js +++ b/packages/pretty-format/src/plugins/react_element.js @@ -43,7 +43,7 @@ const getType = element => { }; export const serialize = ( - element: React$Element<*>, + element: React$Element, config: Config, indentation: string, depth: number, diff --git a/test_utils.js b/test_utils.js index 9468a9ceb682..2daf3bfa41f7 100644 --- a/test_utils.js +++ b/test_utils.js @@ -105,7 +105,6 @@ const makeGlobalConfig = (overrides: Object = {}): GlobalConfig => { `); } - // $FlowFixMe Object.assign return Object.assign({}, DEFAULT_GLOBAL_CONFIG, overrides); }; @@ -120,7 +119,6 @@ const makeProjectConfig = (overrides: Object = {}): ProjectConfig => { `); } - // $FlowFixMe Object.assign return Object.assign({}, DEFAULT_PROJECT_CONFIG, overrides); }; diff --git a/yarn.lock b/yarn.lock index b59839f06607..d433d6f82eb6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2763,9 +2763,9 @@ flat-cache@^1.2.1: graceful-fs "^4.1.2" write "^0.2.1" -flow-bin@^0.50.0: - version "0.50.0" - resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.50.0.tgz#d4cdb2430dee1a3599f0eb6fe551146e3027256a" +flow-bin@^0.53.1: + version "0.53.1" + resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.53.1.tgz#9b22b63a23c99763ae533ebbab07f88c88c97d84" flow-remove-types@^1.1.0: version "1.2.1"