1 files changed, 22 insertions, 15 deletions

diff --git a/spec/frontend/projects/settings/repository/branch_rules/components/branch_rule_spec.js b/spec/frontend/projects/settings/repository/branch_rules/components/branch_rule_spec.js
index 2bc705f538b..2aa93fd0e28 100644
--- a/spec/frontend/projects/settings/repository/branch_rules/components/branch_rule_spec.js
+++ b/spec/frontend/projects/settings/repository/branch_rules/components/branch_rule_spec.js
@@ -2,7 +2,12 @@ import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import BranchRule, {
   i18n,
 } from '~/projects/settings/repository/branch_rules/components/branch_rule.vue';
-import { branchRuleProvideMock, branchRulePropsMock } from '../mock_data';
+import { sprintf, n__ } from '~/locale';
+import {
+  branchRuleProvideMock,
+  branchRulePropsMock,
+  branchRuleWithoutDetailsPropsMock,
+} from '../mock_data';
 
 describe('Branch rule', () => {
   let wrapper;
@@ -15,7 +20,6 @@ describe('Branch rule', () => {
   };
 
   const findDefaultBadge = () => wrapper.findByText(i18n.defaultLabel);
-  const findProtectedBadge = () => wrapper.findByText(i18n.protectedLabel);
   const findBranchName = () => wrapper.findByText(branchRulePropsMock.name);
   const findProtectionDetailsList = () => wrapper.findByRole('list');
   const findProtectionDetailsListItems = () => wrapper.findAllByRole('listitem');
@@ -28,33 +32,36 @@ describe('Branch rule', () => {
   });
 
   describe('badges', () => {
-    it('renders both default and protected badges', () => {
+    it('renders default badge', () => {
       expect(findDefaultBadge().exists()).toBe(true);
-      expect(findProtectedBadge().exists()).toBe(true);
     });
 
     it('does not render default badge if isDefault is set to false', () => {
       createComponent({ isDefault: false });
       expect(findDefaultBadge().exists()).toBe(false);
     });
-
-    it('does not render protected badge if isProtected is set to false', () => {
-      createComponent({ isProtected: false });
-      expect(findProtectedBadge().exists()).toBe(false);
-    });
   });
 
-  it('does not render the protection details list of no details are present', () => {
-    createComponent({ approvalDetails: null });
+  it('does not render the protection details list if no details are present', () => {
+    createComponent(branchRuleWithoutDetailsPropsMock);
     expect(findProtectionDetailsList().exists()).toBe(false);
   });
 
   it('renders the protection details list items', () => {
-    expect(findProtectionDetailsListItems().at(0).text()).toBe(
-      branchRulePropsMock.approvalDetails[0],
+    expect(findProtectionDetailsListItems()).toHaveLength(wrapper.vm.approvalDetails.length);
+    expect(findProtectionDetailsListItems().at(0).text()).toBe(i18n.allowForcePush);
+    expect(findProtectionDetailsListItems().at(1).text()).toBe(i18n.codeOwnerApprovalRequired);
+    expect(findProtectionDetailsListItems().at(2).text()).toMatchInterpolatedText(
+      sprintf(i18n.statusChecks, {
+        total: branchRulePropsMock.statusChecksTotal,
+        subject: n__('check', 'checks', branchRulePropsMock.statusChecksTotal),
+      }),
     );
-    expect(findProtectionDetailsListItems().at(1).text()).toBe(
-      branchRulePropsMock.approvalDetails[1],
+    expect(findProtectionDetailsListItems().at(3).text()).toMatchInterpolatedText(
+      sprintf(i18n.approvalRules, {
+        total: branchRulePropsMock.approvalRulesTotal,
+        subject: n__('rule', 'rules', branchRulePropsMock.approvalRulesTotal),
+      }),
     );
   });