unnecessary-optional-chain incorrectly reports warning

[lukeapage]

Flow version: 0.107.0

Expected behavior

No warnings

Actual behavior

Cannot try on flow.org/try as it does not allow configuration of lint rules.

// @flow

type State = {|
    base?: {|
        data: {|
            a: string,
        |},
    |},
|};

const getBase = (state: State) => state.base ?? {};

export const getA = (state: State) => getBase(state).data?.a;

gives the following warning:

Warning ---------------------------------------------------------------------------------- frontend/src/flowbug.js:14:39                                                                                                                                                                                                                                                  This use of optional chaining (?.) is unnecessary because getBase(...).data [1] cannot be nullish or because an earlier                                                              ?. will short-circuit the nullish case. (unnecessary-optional-chain)                                                                                                                                                                                                                                                                                                           11\| // : {\| data?: {\| a: string \|} \|}                                                                                                                                                12\| const getBase = (state: State) => state.base ?? {};                                                                                                                              13\|                                                                                                                                                                              [1] 14\| export const getA = (state: State) => getBase(state).data?.a;                                                                                                                    15\|
--

so if I try to fix it by adding explicit types, I get a new warning

// @flow

type State = {|
    base?: {|
        data: {|
            a: string,
        |},
    |},
|};

const getBase = (state: State): : {| data?: {| a: string |} |} => state.base ?? {};

export const getA = (state: State) => getBase(state).data?.a;

gives

Error ------------------------------------------------------------------------------------ frontend/src/flowbug.js:11:65                                                                                                                                                                                                                                                  Cannot return state.base ?? {...} because:                                                                                                                                            - inexact undefined [1] is incompatible with exact object type [2] in property data.                                                                                                 - inexact object literal [3] is incompatible with exact object type [4].                                                                                                                                                                                                                                                                                                        [2]  5\|         data: {\|                                                                                                                                                                  6\|             a: string,                                                                                                                                                            7\|         \|},                                                                                                                                                                       8\|     \|},                                                                                                                                                                           9\| \|};                                                                                                                                                                              10\|                                                                                                                                                                        [4][1][3] 11\| const getBase = (state: State): {\| data?: {\| a: string \|} \|} => state.base ?? {};                                                                                                12\|                                                                                                                                                                                  13\| export const getA = (state: State) => getBase(state).data?.a;                                                                                                                    14\|
--

and if I try a third possibility I get another existing bug

// @flow

type State = {|
    base?: {|
        data: {|
            a: string,
        |},
    |},
|};

const getBase = (state: State): {| data: {| a: string |} |} | {||} => state.base ?? {};

export const getA = (state: State) => getBase(state).data?.a;

gives

Error ------------------------------------------------------------------------------------ frontend/src/flowbug.js:11:85                                                                                                                                                                                                                                                  Cannot return state.base ?? {...} because:                                                                                                                                            - Either inexact object literal [1] is incompatible with exact object type [2].                                                                                                      - Or inexact object literal [1] is incompatible with exact object type [3].                                                                                                                                                                                                                                                                                                          8\|     \|},                                                                                                                                                                           9\| \|};                                                                                                                                                                              10\|                                                                                                                                                                        [2][3][1] 11\| const getBase = (state: State): {\| data: {\| a: string \|} \|} \| {\|\|} => state.base ?? {};                                                                                          12\|                                                                                                                                                                                  13\| export const getA = (state: State) => getBase(state).data?.a;                                                                                                                    14\|
--

this 3rd example is: #2977

this issue is possibly the same underlying bug as in #6613 except that its pretty normal to use the null coalescing operator with optional chaining.

[fizker]

FYI flow.org/try can be configured for flowlint using flowlint comments:

https://flow.org/try/#0PQKgBAAgZgNg9gdzCYAoVxhlomBLAOwBcwBXAggUwGNKBnOgQwCcBPAWjgAci84DGMdtQAWjQgC5KzZnGboirLpTABlIoyIqAvGADeAH1RgTYAEaM6lAPwT9R047AATTYzuHjT7+7B0izIQA5gA0Xt4GAL5hjlFhUQDc6NT8-mBBlEQAQpY6YAAU-pqUdurFAJRg2gB8fhpaAHQWVmDW1vqRSaiUAB5cciQpBGkZRACCVQVFWqX1lJU16Zk5VoVz5Q2uGtYNjAlAA

[Hypnosphi]

related: #8491

[TrySound]

I think we got optional chaining and nullish coalescing to not do anymore hacks with fallback to empty object. You can return null instead and avoid unsealed object.
https://github.com/facebook/flow/issues?q=is%3Aopen+is%3Aissue+label%3A%22unsealed+objects%22

[Hypnosphi]

@TrySound, this:

const {a, b, c, d, e, f, g} = getSmth() ?? {}

return {a, b, c, d, e, f, g} 

still looks better to me than that:

const smth = getSmth()

return {
  a: smth?.a,
  b: smth?.b,
  c: smth?.c,
  d: smth?.d,
  e: smth?.e,
  f: smth?.f,
  g: smth?.g,
}

My main usecase for this is mapStateToProps function from react-redux, where it's preferrable to return primitives as props

[Hypnosphi]

@lukeapage looks like I found a workaround:

const getBase = (state: State): $Rest<Base, {}> => ({...state.base});

https://flow.org/try/#0PQKgBAAgZgNg9gdzCYAoVxhlomBLAOwBcwBXAggUwGNKBnOgQwCcBPAWjgAci84DGMdtQAWjQgC5KzZnGboirLpTAAhRnRUBeMAG8APqjDGwAE0ZFGEvYZN2wVsHSLNCAcwA0Rk-oC+XvwUlFQBlSyJtG29jACMNSgB+a3VNAN8AbnRqfmcwN0oiFMiACmcLSmsw8oBKawASACV6IgAeIo89XwA+MC0e4t0AOmGyiMG4zV9qzNRKAA8uORJsglz8ogBBXrBS8IqwKojq3p71ot2awfNLBMHGdKA

[TrySound]

Here's what you can do to achieve type safety.
https://flow.org/try/#0PQKgBAAgZgNg9gdzCYAoVxhlomBLAOwBcwBXAggUwGNKBnOgQwCcBPAWjgAci84DGMdtQAWjQgC5KzZnGboirLpTAAhRnRUBeMAG8APqjDGwAE0ZFGEvYZN2wVsHSLNCAcwA0Rk-oC+XvwBuBSUVAGVLIm0bb2MAIw1KAH5rdU0A32DUan5nMDdKIjTogApnC0prCIqASjAtAD4nSMoAOgTNMCSksBLdVoGCUhgYX1TEmqzKAA8uORIcgjyCogBBet7yqKqWusb8wuKy3dbzS1bGQKA

To make it work as expected empty object should be valid in returned type
https://flow.org/try/#0PQKgBAAgZgNg9gdzCYAoVxhlomBLAOwBcwBXAggUwGNKBnOgQwCcBPAWjgAci84DGMdtQAWjQgC5KzZnGboirLpTAAhRnRUBeMAG8APqjDGwAE0ZFGAfgl7DJh2Ea26RZoQDmAGiMn9AXx8AgG4FJRUAZUsibTtfYwAjDUobNWSg-1DUan5XMA9KInVNMB0AClcLSlsoqoBKUoA+MEqYgDokkqsrMDLdNoGCUhgYf1tiyjqsygAPLjkSHII8gqIAQVLe1uqwWpiGrWbViYroybbzSys2xmCgA

[gkz]

Fixed: https://medium.com/flow-type/improved-handling-of-the-empty-object-in-flow-ead91887e40c