Closed DRBragg closed 1 year ago
Hey @DRBragg! Good to hear from you, apologies for the slow reply but I'm currently moving house at the moment and things are all a bit hectic...
I'm super glad that you are on the path to upgrading to Lookbook v2 - mostly to help assuage my guilt that I haven't found time to work on the older-Rails compatibility PR or your other bug report (even though it's still the bug report ever).
Looks like you've updgraded to Rails 6.1 now - I'm assuming that was quite the large job?! Congratulations anyway :-)
I'm not quite sure why you are seeing this behaviour but it might well be a classic autoloader vs Zeitwerk thing, that would make sense. Regardless, I've just fixed it on main
and will get another release out with this included shortly.
I've been through the app and I can't see anywhere else obvious where a similar namespacing issue might occur but please do let me know if you run into anything else.
@DRBragg I've just release v2.0.4 with the fix for this so I'll close this down now, but any other issues just let me know. Thanks again for the bug report and all the detail in there too!
Thanks @allmarkedup! You rock. If I ever make it to Brighton, or you come to the US I owe you a beer.
Ah thank you @DRBragg, very kind :-) I hope to be able to take you up on that offer at some point!
Describe the bug
We're attempting to upgrade to Lookbook v2 (finally) and running into a strange issue where lookbook tries to render icons with our icon component rather than its own. On any preview page we get this: In the stack trace I noticed this:
Full Stack Trace
Full stack trace: /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline/transformations/size.rb:11:in `width_of' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline/transformations/size.rb:5:in `block in transform' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline/transformations/transformation.rb:26:in `with_svg' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline/transformations/size.rb:4:in `transform' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline.rb:6:in `block in generate_html_from' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline.rb:5:in `each' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline.rb:5:in `reduce' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/transform_pipeline.rb:5:in `generate_html_from' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/action_view/helpers.rb:50:in `render_inline_svg' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/action_view/helpers.rb:9:in `block in inline_svg_tag' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/action_view/helpers.rb:78:in `with_asset_finder' /app/bundler/root/gems/ruby/2.7.0/gems/inline_svg-1.9.0/lib/inline_svg/action_view/helpers.rb:8:in `inline_svg_tag' /app/development/app/components/icon/component.rb:12:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/slot.rb:62:in `to_s' /app/bundler/root/gems/ruby/2.7.0/gems/activesupport-6.1.7.3/lib/active_support/core_ext/string/output_safety.rb:42:in `unwrapped_html_escape' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/output_safety_helper.rb:36:in `block in safe_join' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/output_safety_helper.rb:36:in `map!' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/output_safety_helper.rb:36:in `safe_join' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/icon_button/component.html.erb:14:in `block in call' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:234:in `content' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:18:in `block in call' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/tag_helper.rb:59:in `tag_string' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/tag_helper.rb:174:in `method_missing' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:17:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:17:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:164:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:44:in `lookbook_tag' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/base_component.rb:17:in `render_component_tag' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/icon_button/component.html.erb:1:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:164:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/copy_button/component.html.erb:1:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:164:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/embed_code_dropdown/component.html.erb:26:in `block in call' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:234:in `content' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:18:in `block in call' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/tag_helper.rb:59:in `tag_string' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/tag_helper.rb:174:in `method_missing' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:17:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/tag_component.rb:17:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:164:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:44:in `lookbook_tag' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/base_component.rb:17:in `render_component_tag' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/embed_code_dropdown/component.html.erb:1:in `call' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/compiler.rb:115:in `render_template_for' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:105:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:58:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:58:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/views/lookbook/inspector/show.html.erb:39:in `block (6 levels) in __app_bundler_root_gems_ruby_______gems_lookbook_______app_views_lookbook_inspector_show_html_erb___1775450228223270832_128000' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/slotable.rb:365:in `block in set_slot' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `block in capture' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:209:in `with_output_buffer' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/capture_helper.rb:45:in `capture' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:234:in `content' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/slotable.rb:320:in `get_slot' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/slotable.rb:92:in `block in renders_one' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/button/component.rb:14:in `dropdown?' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/button/component.rb:26:in `before_render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:102:in `render_in' /app/bundler/root/gems/ruby/2.7.0/gems/actionview-6.1.7.3/lib/action_view/helpers/rendering_helper.rb:43:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/view_component-3.0.0/lib/view_component/base.rb:164:in `render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `public_send' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/lib/lookbook/helpers/ui_elements_helper.rb:56:in `lookbook_render' /app/bundler/root/gems/ruby/2.7.0/gems/lookbook-2.0.3/app/components/lookbook/button_group/component.rb:8:in `block inI can adjust our icon component to ensure that
size
is a string but then some icons don't render (that's also not great behavior). I tried using a custom fork where I adjusted the icon slot inLookbook::IconButton::Component
to useLookbook::Icon::Component
explicitly instead ofIcon::Component
and that solved the problem.Since that change was made a while ago and I appear to be the first to run into the issue I wonder if it's our app that is the problem. Or if there's an unlisted requirement of Lookbook that might be the issue?
Currently we're using Ruby 2.7 and Rails 6.1. However we are still using the classic autoloader. Could that be part of the issue?
Expected behavior
Lookbook uses its own icon component to render icons
Version numbers
Please complete the following information:
Additional context
Our app also does many goofy things (like autoloading all of
lib/
😬 ) so this very well may be an us problem. I will try to spin up a new rails app and see if I can duplicate.