Make errors reporting especially "root errors" more visible

s-celles commented 2 weeks ago

Description

Hello,

I think it's currently difficult with Marimo to notice when there are several errors in a notebook what is the "top/root error" ie the first error that should be fixed in the notebook.

Here are 2 screenshots showing how this behavior could be improved.

First with Marimo

Many red color cells... inexperienced developpers don't really know where to first look at. (I know this... not because I consider myself in this category but because my work is teaching)

Second with Pluto.jl "computer bad, you GREAT!" message clearly points to the original/root/top error.

Alternative

No response

Additional context

No response

akshayka commented 2 weeks ago

Thanks for the suggestion.

We could definitely improve our error reporting. For example in your screenshot, the second cell has a title of NameError, but that's the exception its ancestor raised -- the second cell hasn't even run. So the title and message of cells whose ancestors have errored could be improved, as well as the style of such cells themselves.

s-celles commented 2 weeks ago

https://claude.site/artifacts/709658c3-4474-42da-b31b-ca6125cb1ce5 provides an other example with the mentionned notebook. Numbering cells when there is at least one error could help. Displaying "Affects cells / Depends on" can also help to better understand what is going. Highlighting errored cell reference in the dependencies list with red text can also help (📌 Depends on: $${\color{red}cell-3}$$, cell-4, cell-5)

s-celles commented 2 weeks ago

Top error vs dependant errors could also be displayed in the "Explore dependencies" feature using again the red 🟥 / orange 🟧 color scheme.

Here

cell-2 could be red (instead of grey) and have a ❌ emoji in the white area
cell-5 be orange (instead of grey) and have a ⚠️ emoji in the white area
Other cells which executed fine have have a ✅ emoji in the white area

Mermaid graph could also provide a nice visual display of the situation.

graph TD
    %% Style definitions
    classDef errorNode fill:#FEE2E2,stroke:#DC2626,color:#DC2626
    classDef warningNode fill:#FFF7ED,stroke:#FB923C,color:#FB923C
    classDef successNode fill:#F0FDF4,stroke:#22C55E,color:#22C55E

    %% Nodes
    cell0["Cell [0]\n#x = 1"]:::successNode
    cell1["Cell [1]\ny = 2"]:::successNode
    cell2["Cell [2]\nz = x + y"]:::errorNode
    cell3["Cell [3]\na = 1"]:::successNode
    cell4["Cell [4]\nb = 2"]:::successNode
    cell5["Cell [5]\nc = a + b + z"]:::warningNode

    %% Dependencies
    cell1 --> cell2
    cell2 --> cell5
    cell3 --> cell5
    cell4 --> cell5

    %% Add labels to show error propagation
    subgraph Error Propagation
        cell2 -. "Error propagates" .-> cell5
    end

    %% Add notes
    click cell2 "Root Error: name 'x' is not defined"
    click cell5 "Cascading Error: depends on undefined 'z'"

or this kind of simpler display

https://claude.site/artifacts/bda4bbd1-35a8-43f9-8191-1dfba900a4a2

cells with dependant errors (ie orange ones) could even have an opacity level changed according depth of error.

https://claude.site/artifacts/8cd8584c-3979-4462-b3a4-f43eee8aa192

or using a gradient between orange and beige

or with Mermaid and multi level of depth dependant errors (dependant errors here use a gradient between orange and beige according error depth) https://claude.site/artifacts/b5cff7ec-2f76-46ad-a01a-98166a201c2b

dmadisetti commented 6 days ago

There is the error panel:

Which is my go-to for checking errors. the problem here is that "non-root" errors can swamp the panel. It'd be nice to toggle hide these, or nest them under the parent error (:

I do love the dependency panel idea as well. I think showing running, queued, and stopped would be great

marimo-team / marimo