Install two versions of Sentry Client SDK

What does this MR do and why?

This MR is a follow up to !102650 (merged).

It installs two versions of the Sentry browser SDK so we can toggle reporting errors to two a new Sentry instance:

• Disabled feature flag: Use Sentry SDK v5 and report to the Sentry v9 DSN in the config (gitlab.yml)
• Enabled feature flag: Use Sentry SDK v7 and report to the Sentry v22+ DSN in the settings (Admin UI values)

Note

20+ files changed! Wow!

Yes, I've had to change many files but most of the lines changes are small changes

• Move current sentry js files to have a legacy_ prefix and add the new ones
• Add the new Sentry 7 dependency with an alias, which leads to a few changes in webpack and jest config.
• A few repetitive specs for the feature flag state checks.

I've split this change into different MRs, but this last one is the largest one:

Remove unusable Sentry feature flag (!104231 - merged)
Move and rename Sentry constants (!104247 - merged)
Install two versions of Sentry Client SDK (!102790 - merged)	you are here

Use case

This rollout is enabled by having two sets of Sentry settings in our gitlab instance at once, the GitLab instance config (from gitlab.yml) and the settings (the UI). A rollout could consist of:

1. Ensure the Sentry config (e.g. in gitabl.yml) is present for the old Sentry instance (v9).
2. Enable configure_sentry_in_application_settings the enable Admin UI Sentry settings.
3. Visit /admin/application_settings/metrics_and_profiling to configure the Sentry settings for the new Sentry instance.
4. Progressive rollout of enable_new_sentry_clientside_integration to users. Users with the feature flag enabled will begin reporting to the new instance.
   • The recommended rollout method is percentage: 5%, 10%, ...
5. Once the rollout is complete, remove the dangling dependencies and remove this feature flag.

Screenshots or screen recordings

Errors appear to be reported the new Sentry instance:

How to set up and validate locally

1. Check out this branch and install run yarn.

2. This MR installs two versions of the Sentry Browser GDK, so we should test two integrations:

Legacy Integration

1. Ensure the feature flag for the new integration is disabled Feature.disable(:enable_new_sentry_clientside_integration)

2. Add Sentry (v9) DSN in gitlab.yml:

  ## Error Reporting and Logging with Sentry
  sentry:
    enabled: true
    dsn: https://XXXX@sentry.gitlab.net/1
    clientside_dsn: https://XXXX@sentry.gitlab.net/1
    environment: 'development'

3. Confirm events are captured by the old Sentry instance

New integration

1. Enable the feature flags to enable the new integration and the UI settings panel:

   • Feature.enable(:enable_new_sentry_clientside_integration)
   • Feature.enable(:configure_sentry_in_application_settings)

2. Setup the Sentry (newer version) DSN at: http://gdk.test:3000/admin/application_settings/metrics_and_profiling

3. Confirm events are captured by the new Sentry instance

Simulate triggering an error

To ensure I can trigger an error consistently, I added a mock button in `/admin/runners`.

diff --git a/app/assets/javascripts/ci/runner/admin_runners/admin_runners_app.vue b/app/assets/javascripts/ci/runner/admin_runners/admin_runners_app.vue
index 2915e4600855..fd04e7b3e4e1 100644
--- a/app/assets/javascripts/ci/runner/admin_runners/admin_runners_app.vue
+++ b/app/assets/javascripts/ci/runner/admin_runners/admin_runners_app.vue
@@ -1,4 +1,5 @@
 <script>
+import * as Sentry from '@sentry/browser';
 import { GlLink } from '@gitlab/ui';
 import { createAlert } from '~/flash';
 import { updateHistory } from '~/lib/utils/url_utility';
@@ -152,6 +153,9 @@ export default {
     onPaginationInput(value) {
       this.search.pagination = value;
     },
+    reportError() {
+      Sentry.captureException(new Error('test error'));
+    },
   },
   filteredSearchNamespace: ADMIN_FILTERED_SEARCH_NAMESPACE,
   INSTANCE_TYPE,
