Error converting Array<?T> to Array<T> blames to line before issue occurs

[dschafer]

I ran into a tricky error earlier today, reduced it to this repro case:

/* @flow */
async function genArray(): Promise<Array<number>> {
  return [1,2,3,4];
}

async function genString(a: number): Promise<?string> {
  return (a % 2) ? 'a' : null;
}

async function useArray(): Promise<Array<string>> {
  var array = await genArray();
  var nullableStrings = await Promise.all(array.map((a) => genString(a)));
  return nullableStrings.filter((s) => s != null);
}

The flow error is:

test.js:12
 12:   var nullableStrings = await Promise.all(array.map((a) => genString(a)));
                                   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ call of method `all`
 12:   var nullableStrings = await Promise.all(array.map((a) => genString(a)));
                                   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Promise. This type is incompatible with
446: declare function $await<T>(p: Promise<T> | T): T;
                                   ^^^^^^^^^^^^^^ union: type application of identifier `Promise` | type parameter `T` of await. See: /private/tmp/flow/flowlib_12ad72f7/core.js:446


Found 1 error

Which was tricky to debug, I couldn't quite figure out what I was doing wrong. Changing:

-async function useArray(): Promise<Array<string>> {
+async function useArray(): Promise<Array<?string>> {

or

-  return nullableStrings.filter((s) => s != null);
+  var strings = [];
+  nullableStrings.forEach((s) => {
+    if (s != null) {
+      strings.push(s);
+    }
+  });
+  return strings;

leads to:

No errors!

Which makes me think the problem was not with line 12 in the original source, but line 13, where I attempted (incorrectly, as per #1026) to convert the Array<?string> to an Array<string> with .filter((s) => s != null).

I'm running:

$ flow version
Flow, a static type checker for JavaScript, version 0.20.1

[ctrlplusb]

Related to #1414

[calebmer]

We have a special case for .filter(Boolean). You can use that until we have better support for refinements in filter 😊

async function genArray(): Promise<Array<number>> {
  return [1,2,3,4];
}

async function genString(a: number): Promise<?string> {
  return (a % 2) ? 'a' : null;
}

async function useArray(): Promise<Array<string>> {
  var array = await genArray();
  var nullableStrings = await Promise.all(array.map((a) => genString(a)));
  return nullableStrings.filter(Boolean);
}

https://flow.org/try/#0IYZwngdgxgBAZgV2gFwJYHsIwOYFMICCATkcGABQCUAXDAApHoC2qIuAPMaWOxAkwCNcRAHwiYAbwBQMGEVzIERLAG0AjABoATBoDMGgCwBdANxSAvlKmhIsRCgxY8EAMrIiqCNnLBafQcI09IwsbOwA-CDuntji0rLyisowPjAApDBalDDhMADkwHkwfggANqVmltbg0PBIUGiYMAhsXGRUtAzMrBxtPFEeXmKSMjAAbsBEMJPcMAC80wDuwKjIOPh9VGayE1N85cACpbhug9gg80sra12huAB0wOU+JGT3TMAADuQ+2XPizlOMV+lEo2zkCiUWH2pUOxyBXhA9zgqFKyGE5AAQuh0MdgBAwRYpEA