This pr addresses#9971.
I didn't apply all the tests written forTemplateLiterals toTemplateLiteralTypes because it shares most of its logic withTemplateLiterals.
This includes tests for basic behavior similar toTemplateLiteral and some behavior that must be handled separately forTemplateLiteralType.

typeType= `${"aa"}`;// errortypeType= `a${"aa"}`;// errortypeType= `a${"aa"/* comments */}`;;// no-error// enumenumMyEnum{A="A",B="B"}typeType= `${MyEnum}`;//  no-errortypeType= `${MyEnum.A}`;// error// TSNullKeyword & TSUndefinedKeywordtypeType= `${null}`;// errortypeType= `${undefined}`;// error

Copy link

Contributor

typescript-eslintbot commentedJan 5, 2025

Thanks for the PR,@yeonjuan!

typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community.

The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately.

Thanks again!

🙏Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint.

Copy link

netlifybot commentedJan 5, 2025•
edited
Loading

✅ Deploy Preview fortypescript-eslint ready!

Name	Link
🔨 Latest commit	`14beb1a`
🔍 Latest deploy log	https://app.netlify.com/sites/typescript-eslint/deploys/67936bfc87b19c00089abc4e
😎 Deploy Preview	https://deploy-preview-10612--typescript-eslint.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 97 (🔴 down 1 from production) Accessibility: 100 (no change from production) Best Practices: 92 (no change from production) SEO: 98 (no change from production) PWA: 80 (no change from production) View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to yourNetlify site configuration.

Copy link

nx-cloudbot commentedJan 5, 2025•
edited
Loading

View yourCI Pipeline Execution ↗ for commit14beb1a.

Command	Status	Duration	Result
`nx run-many --target=build --exclude website --...`	✅ Succeeded	1s	View ↗
`nx run-many --target=clean`	✅ Succeeded	10s	View ↗

☁️Nx Cloud last updated this comment at2025-01-24 14:41:58 UTC

yeonjuan force-pushed thefixes/9971 branch 2 times, most recently frome4f963b to849fa9aCompare

January 5, 2025 10:39

Copy link

codecovbot commentedJan 5, 2025•
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 87.23%. Comparing base(31be053) to head(14beb1a).
Report is 30 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@##             main   #10612      +/-   ##==========================================+ Coverage   87.15%   87.23%   +0.08%==========================================  Files         448      450       +2       Lines       15576    15677     +101       Branches     4551     4589      +38     ==========================================+ Hits        13575    13676     +101  Misses       1645     1645                Partials      356      356

Flag	Coverage Δ
unittest	`87.23% <100.00%> (+0.08%)`	⬆️

Flags with carried forward coverage won't be shown.Click here to find out more.

Files with missing lines	Coverage Δ
...in/src/rules/no-unnecessary-template-expression.ts	`100.00% <100.00%> (+1.11%)`	⬆️

... and14 files with indirect coverage changes

fix(eslint-plugin): handle expressions in template literal type

9bde9b8

yeonjuan force-pushed thefixes/9971 branch from920f516 to9bde9b8Compare

January 6, 2025 12:14

yeonjuan added5 commits

January 6, 2025 22:27

Update no-unnecessary-template-expression.test.ts

d7bfc3c

add docs

556b483

update snapshots

d16be87

handle undefined & null

2ae997b

add tests

c9e1fe8

yeonjuan marked this pull request as ready for review

January 6, 2025 14:51

yeonjuan added2 commits

January 7, 2025 00:02

add tests

435bb86

Merge branch 'main' into fixes/9971

88766d3

yeonjuan changed the title~~fix(eslint-plugin): handle expressions in template literal type~~fix(eslint-plugin): [no-unnecessary-template-expression] handle template literal type

Jan 9, 2025

Merge branch 'main' into fixes/9971

b76c79f

kirkwaiblinger requested changes

Jan 19, 2025

View reviewed changes

Copy link

Member

kirkwaiblinger left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Well done on managing to reuse the existing code even though the AST is slightly different! And especially kudos for making it a readable git diff! (PSA to other readers - you need to have the "ignore whitespace" feature enabled in order to read this PR).

