patbenatar / rbexy

A Ruby template language and component framework inspired by JSX and React
MIT License
39 stars 5 forks source link

Stacktrace can be inaccurate/very noisy if an error happens #44

Closed lunks closed 3 years ago

lunks commented 3 years ago

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: image

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 commented 3 years ago

@lunks how do these look:

Error raised in template

Screenshot 2020-11-09 170449

Error raised in component method, called from template

Screenshot 2020-11-09 170542

lunks commented 3 years ago

These look great!