Phoenix equivalent of Rails config.action_view.annotate_template_file_names?

Hello, I am still learning the basics of Phoenix so I apologize if this question has an obvious answer that I couldn’t find through Google yet.

With the welcome proliferation of components, it can get difficult to pin-point in which file/code fragment to fix an error displayed in the browser. it is difficult to see where the code from one component begins and ends, and in which component the fixable thing is being generated.

In Rails 6.1, the team added a config.action_view.annotate_template_file_names option that displays the beginning and end of each partial/component/template file (in the development environment):

image

This makes it much easier to quickly find the file in which to fix something, and encourages splitting up templates and components along single-responsibility principles.

Is there an equivalent configuration built into Phoenix or is there an easy way to hack Phoenix so that it would display the component beginnings and endings in the source like Rails does when this option is turned on?

Thank you all!

2 Likes

Well, really nice to know about this feature on rails, I will certainly use it
Here is the phoenix counterpart
https://hexdocs.pm/phoenix_live_view/Phoenix.Component.html#module-debug-annotations

And a demo from Chris

1 Like