Bad automated fix for no-duplicates when using Flow.

[julienw]

This could be related to #2475, but I'm not sure.
I got this error after upgrading, but not exactly the same one. I'm using Flow too.

I had some code like this:

import {
  withChartViewport,
  type WithChartViewport,
} from 'firefox-profiler/components/shared/chart/Viewport';
...
import type { Viewport } from 'firefox-profiler/components/shared/chart/Viewport';

After the change, the last import type was reported as an error and merged into the first one. This makes some sense, but this was merged incorrectly:

import {
  withChartViewport,
  type WithChartViewport,
  Viewport,
} from 'firefox-profiler/components/shared/chart/Viewport';

Notice that the word type is missing. Without it, Flow is erroring.
I could add it manually, the eslint wouldn't error then.

I simply have the rule configured like this:

    'import/no-duplicates': 'error',

So in short, in this case I think the error was right but the autofix wasn't.

Could be related to #2686 but I'm not sure because the error seems different.

[julienw]

This looks related to this discussion: https://github.com/import-js/eslint-plugin-import/pull/2475/files#r1019468217

[ljharb]

Clearly a bug, yes, thank you. cc @snewcomer

[ljharb]

Looks like it fails specifically when prefer-inline is not set (which doesn't work for flow anyways).

[ljharb]

Here's the git diff for the failing test case:

       errors: ['\'./foo\' imported multiple times.', '\'./foo\' imported multiple times.'],
     }),
 
+    test({
+      code: `
+        import {
+          withChartViewport,
+          type WithChartViewport,
+        } from 'firefox-profiler/components/shared/chart/Viewport';
+
+        import type { Viewport } from 'firefox-profiler/components/shared/chart/Viewport';
+      `,
+      output: `
+        import {
+          withChartViewport,
+          type WithChartViewport,
+          type Viewport,
+        } from 'firefox-profiler/components/shared/chart/Viewport';
+      `,
+      errors: [
+        '\'firefox-profiler/components/shared/chart/Viewport\' imported multiple times.',
+        '\'firefox-profiler/components/shared/chart/Viewport\' imported multiple times.',
+      ],
+      parser: parsers.BABEL_OLD,
+    }),
+
     test({

[snewcomer]

@julienw Am I seeing that Flow supports inline types in your example? Is there another canonical name it goes by? I can't seem to find it.

[bradzacher]

Flow supports inline specifier types

import {
  Foo,
  type Bar,
  typeof Baz,
} from 'module';

Note that unlike in TS where it's legal to import a type without the type qualifier (except under specific compiler flags), it is never legal to import types without a type qualifier in flow.

Fun fact: flow has had this syntax for many, many years! Whereas TS is a checker and a transpiler, flow is just a checker and transpilation was handled by babel - hence the syntax was created to make it easy for babel to elide the imports (which is why TS later adopted it).

[snewcomer]

Wow. Great to know! Thank you.

So I have a solution to fix issues in ‘no-duplicates’. But before finishing off and submitting, I wanted to get consensus / this is bad / or just general thoughts on this.

#2697 (comment)

[julienw]

FWIW It's supported by Flow but I couldn't find the documentation about it so it would be difficult to know for a non-Flow user :)

I'm not opinionated about the solution as long as it produces valid code.