🐛 "Source Action" popup box opens when triggering Organize Imports for this particular import statement

[ericchase]

VS Code version

1.93.1

Extension version

2.3.0

Biome version

1.9.1

Operating system

• Windows
• macOS
• Linux

Description

Whenever I trigger the "Organize Imports" action in VSCode, either via keyboard shortcut or command palette, I'm now seeing a popup box titled "Source Action" with 2 choices: "Organize Imports (Biome)" and "Organize Imports".

I've looked everywhere for a way to select either one of these actions as a default so that I don't have to see this popup anymore (google search, github issues search both here and in the Biome repo, even chats with multiple AIs). I don't care which one is chosen at this point, I just want to move on without disabling either Biome or any built-in extensions.

Attached screenshot shows the popup box. For the sake of removing any suspicions that this is caused by my setup, I've reproduced the issue in Windows Sandbox with a completely new installation of VSCode, Node/NPM, and Biome/Biome extension. As a bonus, I've shown that this problem also occurs in my setup of VSCodium as well.

I've tried reproducing this issue with a trivial js/ts file that imports A and B from another trivial js/ts file that exports empty A and B functions. For trivial cases, the popup box does not appear, and the imports are organized as expected (as far as i can tell). Therefore, I suspect that complicated import statements are triggering this behavior (which I've never seen before in my life).

Any insight into why this suddenly started happening would be highly appreciated!

Steps to reproduce

1. Install VSCode or VSCodium
2. Install the Biome extension
3. Let Biome extension install Biome globally(? or something)
4. Open a folder in VSCode
5. Add a JS/TS file to the folder
6. Come up with some complicated import statement (or use my current file)

The behavior happens whether or not the imported files exist. You only need this 1 file:

import { addBall, GameLoop, karel_y, karel_x, move, start } from './src/lib/commands.js';
import { NodeRef } from './src/lib/ericchase/Web API/Node_Utility.js';

const karel = document.querySelector('#karel') as HTMLElement;
const scene = document.querySelector('#scene') as HTMLElement;

function drawKarel() {
  karel.style.left = `${4 + 4 + karel_x * 69}px`; // border + missing width/2
  karel.style.top = `${4 + 4 + karel_y * 69}px`; // border + missing height/2
}

const domParser = new DOMParser();
const parseHTML = (html: string) => {
  return domParser.parseFromString(html, 'text/html');
};

function createBall(x: number, y: number) {
  const ball = addBall(NodeRef(parseHTML(`<div class="ball"><img src="./assets/ball.png" alt="ball" /></div>`).body.children[0]), x, y);
  karel.before(ball.as(HTMLElement));
  ball.style.left = `${4 + 5 + x * 69}px`; // border + missing width/2
  ball.style.top = `${4 + 5 + y * 69}px`; // border + missing height/2
}

GameLoop.subscribe(() => {
  drawKarel();
});

createBall(1, 9);
createBall(4, 9);
createBall(5, 9);
createBall(8, 9);
createBall(9, 9);

start(0, 9);
move();
move();
move();
move();
move();
move();
move();
move();
move();

Expected behavior

Not sure to be honest. I've never seen the Source Action popup box before, and I couldn't find any information on how to deal with source actions.

Does this issue occur when using the CLI directly?

Not sure / Not applicable

Link to a minimal reproduction

https://github.com/ericchase/biome-extension-issue-asf7sa96876

Logs

C:\Users\WDAGUtilityAccount\Downloads\Biome>biome rage --daemon-logs 
CLI:
  Version:                      1.9.1
  Color support:                true

Platform:
  CPU Architecture:             x86_64
  OS:                           windows

Environment:
  BIOME_LOG_PATH:               unset
  BIOME_LOG_PREFIX_NAME:        unset
  BIOME_CONFIG_PATH:            unset
  NO_COLOR:                     unset
  TERM:                         unset
  JS_RUNTIME_VERSION:           "v22.8.0"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         unset

Biome Configuration:
  Status:                       unset

Workspace:
  Open Documents:               0

Discovering running Biome servers...

--------------------------------------------------------------------

[Trace - 10:31:42 PM] Sending request 'textDocument/codeAction - (31)'.
Params: {
    "textDocument": {
        "uri": "file:///c%3A/Users/WDAGUtilityAccount/Downloads/Biome/main.js"
    },
    "range": {
        "start": {
            "line": 8,
            "character": 0
        },
        "end": {
            "line": 8,
            "character": 0
        }
    },
    "context": {
        "diagnostics": [],
        "only": [
            "source.organizeImports"
        ],
        "triggerKind": 1
    }
}


[Trace - 10:31:42 PM] Received response 'textDocument/codeAction - (31)' in 3ms.
Result: [
    {
        "title": "Organize Imports (Biome)",
        "kind": "source.organizeImports.biome",
        "edit": {
            "changes": {
                "file:///c%3A/Users/WDAGUtilityAccount/Downloads/Biome/main.js": [
                    {
                        "range": {
                            "start": {
                                "line": 1,
                                "character": 1
                            },
                            "end": {
                                "line": 1,
                                "character": 8
                            }
                        },
                        "newText": "GameLoop"
                    },
                    {
                        "range": {
                            "start": {
                                "line": 2,
                                "character": 1
                            },
                            "end": {
                                "line": 2,
                                "character": 9
                            }
                        },
                        "newText": "addBall"
                    },
                    {
                        "range": {
                            "start": {
                                "line": 3,
                                "character": 1
                            },
                            "end": {
                                "line": 3,
                                "character": 8
                            }
                        },
                        "newText": "karel_x"
                    },
                    {
                        "range": {
                            "start": {
                                "line": 4,
                                "character": 1
                            },
                            "end": {
                                "line": 4,
                                "character": 8
                            }
                        },
                        "newText": "karel_y"
                    }
                ]
            }
        },
        "isPreferred": true
    }
]

[ericchase]

Extra Notes:

Switching between different versions of the extension (pre-releases and past stables) did not change this behavior, so I must assume that this specific import statement is the cause. I'm surprised that I've never seen the popup before, as I've seen and written some wildly complex import statements.

In any case, whether this is a bug or not, I want to be able to choose an action by default. I'm willing to fork the extension and simply remove the feature altogether if I have to.

Update:

Setting organizeImports.enabled to false in biome.json and restarting seems to disable this feature for the extension. There is extremely little information written around this configuration setting. Since I can disable the feature this way, this will suffice. Though, it would be really nice if I could make VSCode prefer Biome's import sorting over the Typescript built-in. I'll go look around the Typescript repo to see if there's a way to disable their import sorting feature instead.

(the setting must be set to false in the biome.json file that is used, as the default value seems to be true)

[ematipico]

The source code action is something that you configure via .vscode/settings.json, as explained on our website. Can you share yours?

Also, you need to take in consideration that VSCode allows you to create user settings and project settings, which means if your reproduction is still affected by the issue, probably your user settings - applied to all projects - are misconfigured.

[ericchase]

Can you share yours?

there are no user settings or workspace settings. for all intents and purposes, the reproduction in the screenshot is on a freshly created operating system.

Also, you need to take in consideration that VSCode allows you to create user settings and project settings, which means if your reproduction is still affected by the issue, probably your user settings - applied to all projects - are misconfigured.

just to confirm, here are the settings files:

settings.json

.vscode/settings.json

and here is the problem still happening:

if what you're saying is that this issue was designed to occur by default, then I think your design decision was a bad one

as far as the website says about import sorting, i see the editor.codeActionsOnSave setting being mentioned, which is not relevant to this issue. the issue also occurs whether or not biome is set as the formatter.

i'd gladly try out any settings files shared here and report back on whether they solve the issue or not (i doubt any will).

[ematipico]

if what you're saying is that this issue was designed to occur by default, then I think your design decision was a bad one

I think you misunderstood my message. You opt-in the import sorting, in your IDE, via settings. Let me check if I am able to reproduce the issue

the issue also occurs whether or not biome is set as the formatter.

FYI Import sorting isn't part of the formatter

[nhedger]

if what you're saying is that this issue was designed to occur by default, then I think your design decision was a bad one

1. No one said that.
2. As far as I know, we're seeing this for the first time, too.
3. We haven't identified the cause of the issue yet, so let's ease up on assigning blame.

With that out of the way, I can't seem to reproduce the issue.

I'm assuming this happens because multiple extensions have been registered as import organizers for the language, and VS Code tries to deconflict them with this popup. As said previously, this has never popped up for me, so we'll have to dig a bit more to see what's happening.

In the meantime, a couple of things:

• The provided reproduction contains a main.js file, but the contents appears to be TypeScript (you're using as). Not sure if this has an impact?

• We have no way of reproducing your environment because your reproduction contains only one file. The package.json is missing, the biome configuration is missing, and your VS Code settings are not included.

Please try crafting a minimal reproduction repository that contains all relevant config and files. You can use npm create @biomejs/biome-reproduction to scaffold a skeleton.

[ematipico]

I am able to reproduce the issue, but in another project, where I have my user settings. Let's wait for a reproduction.

[ericchase]

FYI Import sorting isn't part of the formatter

yes, i've seen you say this multiple times. and yet you tell me to do what your site says, which specifically only talks about the formatter

I think you misunderstood my message. You opt-in the import sorting, in your IDE, via settings. Let me check if I am able to reproduce the issue

i understand this is what you think, but this is not what actually happens. as i've shown with concrete proof that if you have no settings whatsoever, it still happens

The provided reproduction contains a main.js file, but the contents appears to be TypeScript (you're using as). Not sure if this has an impact?

as i said, it happens in both languages. you can change the file extension to .ts and it will happen. you can remove the typescript specific code, and it will happen. i imagine we could craft a completely new file, but i've never seen this behavior before either

We have no way of reproducing your environment because your reproduction contains only one file. The package.json is missing, the biome configuration is missing, and your VS Code settings are not included.

i can't stress this enough. the single file is my environment. quite literally:

1. install a new copy of Windows
2. install VSCode and Node and Biome extension
3. open a folder with this 1 single file
4. profit

there is nothing else i have done or added, so that repository with the 1 file is my working environment

Please try crafting a minimal reproduction repository that contains all relevant config and files. You can use npm create @biomejs/biome-reproduction to scaffold a skeleton.

i'll try this now

[ericchase]

forgot to include image

[ericchase]

and here is the biome reproduction screenshot

[ericchase]

and here is the repository https://github.com/ericchase/biome-repro-1726588728166

i was even able to minimize the file contents to nearly nothing.

just to reiterate, you don't need any configurations at all to trigger this issue.

my next steps will be to test this on another operating system, as it might be specific to windows

[nhedger]

Thanks, I appreciate it. I was able to reproduce the behavior on macOS with your repo and instructions.

[ematipico]

yes, i've seen you say this multiple times. and yet you tell me to do what your site says, which specifically only talks about the formatter

Code actions can change code like a formatter, but they are part of a different LSP request. You can check from the logs that is called textDocument/codeAction.

Now, with the matter at hand, I wonder if the issue is actually VSCode itself... Or maybe that's how VSCode works?

Thanks for the detailed information, I'll have a look in the coming days, and try to understand if it's a spec thing or not.

[ericchase]

after having looked through the extension source code and changing some things, i'd like to believe that the cause is within the actual Biome toolchain source code. with all the testing i've done, i agree with ematipico that this seems to be vscode's way of dealing with multiple ... sources(?) for the actions/commands, and it wouldn't be surprising at all

unfortunately, i don't think i have the ability to effectively navigate Biome's source code from scratch, and i barely have enough knowledge/understanding of these source actions to hope to look around vscode's source. if either of you could give me some keywords/concepts to look up and the general location in Biome's source where these actions are coded, then I will go bug hunting to figure out what exactly is the cause and how it can be worked around

[ericchase]

oh, actually, all i changed in the extension code were the config files being used, so the cause might actually be somewhere in the extension code that connects these features to vscode. i didn't know what to look for at that time

edit: i forgot for a moment that the main problem is that i could not find a way to tell vscode to use one extension as the default source for these code actions. ultimately, this is probably a missing feature in vscode. i will disable this setting in biome.json for now, as import sorting is one of my least concerns. typescript's sorting is fine

[ematipico]

I did some investigation, and I believe this is a VSCode bug.

I tried a different LSP client with different combinations:

• organizeImports.enabled: false -> The code action Organize imports didn't show up (as expected).
• organizeImports.enabled: true + source.organizeImports.biome: false -> The code action Organize imports didn't show up (as expected).

I would file an issue against the VSCode repository.

[ematipico]

Never mind, I failed to understand how the "Code Action" menu works.