@@ -160,6 +164,7 @@ export default {
 </script>
 <template>
   <div>
+    <gl-link @click="reportError">Report Error Here!</gl-link>
     <div
       class="gl-display-flex gl-align-items-center gl-flex-direction-column-reverse gl-md-flex-direction-row gl-mt-3 gl-md-mt-0"
     >

After I visit http://gdk.test:3000/admin/runners to report an error on each click.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

.gitlab/ci/review-apps/main.gitlab-ci.yml

@@ -32,14 +32,15 @@ review-build-cng-env:
   extends:
     - .default-retry
     - .review:rules:review-build-cng
-  image: ${GITLAB_DEPENDENCY_PROXY_ADDRESS}ruby:3.0-alpine3.13
+  image: ${REGISTRY_HOST}/${REGISTRY_GROUP}/gitlab-build-images/debian-${DEBIAN_VERSION}-ruby-${RUBY_VERSION}:bundler-2.3
   stage: prepare
   needs: []
   before_script:
     - source ./scripts/utils.sh
     - install_gitlab_gem
   script:
-    - 'ruby -r./scripts/trigger-build.rb -e "puts Trigger.variables_for_env_file(Trigger::CNG.new.variables)" > build.env'
+    - ruby -r./scripts/trigger-build.rb -e "puts Trigger.variables_for_env_file(Trigger::CNG.new.variables)" > build.env
+    - ruby -e 'puts "FULL_RUBY_VERSION=#{RUBY_VERSION}"' >> build.env
     - cat build.env
   artifacts:
     reports:
@@ -77,6 +78,7 @@ review-build-cng:
     GITLAB_SHELL_VERSION: "${GITLAB_SHELL_VERSION}"
     GITLAB_WORKHORSE_VERSION: "${GITLAB_WORKHORSE_VERSION}"
     GITALY_SERVER_VERSION: "${GITALY_SERVER_VERSION}"
+    RUBY_VERSION: "${FULL_RUBY_VERSION}"
   trigger:
     project: gitlab-org/build/CNG-mirror
     branch: $TRIGGER_BRANCH
@@ -89,7 +91,7 @@ review-build-cng:
   variables:
     HOST_SUFFIX: "${CI_ENVIRONMENT_SLUG}"
     DOMAIN: "-${CI_ENVIRONMENT_SLUG}.${REVIEW_APPS_DOMAIN}"
-    GITLAB_HELM_CHART_REF: "138c146a5ba787942f66d4c7d795d224d6ba206a"
+    GITLAB_HELM_CHART_REF: "ed813953079c1d81aa69d4cb8171c69aa9741f01"  # 6.5.4: https://gitlab.com/gitlab-org/charts/gitlab/-/commit/ed813953079c1d81aa69d4cb8171c69aa9741f01
   environment:
     name: review/${CI_COMMIT_REF_SLUG}${SCHEDULE_TYPE}  # No separator for SCHEDULE_TYPE so it's compatible as before and looks nice without it
     url: https://gitlab-${CI_ENVIRONMENT_SLUG}.${REVIEW_APPS_DOMAIN}
@@ -118,7 +120,7 @@ review-deploy:
     - run_timed_command "download_chart"
     - run_timed_command "deploy" || (display_deployment_debug && exit 1)
     - run_timed_command "verify_deploy"|| (display_deployment_debug && exit 1)
-    - run_timed_command "disable_sign_ups" || (delete_release && exit 1)
+    - run_timed_command "disable_sign_ups"
   after_script:
     # Run seed-dast-test-data.sh only when DAST_RUN is set to true. This is to pupulate review app with data for DAST scan.
     # Set DAST_RUN to true when jobs are manually scheduled.
@@ -166,7 +168,7 @@ review-delete-deployment:
     - .review:rules:review-delete-deployment
   stage: prepare
   script:
-    - delete_release
+    - delete_helm_release
 
 review-stop:
   extends:
@@ -176,4 +178,4 @@ review-stop:
   stage: deploy
   needs: []
   script:
-    - delete_namespace
+    - delete_helm_release