Stacktrace can be inaccurate/very noisy if an error happens

[lunks]

If I get an error in a template, the stacktrace can get very noisy. From optify, with an error on the imgix-rails gem:

ActionView::Template::Error (undefined method `[]' for nil:NilClass):
    18:           </div>
    19:         </div>
    20: 
    21:         {variant_image_tag(variant)}
    22:       </a>
    23:     }}
    24:   </div>
  
app/components/molecules/shopper/product_card_component.rb:39:in `variant_image_tag'
app/components/molecules/shopper/product_card_component.rbx:21
app/components/molecules/shopper/product_card_component.rbx:10:in `tap'
app/components/molecules/shopper/product_card_component.rbx:10
app/components/molecules/shopper/product_card_component.rbx:4
app/components/molecules/shopper/product_card_component.rbx:4:in `tap'
app/components/molecules/shopper/product_card_component.rbx:4
app/components/molecules/shopper/product_card_component.rbx:3:in `map'
app/components/molecules/shopper/product_card_component.rbx:3
app/components/molecules/shopper/product_card_component.rbx:2:in `tap'
app/components/molecules/shopper/product_card_component.rbx:2
app/components/molecules/shopper/product_card_component.rbx:2
app/components/molecules/shopper/product_card_component.rbx:2:in `tap'
app/components/molecules/shopper/product_card_component.rbx:2
app/components/molecules/shopper/product_card_component.rbx:1:in `tap'
app/components/molecules/shopper/product_card_component.rbx:1
app/components/molecules/shopper/product_card_component.rbx:1
app/components/molecules/shopper/product_card_component.rbx:1:in `tap'
app/components/molecules/shopper/product_card_component.rbx:1
app/components/molecules/shopper/product_card_component.rbx:1:in `tap'
app/components/molecules/shopper/product_card_component.rbx:1
app/views/shopper/products/_product.rbx:2
app/views/shopper/products/_product.rbx:2:in `tap'
app/views/shopper/products/_product.rbx:2
app/views/shopper/products/_product.rbx:1:in `tap'
app/views/shopper/products/_product.rbx:1
app/components/atoms/shopper/column_component.rb:5:in `call'
app/views/shopper/products/_product.rbx:1
app/views/shopper/products/_product.rbx:1:in `tap'
app/views/shopper/products/_product.rbx:1
app/views/shopper/products/_product.rbx:1:in `tap'
app/views/shopper/products/_product.rbx:1
app/components/organisms/shopper/product_list_component.rbx:7
app/components/organisms/shopper/product_list_component.rbx:6:in `tap'
app/components/organisms/shopper/product_list_component.rbx:6
app/components/atoms/shopper/columns_component.rb:8:in `call'
app/components/organisms/shopper/product_list_component.rbx:6
app/components/organisms/shopper/product_list_component.rbx:6:in `tap'
app/components/organisms/shopper/product_list_component.rbx:6
app/components/organisms/shopper/product_list_component.rbx:4:in `tap'
app/components/organisms/shopper/product_list_component.rbx:4
app/components/organisms/shopper/product_list_component.rbx:1
app/components/organisms/shopper/product_list_component.rbx:1:in `tap'
app/components/organisms/shopper/product_list_component.rbx:1
app/components/organisms/shopper/product_list_component.rbx:1:in `tap'
app/components/organisms/shopper/product_list_component.rbx:1
app/views/shopper/products/index.rbx:4
app/views/shopper/products/index.rbx:4:in `tap'
app/views/shopper/products/index.rbx:4
app/views/shopper/products/index.rbx:3:in `tap'
app/views/shopper/products/index.rbx:3
app/components/atoms/shopper/container_component.rb:5:in `call'
app/views/shopper/products/index.rbx:3
app/views/shopper/products/index.rbx:3:in `tap'
app/views/shopper/products/index.rbx:3
app/views/shopper/products/index.rbx:1:in `tap'
app/views/shopper/products/index.rbx:1

With a default ERB file:

ActionView::Template::Error (undefined method `[]' for nil:NilClass):
    25:         <div class='medium-6 columns'>
    26:           <%= link_to 'Shop'  %>
    27:             <%= link_to some_path class: 'block-link' do %>
    28:               <%= ix_image_tag nil %>
    29:               <%= image_tag "image.jpg" %>
    30:             <% end %>
    31:         </div>
  
app/views/pages/landing.html.erb:28
app/views/pages/landing.html.erb:27
app/controllers/pages_controller.rb:34:in `landing'

Also, if the error is in a helper (close to what a component is in Rails world), this is what I get:

ActionView::Template::Error (undefined method `[]' for nil:NilClass):
    25:         <div class='medium-6 columns'>
    26:           <%= link_to 'Shop'  %>
    27:             <%= link_to some_path class: 'block-link' do %>
    28:               <%= error_in_helper  %>
    29:               <%= image_tag "image.jpg" %>
    30:             <% end %>
    31:         </div>
  
app/helpers/application_helper.rb:162:in `error_in_helper'
app/views/pages/landing.html.erb:28
app/views/pages/landing.html.erb:27
app/controllers/pages_controller.rb:34:in `landing'

error_in_helper is the name of the method I defined.

And this is what the browser show:

Ideally, the stack trace should look something like this:

ActionView::Template::Error (undefined method `[]' for nil:NilClass):
    18:           </div>
    19:         </div>
    20: 
    21:         {variant_image_tag(variant)}
    22:       </a>
    23:     }}
    24:   </div>

app/components/molecules/shopper/product_card_component.rb:39:in `variant_image_tag'
app/components/molecules/shopper/product_card_component.rbx:21
app/views/shopper/products/_product.rbx:2
app/views/shopper/products/index.rbx:4

The output on the HTML error response could point to the exact component .rb file as an improvement (similar to how it shows the helper exact line in the screenshot), but just mimicking what Rails does in console for ERB would help immensely. The stack trace I wanted was behind the "Framework Trace" button but I assumed it was truncated from the main stack trace due to how big it was.

[patbenatar]

@lunks how do these look:

Error raised in template

Error raised in component method, called from template

[lunks]

These look great!