Skip to content

Use log line js-* classes in js logic

Miguel Rincon requested to merge mrincon-remove-js-line-class into master

What does this MR do and why?

Remove js-* class used for testing in logs

Previously log lines CSS classes were to used to both add style and logic to the log line. This change leave only js-* classes in JS logic and tests.

  • js-log-line: Represents log lines in the log that can be bookmarked and scrolled. There are two variants:
    • ~/ci/job_details/components/log/line.vue
    • ~/ci/job_details/components/log/line_header.vue
  • log-line: Represents logs line styles (padding & min-height).
  • collapsible-line: Hoverable log line styles

I think more work can be done to reduce the amount of HTML rendered, but at least this change creates a separation of concerns for these classes.

Screenshots or screen recordings

image

How to set up and validate locally

  1. Visit any project with a pipeline
  2. Run a pipeline (to create a job)
  3. Confirm the job log is display correctly

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Miguel Rincon

Merge request reports