Pipeline graph view elements reorganize unexpectedly when running a downstream job

Summary

The pipeline graph has a poor UI/UX behavior when there are many jobs in multiple downstream (and possibly other linked) pipelines.

In the pipeline graph view, if you have multiple downstream pipelines, each with many jobs in at least one stage, and you expand these pipelines, the elements jump around the page and the experience is unpleasant.

Steps to reproduce

  1. Create a pipeline with multiple downstream pipelines
  2. Make sure each downstream pipeline has many manual jobs in at least one stage
  3. In the parent pipeline graph view, expand one downstream pipeline
  4. Then, expand another downstream pipeline
  5. Run a pipeline in any of the stages, and observe that the elements move around unexpectedly

Example Project

There is no example project currently. There is a good example video on this customer ticket (GitLab internal)).

What is the current bug behavior?

When running a manual job in a downstream pipeline, the UI elements reorganize unexpectedly.

What is the expected correct behavior?

UI elements should always remain in the same spot without refocusing.

Relevant logs and/or screenshots

Output of checks

Results of GitLab environment info

Expand for output related to GitLab environment info 

(For installations with omnibus-gitlab package run and paste the output of:
`sudo gitlab-rake gitlab:env:info`)

(For installations from source run and paste the output of:
`sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production`)

Results of GitLab application Check

Expand for output related to the GitLab application check 
(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:check SANITIZE=true)


(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true)


(we will only investigate if the tests are passing)

Possible fixes

Patch release information for backports

If the bug fix needs to be backported in a patch release to a version under the maintenance policy, please follow the steps on the patch release runbook for GitLab engineers.

Refer to the internal "Release Information" dashboard for information about the next patch release, including the targeted versions, expected release date, and current status.

High-severity bug remediation

To remediate high-severity issues requiring an internal release for single-tenant SaaS instances, refer to the internal release process for engineers.