Skip to content

Add colouring to the logs query display #907

Open

Description

Problem

Currently the experience for debugging logs in the scenes dashboards is quite frustrating and difficult to parse to find what you are looking for. Even when filtering by unsuccessful runs (which isn't always desirable) it can be difficult to pick out the different information provided by the log line.

Completion criteria

  • That logs on the scenes dashboards have key information colourised. Key information in colour should include:
    • Check pass
    • Check failed
    • URL
    • Status code returned (please explore if using differing colours for 200s / 300s / 400s / 500s is desirable).

Not part of the acceptance criteria but an a11y-friendly colour palette is encouraged where possible. It may be tempting to default to red/green for pass and failures but this is one of the most common colourblind deficiencies.

There is a larger story to making parsing logs more readable so this ticket is specifically looking at adding colouring to the existing logs. Please record any additional thoughts you may have which would improve the readability of logs and we will revisit this at a later date.

Please use peterschretlen1.grafana.net as a reference. Here the colouring is being added directly in the logs query and can be viewed in Explore:

Logs query example
image

Log result example
image

(and in text)

Query - Response

{job="Proof - full set"} |= `<redacted>` |= "Response:\\nHTTP"
| regexp `.*Response:\\nHTTP.....(?P<status>[^ ]+)`
| logfmt | __error__ = "" 
| label_format level = "{{if(lt .status `400`) }}info{{else}}error{{end}}"
| label_format status_color = "{{if and (ge .status `200`) (lt .status `300`)}}37;3{{else if and (ge .status `300`) (lt .status `400`) }}33;3{{else}}31;3{{end}}"
| label_format status_colored = "\u001b[{{ .status_color }}m{{ .status }}\u001b[0m"
| line_format "{{ .status_colored }} {{ .msg }}"

Query - Request

{job="Proof - full set"} |= `<redacted>` |= "Request:\\n"
| logfmt | __error__ = "" 
| label_format status_color = "33;3"
| label_format status_colored = "\u001b[{{ .status_color }}m{{ .status }}\u001b[0m"
| line_format "{{ .status_colored }} {{ .msg }}"

Query - Assertion
{job="Proof - full set"} | logfmt | check=`bhtest`
| label_format level = "{{if(eq .value `1`) }}info{{else}}error{{end}}"
| label_format status_color = "{{if (eq .value `1`)}}37;3{{else}}31;3{{end}}"
| label_format status_colored = "\u001b[{{ .status_color }}m{{if (eq .value `1`)}}passed{{else}}failed{{end}}\u001b[0m"
| line_format "{{ .msg }} - {{ .check }}:{{.status_colored}}"

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions