🐛 [PreRelease] Extension "Biome" is configured as formatter but it cannot format 'TypeScript JSX'-files

[raix]

VS Code version

1.93.1

Extension version

2024.9.200949

Biome version

1.9.2

Operating system

• Windows
• macOS
• Linux

Description

Updated Biome from 1.8.3 and VS Code extension to pre-release for better support of workspaces. We currently use a workaround in PlatformPlatform

Steps to reproduce

• Clone PlatformPlatform
• Update settings for the new VS Code extension:

  "biome.enabled": true,
  "biome.lsp.trace.server": "verbose",
  "biome.lsp.bin": "application/node_modules/.bin/biome",
  "biome.projects": [
    {
      "folder": "application",
      "path": "application",
      "configFile": "biome.json"
    }
  ],
  "biome.requireConfigFile": true

• Update the Biome version in application/package.json
• Change the formatting / indention in one of the tsx files
• Right click and choose "format document"

See:

Expected behavior

The document should re format as the CLI tool would do e.g. npm run format

Does this issue occur when using the CLI directly?

No

Link to a minimal reproduction

https://github.com/platformplatform/PlatformPlatform

Logs

2024-09-30 21:23:40.701 [info] Biome extension 2024.9.200949 activated
2024-09-30 21:23:40.701 [info] Biome extension started
2024-09-30 21:23:40.701 [info] User-facing commands registered
2024-09-30 21:23:40.701 [info] Started listening for lockfile changes
2024-09-30 21:23:40.701 [info] Started listening for configuration changes
2024-09-30 21:23:40.701 [info] Started listening for active text editor changes

---

npx biome rage --daemon-logs
CLI:
  Version:                      1.9.2
  Color support:                true

Platform:
  CPU Architecture:             aarch64
  OS:                           macos

Environment:
  BIOME_LOG_PATH:               unset
  BIOME_LOG_PREFIX_NAME:        unset
  BIOME_CONFIG_PATH:            unset
  NO_COLOR:                     unset
  TERM:                         "xterm-256color"
  JS_RUNTIME_VERSION:           "v22.8.0"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         "npm/10.8.2"

Biome Configuration:
  Status:                       Loaded successfully
  Formatter disabled:           false
  Linter disabled:              false
  Organize imports disabled:    true
  VCS disabled:                 false

Workspace:
  Open Documents:               0

Discovering running Biome servers...

Incompatible Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ Rage discovered this running server using an incompatible version of Biome.

Server:
  Version:                      1.8.1

Server:
  Status:                       stopped

Incompatible Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ Rage discovered this running server using an incompatible version of Biome.

Server:
  Version:                      1.8.2

Incompatible Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ Rage discovered this running server using an incompatible version of Biome.

Server:
  Version:                      1.8.3

Incompatible Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ Rage discovered this running server using an incompatible version of Biome.

Server:
  Version:                      1.9.1

Incompatible Biome Server: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

ℹ Rage discovered this running server using an incompatible version of Biome.

Server:
  Version:                      1.9.0

[mkromann]

Having the same issue this morning

[ematipico]

Thank you, @raix, for the report. However, we would appreciate it if you could create a minimal reproduction instead of providing a massive repository. A minimal reproduction would remove possible user/environment options that could tarnish the project.

To create a reproduction, you can use our new CLI tool, which should help you to create a very quick repository with what you need: npm create @biomejs/biome-reproduction

[raix]

@ematipico I've created and pushed a Minimal reproduction using your CLI tool

[nhedger]

I believe I've found the issue. I'll patch it this morning and release a new pre-release. I'll also update this issue with an explanation.

[nhedger]

New release

I've released a new pre-release version, which I believe fixes this issue.

What happened

When the extension generates a document selector to filter which document should be taken into account by a given LSP session, it uses the path specified in the configuration and appends a glob pattern to it.

