📝 Mixed Tab/Space on ternary

[eMerzh]

Environment information

CLI:
  Version:                      1.5.3
  Color support:                true

Platform:
  CPU Architecture:             aarch64
  OS:                           macos

Environment:
  BIOME_LOG_DIR:                unset
  NO_COLOR:                     unset
  TERM:                         "xterm-256color"
  JS_RUNTIME_VERSION:           "v21.5.0"
  JS_RUNTIME_NAME:              "node"
  NODE_PACKAGE_MANAGER:         "npm/10.2.4"

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

Workspace:
  Open Documents:               0

Configuration

{
	"$schema": "https://biomejs.dev/schemas/1.5.3/schema.json",
	"formatter": {
		"indentStyle": "tab",
		"lineWidth": 120,
		"ignore": ["**/__generated__/*.graphql.ts"]
	},
	"javascript": {
		"formatter": {
			"semicolons": "asNeeded",
			"arrowParentheses": "asNeeded",
			"quoteStyle": "single",
			"jsxQuoteStyle": "double"
		}
	}
}

Playground link

https://biomejs.dev/playground/?lineWidth=120&quoteStyle=single&semicolons=as-needed&arrowParentheses=as-needed&unsafeParameterDecoratorsEnabled=false&code=ZQB4AHAAbwByAHQAIABjAG8AbgBzAHQAIABTAHQAbwByAHkATgBhAHQAaQB2AGUAQwByAGUAYQB0AGUAIAA9ACAAewAKAAkAbgBhAG0AZQA6ACAAJwBTAHQAbwByAHkATgBhAHQAaQB2AGUAQwByAGUAYQB0AGUAJwAsAAoACQBwAGEAdABoADoAIAAnAG0AbwBiAGkAbABlAC8AZQBkAGkAdABvAHIAJwAsAAoACQBwAHIAZQBwAGEAcgBlAFYAYQByAGkAYQBiAGwAZQBzADoAIAAoAF8AOgAgAHMAdAByAGkAbgBnACwAIAB7ACAAbABvAGMAYQB0AGkAbwBuACAAfQA6ACAAewAgAGwAbwBjAGEAdABpAG8AbgA6ACAAewAgAHEAdQBlAHIAeQA%2FADoAIAB7ACAAcwBjAGgAZQBtAGEASQBkAD8AOgAgAHMAdAByAGkAbgBnACAAfQAgAH0AIAB9ACkAIAA9AD4ACgAJAAkAbABvAGMAYQB0AGkAbwBuAC4AcQB1AGUAcgB5AD8ALgBzAGMAaABlAG0AYQBJAGQACgAJAAkACQA%2FACAAewAKAAkACQAJAAkACQBzAGMAaABlAG0AYQBJAGQAOgAgAGwAbwBjAGEAdABpAG8AbgAuAHEAdQBlAHIAeQAuAHMAYwBoAGUAbQBhAEkAZAAsAAoACQAJAAkACQB9AAoACQAJAAkAOgAgAHsAfQAsAAoACQBnAGUAdABDAG8AbQBwAG8AbgBlAG4AdAA6ACAAKAApACAAPQA%2BACAAaQBtAHAAbwByAHQAKAAvACoAIAB3AGUAYgBwAGEAYwBrAEMAaAB1AG4AawBOAGEAbQBlADoAIAAiAG4AYQB0AGkAdgBlACIAIAAqAC8AIAAnAC4ALwBTAHQAbwByAHkATgBhAHQAaQB2AGUAQwByAGUAYQB0AGUAJwApAC4AdABoAGUAbgAoAG0AbwBkACAAPQA%2BACAAbQBvAGQALgBkAGUAZgBhAHUAbAB0ACkALAAKAH0A

Code of Conduct

• I agree to follow Biome's Code of Conduct

[eMerzh]

hum, sorry for the noise, it' doesn't seems to showup in the playground but

export const StoryNativeCreate = {
	name: 'StoryNativeCreate',
	path: 'mobile/editor',
	prepareVariables: (_: any, { location }: { location: { query?: { schemaId?: string } } }) =>
		location.query?.schemaId
			? {
					schemaId: location.query.schemaId,
				}
			: {},
	getComponent: () => import(/* webpackChunkName: "native" */ './StoryNativeCreate').then(mod => mod.default),
}

