Skip to content

Post-merge-review: Fix template-no-unnecessary-component-helper: skip autofix for invalid GJS/GTS identifiers#2675

Merged
NullVoxPopuli merged 2 commits intoember-cli:masterfrom
johanrd:night_fix/template-no-unnecessary-component-helper
Apr 14, 2026
Merged

Post-merge-review: Fix template-no-unnecessary-component-helper: skip autofix for invalid GJS/GTS identifiers#2675
NullVoxPopuli merged 2 commits intoember-cli:masterfrom
johanrd:night_fix/template-no-unnecessary-component-helper

Conversation

@johanrd
Copy link
Copy Markdown
Contributor

@johanrd johanrd commented Apr 13, 2026

What's broken on master

Converts {{component "my-component" foo=1}}{{my-component foo=1}}. In GJS/GTS, my-component is not a valid JS identifier, so the autofix output is unparseable.

Fix

Detect the violation in both modes (keep the error message), but skip the autofix in strict mode when the component name isn't a valid JS identifier (contains dashes, slashes, etc.).

Test plan

57/57 tests pass. 2 new GJS/GTS invalid tests with output: null (kebab names) fail on master because master produces the invalid fix. 1 new GJS invalid test with a valid camelCase name still autofixes correctly.


Co-written by Claude.

… autofix in GJS/GTS

The rule converts {{component "my-component" ...}} to {{my-component ...}}.
In GJS/GTS, a kebab-case component name is not a valid JS identifier, so
the autofix would produce unparseable output. Keep detection (the user
is still told to invoke directly), but skip the autofix in strict mode
when the component name contains non-identifier characters.
@johanrd johanrd marked this pull request as ready for review April 13, 2026 10:34
const isStrictMode = filename.endsWith('.gjs') || filename.endsWith('.gts');
let inAttribute = 0;

// In strict mode, a kebab-case / slash component name cannot become
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

we know how to do this tho ;)

// identifier. The error is still reported so the user sees the issue.
{
filename: 'test.gjs',
code: '<template>{{component "my-component-name" foo=123}}</template>',
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

we can autofix this, I think

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

You mean like the angle-brackets-codemod?

Autofix inside here would produce undefined identifier without the import i think — Added noUnnecessaryComponentKebab messageId that tells the user the PascalCase equivalent (e.g. my-component → MyComponent) and points to the angle-brackets-codemod.

Kebab-case names can't become valid JS bindings, so a full autofix
(component helper removal + import) isn't feasible here. Report with
a dedicated messageId that tells the user the PascalCase equivalent
and points to ember-codemods/angle-brackets-codemod for automated
end-to-end migration.
@NullVoxPopuli NullVoxPopuli merged commit 96131f4 into ember-cli:master Apr 14, 2026
10 of 11 checks passed
@github-actions github-actions bot mentioned this pull request Apr 14, 2026
@johanrd johanrd deleted the night_fix/template-no-unnecessary-component-helper branch April 14, 2026 21:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants