Refactor TestReports transition animation

Summary

As per !18255 (merged), we have created new navigation transition between states inside the TestReports Vue component. This animation was tricky to add because the component is lodged inside some tabs which made it difficult to apply rules for overflow. The above MR includes the simplest implementation, but there is some ~"technical debt" around how it handles hiding scroll bars.

See the discussions here: !18255 (comment 237883866)

This issue is to see how we can improve and remove the ~"technical debt" here.

Improvements

  • Will make the code easier to understand and reason about
  • We don't have to worry about styling inside the component

Risks

  • Might be difficult to keep the current transition animation without restructuring css

Involved components

  • app > assets > javascripts > pipelines > components > test_reports > test_reports.vue
Assignee Loading
Time tracking Loading