autocomplete workaround for string literal inside template literal stopped working since v5.3.3

[GrtDev]

🔎 Search Terms

string literal autocomplete template

🕗 Version & Regression Information

• This changed between versions 5.3.2 and 5.3.3

⏯ Playground Link

https://www.typescriptlang.org/play?ts=5.3.3#code/C4TwDgpgBAYg9nKBeKByA9AMwaqAfNLBdALgEsATXAgAyLnQBIBvAZ2ACcyA7AcygBkUZgF8RNAFASAxnG7soAIwCGHEvEQpUqIA

💻 Code

type Foo = '/foo' | '/foo/:id' | `/foo/${string & {}}`

const bar:Foo = ''

🙁 Actual behavior

bar only gives /foo as a suggestion.

🙂 Expected behavior

bar gives /foo and /foo/:id as a suggestion.

Additional information about the issue

I understand that the autocomplete is a longer ongoing issue in combination with string literals. However there was a workaround described in (among other places): #29729

This workaround (string & {}) still works as long as it is not inside a template literal. But stopped working inside a template literal since v5.3.3.

[Andarist]

This one works today:

type Foo = '/foo' | '/foo/:id' | (`/foo/${string}` & {})

const bar: Foo = ''

It likely has changed in #56434

[jakebailey]

Yes, that was the intended change for people to make:

Of course, that doesn't work before TS 5.3. See also #54188 (#56434 was in 5.4 which "finalized" the behavior).

[RyanCavanaugh]

Would accept a (very) non-invasive/non-impactful PR to allow both workarounds to work

[jakebailey]

My understanding from the design meeting discussions surrounding #56434 (#56450 ?) is that doing that was a problem as it involved traversing deeply into the elements (which I originally added but Anders removed?)

[RyanCavanaugh]

What's the right tag for "PRs accepted but you'll likely have to be more clever than the entire TS team to figure it out"...

[jakebailey]

cursed

[fatcerberus]

The Cursed? tag doesn't get used often so it's always a hoot when I see it. I love that it exists.

[TkDodo]

type Foo = '/foo' | '/foo/:id' | (/foo/${string} & {})

const bar: Foo = ''

I can’t get this to work in any version of TS. Here’s the code in v5.7:

https://www.typescriptlang.org/play/?ts=5.7.3#code/C4TwDgpgBAYg9nKBeKByA9AMwaqAfNLBdALgEsATXAgCgAMi50ASAbwGdgAnMgOwHMAvnSgAyKK0EBKAFAyAxnF6coAIwCGXErATI0qIA

Not only does it not appear in the list for auto complete - empty string is also not assignable to type Foo.

[Andarist]

It's not clear to me what your expected result is. Have you expected /foo/ to be suggested?

[TkDodo]

It's not clear to me what your expected result is

Sorry about that. I also just saw my expectation is a bit different from OPs, too.

In my case, I have a list of strings (known api urls) that I would like to see in auto complete:

type Foo = '/foo/' | `/bar/${string}/` | `/baz/${string}/` | string & {}

playground

Currently, only /foo/ shows up. Ideally, I would also get to see /bar and /baz somehow in the auto complete list

[Andarist]

You are looking for this then: #59794

[datner]

I am in the exact same situation like Dom, my case looks a bit more like this though:

type GlibGlob =  {
  [foo: `foo:${string}`]: string;
  [barBaz: `bar:baz:${string}`]: string;
  [barQux: `bar:qux:${string}`]: string;
}

I know that this is a lame way to express hierarchal data, but unfortunately I don't get a choice.
In this situation I get an autocomplete of... nothing, woe is me 😄