Requesting some changes but I think the overall approach is good!

packages/eslint-plugin/src/rules/no-unnecessary-template-expression.ts OutdatedShow resolvedHide resolved

packages/eslint-plugin/src/rules/no-unnecessary-template-expression.tsShow resolvedHide resolved

packages/eslint-plugin/src/rules/no-unnecessary-template-expression.ts OutdatedShow resolvedHide resolved

kirkwaiblinger added the awaiting responseIssues waiting for a reply from the OP or another party label

Jan 20, 2025

apply review

de4d428

yeonjuan commented

Jan 20, 2025

View reviewed changes

packages/eslint-plugin/tests/rules/no-unnecessary-template-expression.test.ts

		@@ -976,6 +976,9 @@ ruleTester.run('no-unnecessary-template-expression', rule, {
		valid: [
		"const string = 'a';",
		'const string = `a`;',
		'const string = `NaN: ${/* comment */ NaN}`;',
		'const string = `undefined: ${/* comment */ undefined}`;',
		'const string = `Infinity: ${Infinity /* comment */}`;',

Copy link

ContributorAuthor

yeonjuanJan 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

fixes#10684

yeonjuan mentioned this pull request

Jan 20, 2025

Bug: [no-unnecessary-template-expression] has a few bugs around comment detection#10684

Closed

4 tasks

Copy link

ContributorAuthor

yeonjuan commentedJan 20, 2025•
edited
Loading

@kirkwaiblinger Thank you for your review. I've fixed it! 👍de4d428

kirkwaiblinger reviewed

Jan 22, 2025

View reviewed changes

Copy link

Member

kirkwaiblinger left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Looking great! Couple questions, no real blockers.

packages/eslint-plugin/docs/rules/no-unnecessary-template-expression.mdx

		@@ -51,6 +57,15 @@ const wrappedIntersection = `${intersectionWithString}`;

		const ab1 = `ab`;
		const ab2 = `ab`;
		type AB = `AB`;

		// Transforming enum members into string unions using template literals is allowed.

Copy link

Member

kirkwaiblingerJan 22, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Just curious, what's the reasoning for this? I'm not familiar with this usage, so I'm curious for a reference on it, and not seeing one on the issue

Copy link

ContributorAuthor

yeonjuanJan 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

@kirkwaiblinger
I should have written an explanation for this, but I missed it. This is an easy way to change an enum to a union type, and the union type is not the same as the enum.

playground

enumEnum{A='A',B='B',C='C'}typeUnion= `${Enum}`;functionfoo(a:Enum){}foo("A");// ts error: Argument of type '"A"' is not assignable to parameter of type 'EnumA'.foo(Enum.A);functionbar(a:Union){}bar("A");

typescript-eslint is also using this approach.

typescript-eslint/packages/utils/tests/ts-eslint/Rule.type-test.ts

Line 15 ine4f5a52

| `${TSESTree.AST_NODE_TYPES}`;

Copy link

Member

kirkwaiblingerJan 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Ok 👍 Seems plausible to me! I'll defer to you and other reviewers on this, thanks for the explanation!

packages/eslint-plugin/src/rules/no-unnecessary-template-expression.ts

		return isStringLike(type);
		}

		function isEnumType(type: ts.Type): boolean {

Copy link

Member

kirkwaiblingerJan 22, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

It looks like enums have a type flagts.TypeFlags.EnumLike set. Can we just use that?

Copy link

ContributorAuthor

yeonjuanJan 23, 2025•
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

@kirkwaiblinger
This function is for checking if it is an enum declaration symbol (not member).

enumEnum{A='A'}typeA= `${Enum}`;

That doesn't seem work because both enum declaration and enum members have theEnumLike flag.
Perhaps it would be better to rename the function tohasEnumDeclarationSymbol , what do you think?

Copy link

Member

kirkwaiblingerJan 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Ah, gotcha. Then, I think it's good as is! If anything, a comment with example like

/** * Checks for whole enum types, i.e. `MyEnum`, and not their values, i.e. `MyEnum.A` */

might be more helpful. But fine either way!

Copy link

ContributorAuthor

yeonjuanJan 24, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Sounds good, I've added the comment.14beb1a

packages/eslint-plugin/src/rules/no-unnecessary-template-expression.ts OutdatedShow resolvedHide resolved

packages/eslint-plugin/tests/rules/no-unnecessary-template-expression.test.ts OutdatedShow resolvedHide resolved

packages/eslint-plugin/tests/rules/no-unnecessary-template-expression.test.tsShow resolvedHide resolved

apply reviews

256040f

kirkwaiblinger previously approved these changes

Jan 23, 2025

View reviewed changes

Copy link

Member

kirkwaiblinger left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Great work!!

@typescript-eslint/triage-team Looking for a second review on this since it's tricky stuff!

kirkwaiblinger removed the awaiting responseIssues waiting for a reply from the OP or another party label

Jan 23, 2025

kirkwaiblinger requested a review froma team

January 23, 2025 17:29

add comments

14beb1a

yeonjuan dismissedkirkwaiblinger’sstale review via14beb1a

January 24, 2025 10:31

kirkwaiblinger approved these changes

Jan 24, 2025

View reviewed changes

kirkwaiblinger added the 1 approval>=1 team member has approved this PR; we're now leaving it open for more reviews before we merge label

Jan 24, 2025

kirkwaiblinger requested a review froma team

January 24, 2025 14:40

github-actionsbot removed the 1 approval>=1 team member has approved this PR; we're now leaving it open for more reviews before we merge label

Jan 24, 2025

kirkwaiblinger added the 1 approval>=1 team member has approved this PR; we're now leaving it open for more reviews before we merge label

Jan 24, 2025

JoshuaKGoldberg approved these changes

Jan 27, 2025

View reviewed changes

Copy link

Member

JoshuaKGoldberg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

JoshuaKGoldberg merged commitf1e9a5d intotypescript-eslint:main

Jan 27, 2025

65 of 67 checks passed

renovatebot added a commit to andrei-picus-tink/auto-renovate that referenced this pull request

Jan 29, 2025

Update typescript-eslint monorepo to v8.22.0

4c4279d

| datasource | package                          | from   | to     || ---------- | -------------------------------- | ------ | ------ || npm        | @typescript-eslint/eslint-plugin | 8.21.0 | 8.22.0 || npm        | @typescript-eslint/parser        | 8.21.0 | 8.22.0 |## [v8.22.0](https://github.com/typescript-eslint/typescript-eslint/blob/HEAD/packages/eslint-plugin/CHANGELOG.md#8220-2025-01-27)##### 🩹 Fixes-   **eslint-plugin:** \[no-unnecessary-template-expression] handle template literal type ([#10612](typescript-eslint/typescript-eslint#10612))-   **eslint-plugin:** \[prefer-readonly] autofixer doesn't add type to property that is mutated in the constructor ([#10552](typescript-eslint/typescript-eslint#10552))-   **eslint-plugin:** \[no-extraneous-class] handle accessor keyword ([#10678](typescript-eslint/typescript-eslint#10678))-   **eslint-plugin:** \[no-shadow] don't report unnecessarily on valid ways of using module augmentation ([#10616](typescript-eslint/typescript-eslint#10616))-   **eslint-plugin:** \[no-duplicate-type-constituents] handle nested types ([#10638](typescript-eslint/typescript-eslint#10638))-   **eslint-plugin:** \[prefer-nullish-coalescing] doesn't report on ternary but on equivalent || ([#10517](typescript-eslint/typescript-eslint#10517))##### ❤️ Thank You-   mdm317-   Olivier Zalmanski [@OlivierZal](https://github.com/OlivierZal)-   Ronen Amiel-   YeonJuan [@yeonjuan](https://github.com/yeonjuan)You can read about our [versioning strategy](https://main--typescript-eslint.netlify.app/users/versioning) and [releases](https://main--typescript-eslint.netlify.app/users/releases) on our website.

renovatebot added a commit to andrei-picus-tink/auto-renovate that referenced this pull request

Jan 29, 2025

Update typescript-eslint monorepo to v8.22.0

ea6b903

| datasource | package                          | from   | to     || ---------- | -------------------------------- | ------ | ------ || npm        | @typescript-eslint/eslint-plugin | 8.21.0 | 8.22.0 || npm        | @typescript-eslint/parser        | 8.21.0 | 8.22.0 |## [v8.22.0](https://github.com/typescript-eslint/typescript-eslint/blob/HEAD/packages/eslint-plugin/CHANGELOG.md#8220-2025-01-27)##### 🩹 Fixes-   **eslint-plugin:** \[no-unnecessary-template-expression] handle template literal type ([#10612](typescript-eslint/typescript-eslint#10612))-   **eslint-plugin:** \[prefer-readonly] autofixer doesn't add type to property that is mutated in the constructor ([#10552](typescript-eslint/typescript-eslint#10552))-   **eslint-plugin:** \[no-extraneous-class] handle accessor keyword ([#10678](typescript-eslint/typescript-eslint#10678))-   **eslint-plugin:** \[no-shadow] don't report unnecessarily on valid ways of using module augmentation ([#10616](typescript-eslint/typescript-eslint#10616))-   **eslint-plugin:** \[no-duplicate-type-constituents] handle nested types ([#10638](typescript-eslint/typescript-eslint#10638))-   **eslint-plugin:** \[prefer-nullish-coalescing] doesn't report on ternary but on equivalent || ([#10517](typescript-eslint/typescript-eslint#10517))##### ❤️ Thank You-   mdm317-   Olivier Zalmanski [@OlivierZal](https://github.com/OlivierZal)-   Ronen Amiel-   YeonJuan [@yeonjuan](https://github.com/yeonjuan)You can read about our [versioning strategy](https://main--typescript-eslint.netlify.app/users/versioning) and [releases](https://main--typescript-eslint.netlify.app/users/releases) on our website.

kirkwaiblinger mentioned this pull request

Jan 29, 2025

Bug: [no-unnecessary-template-expression] False positive suggesting${T} ->T#10738

Closed

4 tasks

github-actionsbot locked asresolvedand limited conversation to collaborators

Feb 4, 2025

Labels

1 approval

>=1 team member has approved this PR; we're now leaving it open for more reviews before we merge

3 participants

Movatterモバイル変換

Uh oh!

fix(eslint-plugin): [no-unnecessary-template-expression] handle template literal type#10612

fix(eslint-plugin): [no-unnecessary-template-expression] handle template literal type#10612

Uh oh!

Conversation

yeonjuan commentedJan 5, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

PR Checklist

Overview

Uh oh!

typescript-eslintbot commentedJan 5, 2025

Uh oh!

netlifybot commentedJan 5, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

✅ Deploy Preview fortypescript-eslint ready!

Uh oh!

nx-cloudbot commentedJan 5, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Uh oh!

codecovbot commentedJan 5, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Codecov Report

Uh oh!

kirkwaiblinger left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

yeonjuanJan 20, 2025

Choose a reason for hiding this comment

Uh oh!

yeonjuan commentedJan 20, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Uh oh!

kirkwaiblinger left a comment

Choose a reason for hiding this comment

Uh oh!

kirkwaiblingerJan 22, 2025

Choose a reason for hiding this comment

Uh oh!

yeonjuanJan 23, 2025

Choose a reason for hiding this comment

Uh oh!

kirkwaiblingerJan 23, 2025

Choose a reason for hiding this comment

Uh oh!

kirkwaiblingerJan 22, 2025

Choose a reason for hiding this comment

Uh oh!

yeonjuanJan 23, 2025• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kirkwaiblingerJan 23, 2025

Choose a reason for hiding this comment

Uh oh!

yeonjuanJan 24, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

kirkwaiblinger left a comment

Choose a reason for hiding this comment

Uh oh!

JoshuaKGoldberg left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

yeonjuan commentedJan 5, 2025•
edited
Loading

netlifybot commentedJan 5, 2025•
edited
Loading

nx-cloudbot commentedJan 5, 2025•
edited
Loading

codecovbot commentedJan 5, 2025•
edited
Loading

yeonjuan commentedJan 20, 2025•
edited
Loading

yeonjuanJan 23, 2025•
edited
Loading