Improve UX of collapsible sections in CI output
Problem to solve
Version 12.0 added collapsible sections to CI output (outlined in gitlab-ce#14664, implemented in gitlab-ce!28642). While this is a great first pass at the feature, it could use some refinement.
Intended users
Developers
Further details
The current implementation simply adds the option for users to fold sections of the output. While this is still useful, it would be far more useful if it were more user-friendly.
Proposal
I propose adding the following features:
- Auto-collapsing sections
- Either auto-collapse all sections by default, or add an option, probably in the ending tag, as to whether the section should auto-collapse. Auto-collapsing all by default is simpler, but adding the option allows for automatically opening (or just not collapsing) failing sections of the log, while automatically hiding away the irrelevant setup info.
- Show where sections end (as in gitlab-ce!25178)
- Allow for nesting of sections (also as in gitlab-ce!25178)
- Show the name of the section and the time taken to execute. (Will be implemented in https://gitlab.com/gitlab-org/gitlab-ce/issues/63880)
- Currently (as I understand, I could be mistaken), it tracks the name of the section and the start/end times, but this information is not used anywhere. It should be displayed in some form so that users can see what the section is, and, if they care, how long it took.
- Make it easy for users to add custom sections
- This might be as simple as documenting the expected output, or could require a redesign of the expected format to be more user-friendly.
Permissions and Security
No permission changes would be needed, this is purely a visual change for an already-existing system.
Documentation
I'll be honest, I'm not sure what I'm supposed to put in this section.
Testing
I don't foresee any risks. It will require cross-browser testing.
What does success look like, and how can we measure that?
Success would be measured by being able to glance at the output logs from a failed CI pipeline and see exactly what went wrong without having to manually filter out all the surrounding cruft generated by most CI pipeline scripts.