-
Notifications
You must be signed in to change notification settings - Fork 651
Add logs to trace details #10281
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add logs to trace details #10281
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR adds structured log entries to the trace detail view by extending the span waterfall view models, adding buttons for each log on spans, and wiring up tooltips and detail panels.
- Updated
SpanWaterfallViewModel.Create
to accept a list ofOtlpLogEntry
and populate a newSpanLogs
property. - Introduced
StructureLogsDetailsViewModel.GetEventName
for consistent event-name resolution. - Enhanced the TraceDetail page and CSS to render clickable log-entry buttons with tooltips and detail panels.
Reviewed Changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.
Show a summary per file
File | Description |
---|---|
tests/Aspire.Dashboard.Tests/Model/SpanWaterfallViewModelTests.cs | Adjusted Create calls to include the new logs argument. |
src/Aspire.Dashboard/Model/StructureLogsDetailsViewModel.cs | Added GetEventName helper for log entry event names. |
src/Aspire.Dashboard/Model/Otlp/SpanWaterfallViewModel.cs | Extended Create to take logs and build SpanLogs . |
src/Aspire.Dashboard/Components/Pages/TraceDetail.razor.css | Added styles for log-entry buttons and tooltips. |
src/Aspire.Dashboard/Components/Pages/TraceDetail.razor.cs | Injected localizers, managed SelectedData , and toggle logic. |
src/Aspire.Dashboard/Components/Pages/TraceDetail.razor | Rendered log-entry buttons, tooltips, and detail views. |
src/Aspire.Dashboard/Components/Pages/StructuredLogs.razor | Refactored event-name logic to use GetEventName . |
Comments suppressed due to low confidence (3)
tests/Aspire.Dashboard.Tests/Model/SpanWaterfallViewModelTests.cs:29
- No tests cover the new log-related functionality in
SpanWaterfallViewModel.Create
. Add unit tests that supply non-emptylogs
input and verify that theSpanLogs
property of the resulting view models is populated correctly.
var vm = SpanWaterfallViewModel.Create(trace, [], new SpanWaterfallViewModel.TraceDetailState([], []));
src/Aspire.Dashboard/Model/StructureLogsDetailsViewModel.cs:13
- The public method
GetEventName
lacks XML documentation comments. Please add triple-slash summaries and<remarks>
to explain its purpose and fallback behavior.
public static string GetEventName(OtlpLogEntry logEntry, IStringLocalizer<Dashboard.Resources.StructuredLogs> loc)
src/Aspire.Dashboard/Components/Pages/TraceDetail.razor.css:242
- The selector
::deep.log-tooltip-title-container
is missing a space between::deep
and the class, which likely prevents it from applying. It should be::deep .log-tooltip-title-container
.
::deep.log-tooltip-title-container {
var eventName = StructureLogsDetailsViewModel.GetEventName(item.LogEntry, StructuredLogsLoc); | ||
var isSelected = SelectedData?.LogEntryViewModel?.LogEntry.InternalId == item.LogEntry.InternalId; | ||
|
||
<button id="@buttonId" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The log entry buttons lack a visible label or aria-label
, which makes them inaccessible to screen readers. Add an aria-label
attribute (for example, aria-label="<event name>"
) to each button to provide an accessible name.
Copilot uses AI. Check for mistakes.
Did you stress test this? |
I tested with 10,000 logs in one trace. Many HTML tooltips can be a performance hit so I limited to 500. The fallback is browser tooltips. There is still a 1 second pause to render the page, but that seems better than hiding some buttons. And realistically a trace with 10,000 logs is a rare event. |
Description
Add log entries to trace details. Visual buttons for each log entry is displayed on associated spans. Can hover for a tooltip or click to open log entry details.
Future improvements (probably in a future PR)
Checklist
<remarks />
and<code />
elements on your triple slash comments?doc-idea
templatebreaking-change
templatediagnostic
template