[Feature flag] Rollout of `runner_detailed_view_vue_ui`

Summary

This issue is to rollout the migration to Vue of admin UI (details) on production, which is currently behind the runner_detailed_view_vue_ui feature flag.

⚠ This UI uses runner_graphql_query that is not yet available everywhere. See: #328700 (closed)

Owners

• Team: grouprunner
• Most appropriate slack channel to reach out to: #g_runner
• Best individual to reach out to @mrincon
• PM: @DarrenEastman

Stakeholders

• @DarrenEastman

Testing Groups/Projects/Users

• @tmaczukin
• @ahanselka
• @jeffersonmartin
• @amyphillips

Expectations

What are we expecting to happen?

The UI is migrated and all features work as before.

What might happen if this goes wrong?

This feature flag can be enabled/disabled for each individual administrator. As gitlab.com admins can directly notify the grouprunner team and @mrincon we consider the rollout low risk.

What can we monitor to detect problems with this?

We can monitor UI errors in sentry:

https://sentry.gitlab.net/gitlab/gitlabcom-clientside/?query=feature_category%3Arunner

Rollout Steps

Preparation before production rollout

• Ensure that the feature MRs have been deployed to both production and canary. (Representative commit)
  • /chatops run auto_deploy status f7d288d327f4e1e4a57fa8118d69a1df40c3b747 https://gitlab.slack.com/archives/CB2S7NNDP/p1626080970121800
• Ensure that you or a representative in development can be available for at least 2 hours after feature flag updates in production. If a different developer will be covering, or an exception is needed, please inform the oncall SRE by using the @sre-oncall Slack alias.
• Ensure that documentation has been updated (More info).
• If the feature flag in code has an actor, enable it on GitLab.com for testing groups/projects.
  • @tmaczukin - /chatops run feature set --user=tomasz.admin runner_detailed_view_vue_ui true
  • @ahanselka - /chatops run feature set --user=ahanselka-admin runner_detailed_view_vue_ui true
• Verify that the feature works as expected. Posting the QA result in this issue is preferable.
• Rollout on staging.gitLab.com with testing admin users
  • /chatops run feature set runner_detailed_view_vue_ui true --staging
• Partial Rollout on other environments with testing admin users
  • @jeffersonmartin (demo env.)
  • @amyphillips (demo env.)

Global rollout on production

• Rollout on GitLab.com for a certain period
  • This feature will be enabled for 2 days prior to release.
• If the feature flag in code does NOT have an actor, perform time-based rollout (random rollout).
  • /chatops run feature set runner_detailed_view_vue_ui <rollout-percentage> There is a only a limited amount of administrators in gitlab.com, so using a percentage rollout would no create a prepresentative sample of users.
• Enable the feature globally on production environment.
  • /chatops run feature set runner_detailed_view_vue_ui true
• Announce on the feature issue an estimated time this will be enabled on GitLab.com.
• Cross-post chatops slack command to #support_gitlab-com. (more guidance when this is necessary in the dev docs) and in your team channel
• Wait for at least one day for the verification term.

(Optional) Release the feature with the feature flag

If you're still unsure whether the feature is deemed stable but want to release it in the current milestone, you can change the default state of the feature flag to be enabled. To do so, follow these steps:

• Create a merge request with the following changes. Ask for review and merge it. !65948 (merged)
  • Set the default_enabled attribute in the feature flag definition to true.
  • Create a changelog entry.
• Ensure that the above MR has been deployed to both production and canary. If the merge request was deployed before the code cutoff, the feature can be officially announced in a release blog post.
  • /chatops run auto_deploy status <merge-commit>
• Close the feature issue to indicate the feature will be released in the current milestone.

WARNING: This approach has the downside that it makes it difficult for us to clean up the flag. For example, on-premise users could disable the feature on their GitLab instance. But when you remove the flag at some point, they suddenly see the feature as enabled and they can't roll it back to the previous behavior. To avoid this potential breaking change, use this approach only for urgent matters.

Release the feature

After the feature has been deemed stable, the clean up should be done as soon as possible to permanently enable the feature and reduce complexity in the codebase.

• Create a merge request to remove runner_detailed_view_vue_ui feature flag. Ask for review and merge it.
  • spec/features/admin/admin_runners_spec.rb !65738 (merged)
  • spec/controllers/admin/runners_controller_spec.rb
  • Remove all references to the feature flag from the codebase.
  • Remove the YAML definitions for the feature from the repository.
  • Create a changelog entry.
• Ensure that the above MR has been deployed to both production and canary. If the merge request was deployed before the code cutoff, the feature can be officially announced in a release blog post.
  • /chatops run auto_deploy status <merge-commit>
• Close the feature issue to indicate the feature will be released in the current milestone.
• Clean up the feature flag from all environments by running these chatops command in #production channel:
  • /chatops run feature delete runner_detailed_view_vue_ui --dev
  • /chatops run feature delete runner_detailed_view_vue_ui --staging
  • /chatops run feature delete runner_detailed_view_vue_ui
• Close this rollout issue.

Rollback Steps

• This feature can be disabled by running the following Chatops command:

/chatops run feature set --project=gitlab-org/gitlab feature_name false