Advance RFC #0811 "Element Modifiers" to Stage Recommended

[emberjs-rfcs-bot]

Advance #811 to the Recommended Stage

Summary

This pull request is advancing the RFC to the Recommended Stage.

• PR to Accepted Stage: Element Modifiers #811
• PR to Ready For Release Stage
• PR to Released Stage

An FCP is required before merging this PR to advance.

Recommended Stage Summary

The "Recommended" stage is the final milestone for an RFC. It provides a signal to the wider community to indicate that a feature has been put through its ecosystem paces and is ready to use.

To reach the "Recommended" stage, the following should be true:

If appropriate, the feature is integrated into the tutorial and the guides prose. API documentation is polished and updates are carried through to other areas of API docs that may not directly pertain to the feature.

If the proposal replaces an existing feature, the addon ecosystem has largely updated to work with both old and new features.

If the proposal updates or replaces an existing feature, high-quality codemods are available.

If needed, Ember debugging tools as well as popular IDE support have been updated to support the feature.

If the feature is part of a suite of features that were designed to work together for best ergonomics, the other features are also ready to be "Recommended".

Any criteria for "Recommended" for this proposal that were established in the Ready For Release stage have been met.

An FCP is required to enter this stage. Multiple RFCs may be moved as a batch into "Recommended" with the same PR.

Checklist to move to Recommended

• Any criteria for "Recommended" for this proposal that were established in the Ready For Release stage have been met
• If appropriate, the feature is integrated into the tutorial and the guides prose. API documentation is polished and updates are carried through to other areas of API docs that may not directly pertain to the feature.
• If the proposal replaces an existing feature, the addon ecosystem has largely updated to work with both old and new features.
• If the proposal updates or replaces an existing feature, high-quality codemods are available
• If needed, Ember debugging tools as well as popular IDE support have been updated to support the feature.
• If the feature is part of a suite of features that were designed to work together for best ergonomics, the other features are also ready to be "Recommended".
• This PR has been converted from a draft to a regular PR and the Final Comment Period label has been added to start the FCP

Criteria for moving to Recommended (required)

A set of criteria for moving this RFC to the Recommended Stage, following release:

1. Review / update API docs and guides to see that these are covered. (@mixonic)
2. Update ember-inspector to understand modifiers.
3. Review syntax-highlighter quality for modifiers in HBS. (@NullVoxPopuli, @mansona)
4. Update API docs to use new syntax highlighter. (Also see https://github.com/orgs/ember-learn/projects/68, which may or may not block this)
5. Update guides to use new syntax highlighter.
6. Update deprecations-guides to use new syntax highlighter.

[NullVoxPopuli]

For highlighting:

The main thing is that we don't use handlebars. So updating handlebars parsers is 😬

• API Docs: https://hljs-glimmer.nullvoxpopuli.com/?
  • Needs PR to update API Docs
  • Learning Team is also planning on updating the whole infra on the API Docs, which would switch to prism.
  • We could still PR the usage of the glimmer plugin in the mean time.
• Guides: Use the setup function from ember-prism empress/ember-showdown-prism#51
  • Uses: https://prismjs-glimmer.nullvoxpopuli.com/?

Here is my syntax cheatsheet that uses highlight.js: https://cheatsheet.glimmer.nullvoxpopuli.com/docs/templates

Support

Editors:

• VSCode: https://marketplace.visualstudio.com/items?itemName=chiragpat.vscode-glimmer
• Neovim (treesitter): https://github.com/alexlafroscia/tree-sitter-glimmer
• Lezer / CodeMirror: https://github.com/NullVoxPopuli/limber/tree/main/packages/syntax

Web highlighting:

• Shiki: https://github.com/shikijs/shiki/blob/main/docs/languages.md
• Highlight.js: https://hljs-glimmer.nullvoxpopuli.com/?
• Prism.JS: https://prismjs-glimmer.nullvoxpopuli.com/?

[mixonic]

I've drafted a guides update for this RFC at ember-learn/guides-source#1946. I think pending approval on that repo, it would satisfy the checkbox here for guides documentation.

[ef4]

I think this still needs a champion who can sort through the remaining work and bring a summary to the RFC review. If, for example, we think current syntax highlighting is good enough, let's just get the status and decide what we actually want to do to call this recommended.

[mansona]

We released ember-showdown-prism which has better support for modifers https://github.com/empress/ember-showdown-prism/releases/tag/v4.3.0

This will work for the guides but not the API docs yet

[ef4]

Status update here: we still need ember-inspector support. The other stuff (updating docs infra, adding content to guides) has happened.

[IgnaceMaes]

What does "ember-inspector support" entail? Is this written down somewhere?

It would be great to have a list of minimal features it should support to pick up this work.

[NullVoxPopuli]

Atm the component view in the inspector only shows components, and i think we need to expand in to show (almost) every type of thing.
There's been talk about having ember-source register the view in to inspector, like ember-data does. That way we don't need to have the inspector support all ember-source versions, and we can iterate more tighly with rendering features and debugging ui

[ef4]

RFC review meeting was discussing the inspector requirement here and it's not clearly a blocker for recommended. The inspector already doesn't have any way to reflect helpers in the DOM, so it's not clear that it has a logical place to reflect modifiers either. Opening an issue on inspector to discuss what an updated design would look like seems sufficient.

[achambers]

Created an issue here emberjs/ember-inspector#2541