${project.path}**/*

When the path contains a trailing /, the glob pattern is valid, but if the path does not contain the trailing /, the glob pattern is invalid, which causes VS Code to say that Biome cannot format the file, as it is ignored.

biome-vscode/src/session.ts

Lines 350 to 354 in becbd5a

	return supportedLanguages.map((language) => ({
	language,
	scheme: "file",
	pattern: `${project.path.fsPath}**/*`,
	}));

Fix

I'm now joining all path elements using Uri, which should gracefully handle all sorts of quirks such as missing or duplicate trailing /.

biome-vscode/src/session.ts

Lines 350 to 357 in f9aa112

	return supportedLanguages.map((language) => ({
	language,
	scheme: "file",
	pattern: Uri.joinPath(project.path, "**", "*").fsPath.replace(
	"\\",
	"/",
	),
	}));

[nhedger]

@raix Feel free to close the issue once/if you've been able to confirm that it fixes the issue.

[raix]

@nhedger When testing the VS Code extension version v2024.10.20458 the issue is still there when testing the minimal reproduction repo

[nhedger]

Hum, could you try removing "folder": "application", from your settings. This is meant only for project that use multi-root workspaces. Not sure if this creates another issue.

[raix]

@nhedger if I remove the "folder" setting I get:

[nhedger]

I've been trying to reproduce this error and encountered it once or twice, but I cannot find a way to trigger it consistently. Are you able to?

[raix]

@nhedger yes, I never experienced it to work.

Does the extension register for being able to handle TypeScript files?

[nhedger]

Sorry, I meant: are you able to consistently reproduce the error seen in your screenshot?

If so, any information that leads to this error happening would help troubleshooting the issue. Using your reproduction repo and the same OS, I can't seem to reproduce. Wondering if other factors are at play here.

The inability of handling typescript files here is a direct consequence of the extension failing to start properly, but it does work under normal circumstances.

[raix]

Sorry, I meant: are you able to consistently reproduce the error seen in your screenshot?

Yes, I always get the dialog regarding configuring a formatter

If so, any information that leads to this error happening would help troubleshooting the issue. Using your reproduction repo and the same OS, I can't seem to reproduce. Wondering if other factors are at play here.

Not sure what I'm looking for tbh. I've tried reinstalling the extension, restarting VS Code, looking in devtools - all clues have been added to this issue.

Thinking of differences - I do not have biome installed globally, only in the project node_modules folder

The inability of handling typescript files here is a direct consequence of the extension failing to start properly, but it does work under normal circumstances.

The extension seems to be running

[raix]

Also get the issue when debugging the extension - I do wonder if active project should be undefined when the tsx file is open/selected etc.

[raix]

After debugging the extension I found this to be working:

Findings:

{
  "biome.enabled": true,
  "biome.projects": [
    {
      "path": "application",
-    "folder": "application",
-      "configFile": "biome.json"
+      "configFile": "application/biome.json"
    }
  ],
  "biome.requireConfigFile": true
}

Notes:

• It was unexpected that the configFile was not relative to path, but relative to the workspace.

[nhedger]

Oh, interesting. I would also have expected that config file to be resolved relative to the path. I'll look into this.

[codyspate]

In case it helps the debugging here's my experience with this issue so far.

I'm on Fedora, experiencing the same issue, but its not just for Typescript-JSX. It seems like its pretty much every file

Linux: Fedora 41
VSCode: 1.94.2
Biome Extension: v2.3.0 (also tried pre-release v2024.10.131712)
Biome version: 1.9.3

[codyspate]

^^^ It works after specifying "biome.lspBin": "node_modules/.bin/biome" in the workspace settings

[KKhanhH]

@nhedger I'm also getting the same issue with the extension for one of my workspace folders. It seems to occur regardless of whether the workspace is a multifolder workspace or the subfolder is opened directly. Looking at the LSP Trace, the logs show that the workspace directory has Windows trailing backslashes, and the extension is adding an additional forward slash before looking for the biome.json file.

2024-11-15 11:30:35.394 [info] [Trace - 11:30:35 AM] Received request 'client/registerCapability - (13)'.
2024-11-15 11:30:35.394 [info] Params: {
    "registrations": [
        {
            "id": "biome_did_change_extension_settings",
            "method": "workspace/didChangeConfiguration"
        },
        {
            "id": "biome_range_formatting",
            "method": "textDocument/rangeFormatting"
        },
        {
            "id": "biome_on_type_formatting",
            "method": "textDocument/onTypeFormatting",
            "registerOptions": {
                "documentSelector": null,
                "firstTriggerCharacter": "}",
                "moreTriggerCharacter": [
                    "]",
                    ")"
                ]
            }
        },
        {
            "id": "biome_formatting",
            "method": "textDocument/formatting"
        },
        {
            "id": "biome_did_change_workspace_settings",
            "method": "workspace/didChangeWatchedFiles",
            "registerOptions": {
                "watchers": [
                    {
                        "globPattern": "c:\\Users\\username\\Projects\\project_name\\/biome.json",
                        "kind": 7
                    },
                    {
                        "globPattern": "c:\\Users\\username\\Projects\\project_name\\/biome.jsonc",
                        "kind": 7
                    },
                    {
                        "globPattern": "c:\\Users\\username\\Projects\\project_name\\/.editorconfig",
                        "kind": 7
                    },
                    {
                        "globPattern": "c:\\Users\\username\\Projects\\project_name\\/rome.json",
                        "kind": 7
                    }
                ]
            }
        }
    ]
}

[KKhanhH]

Sorry, ignore what I said previously, I created a minimal repro and the issue isn't caused by a trailing slash it looks like. There seems to be an issue with pnpm workspaces, the extension doesn't detect files inside the packages folder, but it seems to be able to detect files inside .vscode folder and everything else fine.

Here is the repro:
https://github.com/KKhanhH/biome_repro