ember-cli / ember-cli/ember-twiddle

Angle Bracket Components Break if not Hyphenated

Open
#632 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
268
Forks
87
PR merge metrics
No merged PRs in 30d

Description

Twiddle to showcase this bug:
https://ember-twiddle.com/c8c45c5236474e516c7d39e5f7920d12?openFiles=templates.application.hbs%2Ctemplates.components.my-angel.hbs

Currently using `angle-bracket-component-polyfill` work but not completely.
When doing this: `` I get: `"Assertion Failed: You cannot use 'MyAngel' as a component name. Component names must contain a hyphen."` (edited)
However this works: ``

From Slack:
```
alon [5:47 PM]
Hmm friends, for some reason `angle-bracket-component-polyfill` doesn't completely work in a twiddle
When doing this: `` I get: `"Assertion Failed: You cannot use 'MyAngel' as a component name. Component names must contain a hyphen."` (edited)
However this works: ``

knownasilya [5:48 PM]
sounds like we might have an extra check somewhere?

gaurav0 [5:50 PM]
we do
https://github.com/ember-cli/ember-twiddle/search?q=hyphen&unscoped_q=hyphen

knownasilya [5:52 PM]
If we could check for the presence of the polyfill, we could remove that requirement

gaurav0 [5:55 PM]
https://github.com/rwjblue/ember-angle-bracket-invocation-polyfill#limitations

gaurav0 [5:57 PM]
I'm pretty sure invocation requires a file name of my-angel.js / my-angel.hbs even with the polyfill

gaurav0 [5:58 PM]
And I think we only check the file name provided.

gaurav0 [6:01 PM]
Ok. The error is coming from ember-source, not ember-twiddle (edited)

alon [6:03 PM]
Ok interesting. Maybe the polyfill does something extra to convert non hyphened to hyphened

gaurav0 [6:10 PM]
Yes, it seems to do an ast transform at template precompile time: https://github.com/rwjblue/ember-angle-bracket-invocation-polyfill/blob/master/lib/ast-transform.js
I suppose it could be possible to do this at compile time if addon is detected, I do something like that for hbs``

rwjblue [9:11 PM]
ya, we also need to remove the hyphen requirement when running Ember 3.4+

gaurav0 [9:34 PM]
@rwjblue Would it make sense to just remove the requirement entirely from Twiddle and let Ember itself deal however it does? My concern was that in some versions of Ember the component silently didn't render and in others you get the helper name not found error.

rwjblue [9:48 PM]
AFAIK all semi recent versions of Ember should at least give you an assertion (edited)
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.