Add GraphQL-backed commit pipelines tab with live updates
What does this MR do and why?
Implementation of #603006
Ports the commit page Pipelines tab from the legacy REST-polling wrapper to a GraphQL-backed component, behind the commit_pipelines_tab_graphql feature flag (default off).
The new component (~/ci/commit/components/commit_pipelines_list.vue) queries a commit's pipelines by SHA and keeps the table live through a single GraphQL subscription instead of polling:
- Backend:
Subscriptions::Ci::Pipelines::StatusesUpdatedgains an optionalshaargument, andGraphqlTriggers.ci_pipeline_statuses_updatedfires an additional SHA-scoped topic (gated by the flag) so the commit tab receives only its own events — no client-side discarding. - Frontend: each subscription event updates a shown pipeline in place or prepends a brand-new one, so status changes and new pipelines appear with no refetch and no polling.
Note
This branch is stacked on commits under review in other MRs, so the diff includes them until they merge. Only the final commit — Add GraphQL-backed commit pipelines tab with live updates — belongs to this change.
Screen Demo
Real-time updates (New! 🎉 )
Testing
- Backend RSpec:
statuses_updated_spec.rb(sha matches / differs / omitted) andgraphql_triggers_spec.rb(dual trigger, flag on/off). - Frontend Jest:
commit_pipelines_list_spec.js— states, count badge, keyset pagination, cancel/retry, live status update from the subscription payload, and brand-new-pipeline prepend. - Feature spec:
user_sees_pipelines_tab_spec.rbruns the rendering tests with the flag on and off, plus real-time subscription scenarios (running pipeline completing, new pipeline appearing).
Edited by Miguel Rincon