importModuleSpecifierEnding does not apply for module specifier completions (manual imports)

[wsmd]

• VSCode Version: 1.44.2
• OS Version: macOS 10.14.6

A while back, the importModuleSpecifierEnding preference was added to specify the preferred path ending for auto imports (see microsoft/vscode#90405).

{
  "javascript.preferences.importModuleSpecifierEnding": "js",
}

While this seems to work with auto imports (i.e. referencing an export of another file and letting the editor perform module importing automatically), it does not work with path completions when typing the import statement manually.

import { someFunction } from '../|';
                                 ^ when picking a file from path suggestions here,
                                   the file extension seems to always be omitted

Actual Behavior:

import { someFunction } from '../someModule';

Expected Behavior:

import { someFunction } from '../someModule.js';

Steps to Reproduce:

1. Set javascript.preferences.importModuleSpecifierEnding to "js"
2. Start typing an import statement of a relative js module
3. When specifying the import source, choose a relative file path from the completions list
4. The ".js" extension appears to be omitted

Expected Behavior:

The file chosen from the suggestions list should have the ".js" extension.

---

Does this issue occur when all extensions are disabled?: Yes

[andrewbranch]

This should be transferred to the TypeScript repo when someone gets to it.

[andrewbranch]

See #42157 for a description of how to fix this

[Simar-B]

@andrewbranch Hi there, you said that in #42157 that

This seems reasonable to me, looks like we’d want to pass the preferences in stringCompletions.ts all the way down into getCompletionEntriesForRelativeModules and use that preference in the getExtensionOptions() call.

I'm wondering if you could elaborate more on what I'm supposed to do with preference in the getExtenionOptions() call.

Sorry if this is a dumb question, it's my first time doing open source.

[andrewbranch]

getExtensionOptions() doesn’t need to change at all—it already accepts a second parameter includeExtensions, but we aren’t currently passing that parameter to it in getCompletionEntriesForRelativeModules. I believe all we have to do is thread preferences through from getStringLiteralCompletions and then use it like

- const extensions = getExtensionOptions(compilerOptions);
+ const extensions = getExtensionOptions(compilerOptions, preferences.importModuleSpecifierEnding === "js");