Object Indexing with a Template String

[hbiede]

Bug Report

🔎 Search Terms

• This is the behavior in every version I tried, and I reviewed the FAQ for entries about it

⏯ Playground Link

Playground link with relevant code

💻 Code

const fontSizes = {
  h1: 50,
  h2: 45,
  h3: 40,
  h4: 35,
  h5: 30,
  h6: 25,
}

type Props = {
  level: 1 | 2 | 3 | 4 | 5 | 6;
}

const getFontSizeForHeader = ({ level }: Props) => fontSizes[`h${level}`]; // error

console.log('Test', getFontSizeForHeader({ level: 1 }));

🙁 Actual behavior

When indexing an object with a template string, the template string is typed just as string instead of the proper union, causing an error and requiring a type cast or ts-ignore to rid.

🙂 Expected behavior

The template string typing to be used to check for valid indexing

[MartinJohns]

I think you want #26797 / #44512.

[ahejlsberg]

With #44512 we will indeed give template literal types to template literal expressions in index positions. Meanwhile, it works with an explicit const assertion fontSizes[`h${level}` as const].