seems to be reformated with a double space before the closing }

[ematipico]

This isn't a bug, but it's the expected behaviour.

Ternaries are indented with spaces, regardless.

Prettier works in the same way https://prettier.io/playground/#N4Igxg9gdgLgprEAuEcAeAHCAnGACSKAZ3wGUYcBPAOQEMYBLANzgGFs5648BePYADpQBMKLQC2cJHgDk5KnUYt2neDIA0QkRnoALaTPEQARgwA2cAPRwAJgwrYNWmBg46OANVrYGtYxaJpAAoAfWlaKEp1fjwzCDB6Bmg8AF9pYFj4xOh0vABHAFc4bEoAflyiMF04cVoASRtyvBIfKABzVM6UgEpeAD5nETiExmgAOkLisrHK6tqGwZgRUv5FkXWYWZr6m2lh7KgJopKZqu2GzWEl65EUtZh0lMuRNrgYVghxLCgEB7wg3o8Pp4BhfHAwIKWABUeAA7nBjDowABrVi6ApQZF0STSAQgMRKOB4vBQyyyMaWeQlRTMNgcLgybpjGDVKBBIw2fp4DljGxwABmtAKZhg3UuKRA6hAEAwo2IyFA3mwEFhAAVvAgiMgQLQzLDaJQtVLjNhaCi3qQJHAADIMH7IQVmIhwY2m80wUhIu1tZAwbBFKXO8QMX3+l2oTDFUG-XUAFWKYh8cC1SEdzsD3osAEUChB4A7demQAArIhoUiZuA5vNwAtO8OFGuq5UYFM6ogAWh+tlskpAfto5m9H3EtW1urMfaIlYAgjA-QxjAV4Krirb7anC+HdDBxGYAOq6ezJpFwUia+zMeyUbVgIhGkBMIp1KB82CkMA+WUz1-kSgWOsi1cCBnX3U0MG1Vxk2KFg+ztZ1cGbWg2jHTd6yldwEO1Yw-DgMwO02PtXDtGB9wYGwWWQAAOAAGKUOEKBgOCQlDaEA8MYD8MiKN0ZAADYpQKZ1Yz8FM03DGpjFsPkbGtCI2gKZC4AAMRwWp529cdlwgEAUhSIA

[eMerzh]

@ematipico thanks for the quick review :)
but if i'm correct, the link you provided did'nt use tabs 🤔

here https://prettier.io/playground/#N4Igxg9gdgLgprEAuEcAeAHCAnGACSKAZ3wGUYcBPAOQEMYBLANzgGFs5648BePYADpQBMKLQC2cJHgDk5KnUYt2neDIA0QkRnoALaTPEQARgwA2cAPRwAJgwrYNWmBg46OANVrYGtYxaJpAAoAfWlaKEp1fjwzCDB6Bmg8AF9pYFj4xOh0vABHAFc4bEoAflyiMF04cVoASRtyvBIfKABzVM6UgEpeAD5nETiExmgAOkLisrHK6tqGwZgRUv5FkXWYWZr6m2lh7KgJopKZqu2GzWEl65EUtZh0lMuRNrgYVghxLCgEB7wg3o8Pp4BhfHAwIKWABUeAA7nBjDowABrVi6ApQZF0STSAQgMRKOB4vBQyyyMaWeQlRTMNgcLgybpjGDVKBBIw2fp4DljGxwABmtAKZhg3UuKRA6hAEAwo2IyFA3mwEFhAAVvAgiMgQLQzLDaJQtVLjNhaCi3qQJHAADIMH7IQVmIhwY2m80wUhIu1tZAwbBFKXO8QMX3+l2oTDFUG-XUAFWKYh8cC1SEdzsD3osAEUChB4A7demQAArIhoUiZuA5vNwAtO8OFGuq5UYFM6ogAWh+tlskpAfto5m9H3EtW1urMfaIlYAgjA-QxjAV4Krirb7anC+HdDBxGYAOq6ezJpFwUia+zMeyUbVgIhGkBMIp1KB82CkMA+WUz1-kSgWOsi1cCBnX3U0MG1Vxk2KFg+ztZ1cGbWg2jHTd6yldwEO1Yw-DgMwO02PtXDtGB9wYGwWWQAAOAAGKUOEKBgOCQlDaEA8MYD8MiKN0ZAADYpQKZ1Yz8FM-QDVBxGMWw+Rsa0IjaApkLgAAxHBannb1x2XCAQBSFIgA

