Automatic merge of gitlab-org/gitlab master

GITALY_SERVER_VERSION

-e1dd9bfe694190e9350dad37b5cd8b5ea44eafa3
+f8914b6e0da033ee251ca2f79384043d25a01ec6

app/assets/javascripts/access_tokens/components/new_access_token_app.vue

@@ -104,18 +104,13 @@ export default {
     @[$options.EVENT_ERROR]="onError"
     @[$options.EVENT_SUCCESS]="onSuccess"
   >
-    <div ref="container">
+    <div ref="container" data-testid="access-token-section" data-qa-selector="access_token_section">
       <template v-if="newToken">
-        <!-- 
-          After issue https://gitlab.com/gitlab-org/gitlab/-/issues/360921 is
-          closed remove the `initial-visibility`.
-         -->
         <input-copy-toggle-visibility
           :copy-button-title="copyButtonTitle"
           :label="label"
           :label-for="$options.tokenInputId"
           :value="newToken"
-          initial-visibility
           :form-input-group-props="formInputGroupProps"
         >
           <template #description>

app/assets/javascripts/pages/projects/hooks/index.js

 import initSearchSettings from '~/search_settings';
 import initWebhookForm from '~/webhooks';
+import { initPushEventsEditForm } from '~/webhooks/webhook';
 
 initSearchSettings();
 initWebhookForm();
+initPushEventsEditForm();

app/assets/javascripts/vue_shared/components/form/input_copy_toggle_visibility.vue

@@ -129,6 +129,8 @@ export default {
           v-gl-tooltip.hover="toggleVisibilityLabel"
           :aria-label="toggleVisibilityLabel"
           :icon="toggleVisibilityIcon"
+          data-testid="toggle-visibility-button"
+          data-qa-selector="toggle_visibility_button"
           @click.stop="handleToggleVisibilityButtonClick"
         />
         <clipboard-button

app/assets/javascripts/webhooks/components/push_events.vue

+<script>
+import { GlFormCheckbox, GlFormRadio, GlFormRadioGroup, GlFormInput, GlSprintf } from '@gitlab/ui';
+import {
+  BRANCH_FILTER_ALL_BRANCHES,
+  WILDCARD_CODE_STABLE,
+  WILDCARD_CODE_PRODUCTION,
+  REGEX_CODE,
+  descriptionText,
+} from '~/webhooks/constants';
+
+export default {
+  components: {
+    GlFormCheckbox,
+    GlFormRadio,
+    GlFormRadioGroup,
+    GlFormInput,
+    GlSprintf,
+  },
+  inject: ['pushEvents', 'strategy', 'isNewHook', 'pushEventsBranchFilter'],
+  data() {
+    return {
+      pushEventsData: !this.isNewHook && this.pushEvents,
+      branchFilterStrategyData: this.isNewHook ? BRANCH_FILTER_ALL_BRANCHES : this.strategy,
+      pushEventsBranchFilterData: this.pushEventsBranchFilter,
+    };
+  },
+  WILDCARD_CODE_STABLE,
+  WILDCARD_CODE_PRODUCTION,
+  REGEX_CODE,
+  descriptionText,
+};
+</script>
+
+<template>
+  <div>
+    <gl-form-checkbox v-model="pushEventsData">{{ s__('Webhooks|Push events') }}</gl-form-checkbox>
+    <input type="hidden" :value="pushEventsData" name="hook[push_events]" />
+
+    <div v-if="pushEventsData" class="gl-pl-6">
+      <gl-form-radio-group v-model="branchFilterStrategyData" name="hook[branch_filter_strategy]">
+        <gl-form-radio
+          class="gl-mt-2 branch-filter-strategy-radio"
+          value="all_branches"
+          data-testid="rule_all_branches"
+        >
+          <div data-qa-selector="strategy_radio_all">{{ __('All branches') }}</div>
+        </gl-form-radio>
+
+        <!-- wildcard -->
+        <gl-form-radio
+          class="gl-mt-2 branch-filter-strategy-radio"
+          value="wildcard"
+          data-testid="rule_wildcard"
+        >
+          <div data-qa-selector="strategy_radio_wildcard">
+            {{ s__('Webhooks|Wildcard pattern') }}
+          </div>
+        </gl-form-radio>
+        <div class="gl-ml-6">
+          <gl-form-input
+            v-if="branchFilterStrategyData === 'wildcard'"
+            v-model="pushEventsBranchFilterData"
+            name="hook[push_events_branch_filter]"
+            data-qa-selector="webhook_branch_filter_field"
+            data-testid="webhook_branch_filter_field"
+          />
+        </div>
+        <p
+          v-if="branchFilterStrategyData === 'wildcard'"
+          class="form-text text-muted custom-control"
+        >
+          <gl-sprintf :message="$options.descriptionText.wildcard">
+            <template #WILDCARD_CODE_STABLE>
+              <code>{{ $options.WILDCARD_CODE_STABLE }}</code>
+            </template>
+            <template #WILDCARD_CODE_PRODUCTION>
+              <code>{{ $options.WILDCARD_CODE_PRODUCTION }}</code>
+            </template>
+          </gl-sprintf>
+        </p>
+
+        <!-- regex -->
+        <gl-form-radio
+          class="gl-mt-2 branch-filter-strategy-radio"
+          value="regex"
+          data-testid="rule_regex"
+        >
+          <div data-qa-selector="strategy_radio_regex">
+            {{ s__('Webhooks|Regular expression') }}
+          </div>
+        </gl-form-radio>
+        <div class="gl-ml-6">
+          <gl-form-input
+            v-if="branchFilterStrategyData === 'regex'"
+            v-model="pushEventsBranchFilterData"
+            name="hook[push_events_branch_filter]"
+            data-qa-selector="webhook_branch_filter_field"
+            data-testid="webhook_branch_filter_field"
+          />
+        </div>
+
+        <p v-if="branchFilterStrategyData === 'regex'" class="form-text text-muted custom-control">
+          <gl-sprintf :message="$options.descriptionText.regex">
+            <template #REGEX_CODE>
+              <code>{{ $options.REGEX_CODE }}</code>
+            </template>
+          </gl-sprintf>
+        </p>
+      </gl-form-radio-group>
+    </div>
+  </div>
+</template>

app/assets/javascripts/webhooks/constants.js

+import { s__ } from '~/locale';
+
+export const BRANCH_FILTER_ALL_BRANCHES = 'all_branches';
+export const BRANCH_FILTER_WILDCARD = 'wildcard';
+export const BRANCH_FILTER_REGEX = 'regex';
+
+export const WILDCARD_CODE_STABLE = '*-stable';
+export const WILDCARD_CODE_PRODUCTION = 'production/*';
+
+export const REGEX_CODE = '(feature|hotfix)/*';
+
+export const descriptionText = {
+  [BRANCH_FILTER_WILDCARD]: s__(
+    'Webhooks|Wildcards such as %{WILDCARD_CODE_STABLE} or %{WILDCARD_CODE_PRODUCTION} are supported.',
+  ),
+  [BRANCH_FILTER_REGEX]: s__('Webhooks|Regex such as %{REGEX_CODE} is supported.'),
+};

app/assets/javascripts/webhooks/webhook.js

+import Vue from 'vue';
+import { parseBoolean } from '~/lib/utils/common_utils';
+import pushEvents from './components/push_events.vue';
+
+export function initPushEventsEditForm() {
+  const el = document.querySelector('.js-vue-push-events');
+
+  if (!el) return false;
+
+  const provide = {
+    isNewHook: parseBoolean(el.dataset.isNewHook),
+    pushEvents: parseBoolean(el.dataset.pushEvents),
+    strategy: el.dataset.strategy,
+    pushEventsBranchFilter: el.dataset.pushEventsBranchFilter,
+  };
+  return new Vue({
+    el,
+    provide,
+    render(createElement) {
+      return createElement(pushEvents);
+    },
+  });
+}

ee/app/assets/javascripts/pages/groups/hooks/index.js

 import initSearchSettings from '~/search_settings';
 import initWebhookForm from '~/webhooks';
+import { initPushEventsEditForm } from '~/webhooks/webhook';
 
 initSearchSettings();
 initWebhookForm();
+initPushEventsEditForm();

ee/spec/features/groups/hooks/user_edits_hooks_spec.rb

@@ -52,7 +52,7 @@
     it 'shows dom element for vue', :js do
       click_link('Edit')
 
-      expect(page).to have_selector('.js-vue-push-events', visible: :all)
+      expect(page).to have_content('Push events')
     end
   end
 end

ee/spec/features/groups/settings/webhooks_settings_spec.rb

@@ -108,7 +108,7 @@
           expect(page).to have_content('SSL Verification: enabled')
           expect(page).to have_content('Tag push events')
           expect(page).to have_content('Job events')
-          expect(page).to have_selector('.js-vue-push-events', visible: :all)
+          expect(page).to have_content('Push events')
         end
       end
 

locale/gitlab.pot

@@ -45418,6 +45418,12 @@ msgstr ""
 msgid "Webhooks|Push to the repository."
 msgstr ""
+msgid "Webhooks|Regex such as %{REGEX_CODE} is supported."
+msgstr ""
+
+msgid "Webhooks|Regular expression"
+msgstr ""
+
 msgid "Webhooks|Releases events"
 msgstr ""
@@ -45478,6 +45484,12 @@ msgstr ""
 msgid "Webhooks|Wiki page events"
 msgstr ""
+msgid "Webhooks|Wildcard pattern"
+msgstr ""
+
+msgid "Webhooks|Wildcards such as %{WILDCARD_CODE_STABLE} or %{WILDCARD_CODE_PRODUCTION} are supported."
+msgstr ""
+
 msgid "Website"
 msgstr ""

package.json

@@ -106,7 +106,7 @@
     "codesandbox-api": "0.0.23",
     "compression-webpack-plugin": "^5.0.2",
     "copy-webpack-plugin": "^6.4.1",
-    "core-js": "^3.25.5",
+    "core-js": "^3.26.0",
     "cron-validator": "^1.1.1",
     "cronstrue": "^1.122.0",
     "cropper": "^2.3.0",

qa/qa/page/component/access_tokens.rb

@@ -28,9 +28,14 @@ def self.included(base)
           end
 
           base.view 'app/assets/javascripts/access_tokens/components/new_access_token_app.vue' do
+            element :access_token_section
             element :created_access_token_field
           end
 
+          base.view 'app/assets/javascripts/vue_shared/components/form/input_copy_toggle_visibility.vue' do
+            element :toggle_visibility_button
+          end
+
           base.view 'app/assets/javascripts/access_tokens/components/access_token_table_app.vue' do
             element :revoke_button
           end
@@ -49,7 +54,10 @@ def click_create_token_button
         end
 
         def created_access_token
-          find_element(:created_access_token_field, wait: 30).value
+          within_element(:access_token_section) do
+            click_element(:toggle_visibility_button, wait: 30)
+            find_element(:created_access_token_field).value
+          end
         end
 
         def fill_expiry_date(date)

spec/controllers/projects/jobs_controller_spec.rb

@@ -1380,7 +1380,7 @@ def get_terminal_websocket(**extra_params)
       {
         'Channel' => {
           'Subprotocols' => ["terminal.gitlab.com"],
-          'Url' => 'wss://localhost/proxy/build/default_port/',
+          'Url' => 'wss://gitlab.example.com/proxy/build/default_port/',
           'Header' => {
             'Authorization' => [nil]
           },
@@ -1536,7 +1536,8 @@ def get_terminal_websocket(**extra_params)
       allow(Gitlab::Workhorse).to receive(:verify_api_request!).and_return(nil)
 
       expect(job.runner_session_url).to start_with('https://')
-      expect(Gitlab::Workhorse).to receive(:channel_websocket).with(a_hash_including(url: "wss://localhost/proxy/build/default_port/"))
+      expect(Gitlab::Workhorse).to receive(:channel_websocket)
+        .with(a_hash_including(url: "wss://gitlab.example.com/proxy/build/default_port/"))
 
       make_request
     end

spec/factories/ci/builds.rb

@@ -716,7 +716,7 @@
 
     trait :with_runner_session do
       after(:build) do |build|
-        build.build_runner_session(url: 'https://localhost')
+        build.build_runner_session(url: 'https://gitlab.example.com')
       end
     end
 

spec/features/admin/admin_users_impersonation_tokens_spec.rb

@@ -4,18 +4,11 @@
 
 RSpec.describe 'Admin > Users > Impersonation Tokens', :js do
   include Spec::Support::Helpers::ModalHelpers
+  include Spec::Support::Helpers::AccessTokenHelpers
 
   let(:admin) { create(:admin) }
   let!(:user) { create(:user) }
 
-  def active_impersonation_tokens
-    find("[data-testid='active-tokens']")
-  end
-
-  def created_impersonation_token
-    find_field('new-access-token').value
-  end
-
   before do
     sign_in(admin)
     gitlab_enable_admin_mode_sign_in(admin)
@@ -39,12 +32,12 @@ def created_impersonation_token
 
       click_on "Create impersonation token"
 
-      expect(active_impersonation_tokens).to have_text(name)
-      expect(active_impersonation_tokens).to have_text('in')
-      expect(active_impersonation_tokens).to have_text('read_api')
-      expect(active_impersonation_tokens).to have_text('read_user')
+      expect(active_access_tokens).to have_text(name)
+      expect(active_access_tokens).to have_text('in')
+      expect(active_access_tokens).to have_text('read_api')
+      expect(active_access_tokens).to have_text('read_user')
       expect(PersonalAccessTokensFinder.new(impersonation: true).execute.count).to equal(1)
-      expect(created_impersonation_token).not_to be_empty
+      expect(created_access_token).to match(/[\w-]{20}/)
     end
   end
 
@@ -55,16 +48,16 @@ def created_impersonation_token
     it 'only shows impersonation tokens' do
       visit admin_user_impersonation_tokens_path(user_id: user.username)
 
-      expect(active_impersonation_tokens).to have_text(impersonation_token.name)
-      expect(active_impersonation_tokens).not_to have_text(personal_access_token.name)
-      expect(active_impersonation_tokens).to have_text('in')
+      expect(active_access_tokens).to have_text(impersonation_token.name)
+      expect(active_access_tokens).not_to have_text(personal_access_token.name)
+      expect(active_access_tokens).to have_text('in')
     end
 
     it 'shows absolute times' do
       admin.update!(time_display_relative: false)
       visit admin_user_impersonation_tokens_path(user_id: user.username)
 
-      expect(active_impersonation_tokens).to have_text(personal_access_token.expires_at.strftime('%b %-d'))
+      expect(active_access_tokens).to have_text(personal_access_token.expires_at.strftime('%b %-d'))
     end
   end
 
@@ -76,7 +69,7 @@ def created_impersonation_token
 
       accept_gl_confirm(button_text: 'Revoke') { click_on "Revoke" }
 
-      expect(active_impersonation_tokens).to have_text("This user has no active impersonation tokens.")
+      expect(active_access_tokens).to have_text("This user has no active impersonation tokens.")
     end
 
     it "removes expired tokens from 'active' section" do
@@ -84,7 +77,7 @@ def created_impersonation_token
 
       visit admin_user_impersonation_tokens_path(user_id: user.username)
 
-      expect(active_impersonation_tokens).to have_text("This user has no active impersonation tokens.")
+      expect(active_access_tokens).to have_text("This user has no active impersonation tokens.")
     end
   end
 

spec/features/profiles/personal_access_tokens_spec.rb

@@ -4,22 +4,11 @@
 
 RSpec.describe 'Profile > Personal Access Tokens', :js do
   include Spec::Support::Helpers::ModalHelpers
+  include Spec::Support::Helpers::AccessTokenHelpers
 
   let(:user) { create(:user) }
   let(:pat_create_service) { double('PersonalAccessTokens::CreateService', execute: ServiceResponse.error(message: 'error', payload: { personal_access_token: PersonalAccessToken.new })) }
 
-  def active_personal_access_tokens
-    find("[data-testid='active-tokens']")
-  end
-
-  def created_personal_access_token
-    find_field('new-access-token').value
-  end
-
-  def feed_token_description
-    "Your feed token authenticates you when your RSS reader loads a personalized RSS feed or when your calendar application loads a personalized calendar. It is visible in those feed URLs."
-  end
-
   before do
     sign_in(user)
   end
@@ -43,11 +32,11 @@ def feed_token_description
       click_on "Create personal access token"
       wait_for_all_requests
 
-      expect(active_personal_access_tokens).to have_text(name)
-      expect(active_personal_access_tokens).to have_text('in')
-      expect(active_personal_access_tokens).to have_text('read_api')
-      expect(active_personal_access_tokens).to have_text('read_user')
-      expect(created_personal_access_token).not_to be_empty
+      expect(active_access_tokens).to have_text(name)
+      expect(active_access_tokens).to have_text('in')
+      expect(active_access_tokens).to have_text('read_api')
+      expect(active_access_tokens).to have_text('read_user')
+      expect(created_access_token).to match(/[\w-]{20}/)
     end
 
     context "when creation fails" do
@@ -73,8 +62,8 @@ def feed_token_description
     it 'only shows personal access tokens' do
       visit profile_personal_access_tokens_path
 
-      expect(active_personal_access_tokens).to have_text(personal_access_token.name)
-      expect(active_personal_access_tokens).not_to have_text(impersonation_token.name)
+      expect(active_access_tokens).to have_text(personal_access_token.name)
+      expect(active_access_tokens).not_to have_text(impersonation_token.name)
     end
 
     context 'when User#time_display_relative is false' do
@@ -85,7 +74,7 @@ def feed_token_description
       it 'shows absolute times for expires_at' do
         visit profile_personal_access_tokens_path
 
-        expect(active_personal_access_tokens).to have_text(PersonalAccessToken.last.expires_at.strftime('%b %-d'))
+        expect(active_access_tokens).to have_text(PersonalAccessToken.last.expires_at.strftime('%b %-d'))
       end
     end
   end
@@ -97,14 +86,14 @@ def feed_token_description
       visit profile_personal_access_tokens_path
       accept_gl_confirm(button_text: 'Revoke') { click_on "Revoke" }
 
-      expect(active_personal_access_tokens).to have_text("This user has no active personal access tokens.")
+      expect(active_access_tokens).to have_text("This user has no active personal access tokens.")
     end
 
     it "removes expired tokens from 'active' section" do
       personal_access_token.update!(expires_at: 5.days.ago)
       visit profile_personal_access_tokens_path
 
-      expect(active_personal_access_tokens).to have_text("This user has no active personal access tokens.")
+      expect(active_access_tokens).to have_text("This user has no active personal access tokens.")
     end
 
     context "when revocation fails" do
@@ -115,12 +104,16 @@ def feed_token_description
         visit profile_personal_access_tokens_path
 
         accept_gl_confirm(button_text: "Revoke") { click_on "Revoke" }
-        expect(active_personal_access_tokens).to have_text(personal_access_token.name)
+        expect(active_access_tokens).to have_text(personal_access_token.name)
       end
     end
   end
 
   describe "feed token" do
+    def feed_token_description
+      "Your feed token authenticates you when your RSS reader loads a personalized RSS feed or when your calendar application loads a personalized calendar. It is visible in those feed URLs."
+    end
+
     context "when enabled" do
       it "displays feed token" do
         allow(Gitlab::CurrentSettings).to receive(:disable_feed_token).and_return(false)

spec/features/projects/settings/webhooks_settings_spec.rb

@@ -87,7 +87,7 @@
           expect(page).to have_content('SSL Verification: enabled')
           expect(page).to have_content('Tag push events')
           expect(page).to have_content('Job events')
-          expect(page).to have_selector('.js-vue-push-events', visible: :all)
+          expect(page).to have_content('Push events')
         end
       end
 

spec/frontend/access_tokens/components/new_access_token_app_spec.js

@@ -73,7 +73,6 @@ describe('~/access_tokens/components/new_access_token_app', () => {
       expect(InputCopyToggleVisibilityComponent.props('copyButtonTitle')).toBe(
         sprintf(__('Copy %{accessTokenType}'), { accessTokenType }),
       );
-      expect(InputCopyToggleVisibilityComponent.props('initialVisibility')).toBe(true);
       expect(InputCopyToggleVisibilityComponent.attributes('label')).toBe(
         sprintf(__('Your new %{accessTokenType}'), { accessTokenType }),
       );

spec/frontend/webhooks/components/__snapshots__/push_events_spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Webhook push events form editor component Different push events rules when editing existing hook with "all_branches" strategy selected 1`] = `
+<gl-form-radio-group-stub
+  checked="all_branches"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+</gl-form-radio-group-stub>
+`;
+
+exports[`Webhook push events form editor component Different push events rules when editing existing hook with "regex" strategy selected 1`] = `
+<gl-form-radio-group-stub
+  checked="regex"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <gl-form-input-stub
+      data-qa-selector="webhook_branch_filter_field"
+      data-testid="webhook_branch_filter_field"
+      name="hook[push_events_branch_filter]"
+      value="foo"
+    />
+  </div>
+   
+  <p
+    class="form-text text-muted custom-control"
+  >
+    <gl-sprintf-stub
+      message="Regex such as %{REGEX_CODE} is supported."
+    />
+  </p>
+</gl-form-radio-group-stub>
+`;
+
+exports[`Webhook push events form editor component Different push events rules when editing existing hook with "wildcard" strategy selected 1`] = `
+<gl-form-radio-group-stub
+  checked="wildcard"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <gl-form-input-stub
+      data-qa-selector="webhook_branch_filter_field"
+      data-testid="webhook_branch_filter_field"
+      name="hook[push_events_branch_filter]"
+      value="foo"
+    />
+  </div>
+   
+  <p
+    class="form-text text-muted custom-control"
+  >
+    <gl-sprintf-stub
+      message="Wildcards such as %{WILDCARD_CODE_STABLE} or %{WILDCARD_CODE_PRODUCTION} are supported."
+    />
+  </p>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+</gl-form-radio-group-stub>
+`;
+
+exports[`Webhook push events form editor component Different push events rules when editing new hook all_branches should be selected by default 1`] = `
+<gl-form-radio-group-stub
+  checked="all_branches"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+</gl-form-radio-group-stub>
+`;
+
+exports[`Webhook push events form editor component Different push events rules when editing new hook should be able to set regex rule 1`] = `
+<gl-form-radio-group-stub
+  checked="regex"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <gl-form-input-stub
+      data-qa-selector="webhook_branch_filter_field"
+      data-testid="webhook_branch_filter_field"
+      name="hook[push_events_branch_filter]"
+      value=""
+    />
+  </div>
+   
+  <p
+    class="form-text text-muted custom-control"
+  >
+    <gl-sprintf-stub
+      message="Regex such as %{REGEX_CODE} is supported."
+    />
+  </p>
+</gl-form-radio-group-stub>
+`;
+
+exports[`Webhook push events form editor component Different push events rules when editing new hook should be able to set wildcard rule 1`] = `
+<gl-form-radio-group-stub
+  checked="wildcard"
+  disabledfield="disabled"
+  htmlfield="html"
+  name="hook[branch_filter_strategy]"
+  options=""
+  textfield="text"
+  valuefield="value"
+>
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_all_branches"
+    value="all_branches"
+  >
+    <div
+      data-qa-selector="strategy_radio_all"
+    >
+      All branches
+    </div>
+  </gl-form-radio-stub>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_wildcard"
+    value="wildcard"
+  >
+    <div
+      data-qa-selector="strategy_radio_wildcard"
+    >
+      
+          Wildcard pattern
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <gl-form-input-stub
+      data-qa-selector="webhook_branch_filter_field"
+      data-testid="webhook_branch_filter_field"
+      name="hook[push_events_branch_filter]"
+      value=""
+    />
+  </div>
+   
+  <p
+    class="form-text text-muted custom-control"
+  >
+    <gl-sprintf-stub
+      message="Wildcards such as %{WILDCARD_CODE_STABLE} or %{WILDCARD_CODE_PRODUCTION} are supported."
+    />
+  </p>
+   
+  <gl-form-radio-stub
+    class="gl-mt-2 branch-filter-strategy-radio"
+    data-testid="rule_regex"
+    value="regex"
+  >
+    <div
+      data-qa-selector="strategy_radio_regex"
+    >
+      
+          Regular expression
+        
+    </div>
+  </gl-form-radio-stub>
+   
+  <div
+    class="gl-ml-6"
+  >
+    <!---->
+  </div>
+   
+  <!---->
+</gl-form-radio-group-stub>
+`;