Skip to content

Instantly share code, notes, and snippets.

@jeffmo
Created April 19, 2017 21:31

Revisions

  1. jeffmo created this gist Apr 19, 2017.
    19 changes: 19 additions & 0 deletions a.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    // @flow

    import {connect} from './connect';

    type Props = {
    name: string,
    magic: number,
    };

    export function MyComponent(props: Props) {
    return <div />;
    }

    export const MyConnectedComponent = connect(MyComponent, { magic: 42 });

    // Flow says only `name` is missing, which is correct since we "connected" `magic`
    //<MyConnectedComponent />;

    // export MyConnectedComponent;
    9 changes: 9 additions & 0 deletions b.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    // @flow

    import {MyConnectedComponent, MyComponent} from './a';

    // Flow says `name` and `magic` are missing, which is expected
    <MyComponent />;

    // Flow is fine with this one?
    <MyConnectedComponent />;
    7 changes: 7 additions & 0 deletions connect.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    // @flow

    type Component<P> = (props: P) => any;

    export function connect<P, E>(component: Component<P>, extra: E): Component<$Diff<P, E>> {
    return (component: any);
    }
    21 changes: 21 additions & 0 deletions output
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@
    > flow version
    Flow, a static type checker for JavaScript, version 0.44.1
    > flow check
    b.js:6
    6: <MyComponent />;
    ^^^^^^^^^^^^^^^ React element `MyComponent`
    10: export function MyComponent(props: Props) {
    ^^^^^ property `magic`. Property not found in. See: a.js:10
    6: <MyComponent />;
    ^^^^^^^^^^^^^^^ props of React element `MyComponent`

    b.js:6
    6: <MyComponent />;
    ^^^^^^^^^^^^^^^ React element `MyComponent`
    10: export function MyComponent(props: Props) {
    ^^^^^ property `name`. Property not found in. See: a.js:10
    6: <MyComponent />;
    ^^^^^^^^^^^^^^^ props of React element `MyComponent`


    Found 2 errors