you can see that ternary use tabs without spaces 🤔
or i miss something?

[ematipico]

Ternaries are weird in prettier.

The initial indentation is done using the indentation style configured in the options. That indentation is done until the ternary operator starts. Then the formatter adds two spaces for each level of nested condition .

Try to add multiple nested conditions and you'll see the difference.

Our formatter matches prettier's, so it's consistent.

[eMerzh]

ok, i believe you ... but if i run prettier & biome on the same code the result is different ...

[ematipico]

Thank you, that wasn't very clear to me.

Can you please provide two playground links, one from biome and one from prettier?

We will take a look

[eMerzh]

here is the prettier link
https://prettier.io/playground/#N4Igxg9gdgLgprEAuEcAeAHCAnGACSKAZ3wGUYcBPAOQEMYBLANzgGFs5648BePYADpQBMKLQC2cJHgDk5KnUYt2neDIA0QkRnoALaTPEQARgwA2cAPRwAJgwrYNWmBg46OANVrYGtYxaJpAAoAfWkSHygAc3V+PDMIMHoGaDwAX2lgeMTk6Ey8AEcAVzhsSgB+fKIwXThxWgBJG0q8CIZo9M60gEpeAD5nEQSkxmgAOmLSirHq2vqmwZgRcv5FkXWYWbrGm2lh3KgJkrKZmu2mzWEl65E0tZhMtMuRKLgYVghxLCgEB7wg3o8Pp4BhfHAwIKWABUeAA7nBjDowABrVi6IpQZF0STSAQgMRKOB4vBQyyyMaWeRlRTMNgcLgybpjGC1KBBIw2fp4DljGxwABmtCKZhg3UuaRA6hAEAwo2IyFA3mwEFhAAVvAgiMgQLQzLDaJQtVLjNhaCi3qQJHAADLtODIQVmIhwY2m80wUhI9pRZAwbAlKXO8QMX3+l2oTClUG-XUAFVKYh8cC1SEdzsD3osAEUihB4KGAyAAFZENCkTNwHN5+2p3XpkDFauq5UYFM6ogAWh+tlskpAfto5m9H3E9W1urMfaIFYAgjA-QxjEV4KrSrafg66+HdDBxGYAOq6ezJpFwUia+zMeyUbVgIhGkBMEoNKB82CkMA+WUz1-kSgWTcnXDVwIGdfdTQwbVXGTUoWD7dpnVwZtaCiMdayAqV3EQ7UYEoDBk0-BhZT7Vx2hgfcGBsFlkAARgAJgABilDhigYDhkNQ2hAPrGA-AoqjdGQOipSKZ1Yz8FM-ULOpjFsPkbGtWhoiKFC4AAMRwep529cdlwgEA0jSIA

but strangely the biome playground above thinks prettier insert spaces indeed, but it does not ...
maybe that changed at some point?

[ematipico]

It seems that prettier is actually buggy. The indentation of } isn't respected.

[eMerzh]

i think it's due to the tabwith ..
like if you display the tab chars it makes more sense (ofc it doesn't look good in the playground with incorrect tabwith

[ematipico]

You may be using a different version of prettier. Our playground uses an outdated version of Prettier, but Prettier's Playground uses its latest version.

Still, I don't think it's a bug unless we wait for prettier to fix their issue.

[eMerzh]

sorry, i really don't want to be pushy, but i think i'm and prettier's playground are on the same version , the latest (3.2.4)

the issue is that the playground displays the tabs as bigger
if you (ultra crappy) change the tab size to 2 artificially, and make them visible (using '.' for example)

like (😬 )
$$('.cm-tab').forEach(e=> {console.log(e.innerHTML ='..')})
you end up with the something similar to 👆

and wich , IMHO, seems fine like this (doesn't mix tab and space for prefix indentation)

[eMerzh]

this awesome! i'll thanks for your work :)

i'll let you know when this is testable :)