1 files changed, 20 insertions, 1 deletions
diff --git a/spec/frontend/projects/settings/access_dropdown_spec.js b/spec/frontend/projects/settings/access_dropdown_spec.js
index 3b375c5610f..41b9c0c3763 100644
--- a/spec/frontend/projects/settings/access_dropdown_spec.js
+++ b/spec/frontend/projects/settings/access_dropdown_spec.js
@@ -14,6 +14,7 @@ describe('AccessDropdown', () => {
     `);
     const $dropdown = $('#dummy-dropdown');
     $dropdown.data('defaultLabel', defaultLabel);
+    gon.features = { deployKeysOnProtectedBranches: true };
     const options = {
       $dropdown,
       accessLevelsData: {
@@ -37,6 +38,9 @@ describe('AccessDropdown', () => {
       { type: LEVEL_TYPES.GROUP },
       { type: LEVEL_TYPES.GROUP },
       { type: LEVEL_TYPES.GROUP },
+      { type: LEVEL_TYPES.DEPLOY_KEY },
+      { type: LEVEL_TYPES.DEPLOY_KEY },
+      { type: LEVEL_TYPES.DEPLOY_KEY },
     ];
 
     beforeEach(() => {
@@ -49,7 +53,7 @@ describe('AccessDropdown', () => {
 
       const label = dropdown.toggleLabel();
 
-      expect(label).toBe('1 role, 2 users, 3 groups');
+      expect(label).toBe('1 role, 2 users, 3 deploy keys, 3 groups');
       expect($dropdownToggleText).not.toHaveClass('is-default');
     });
 
@@ -122,6 +126,21 @@ describe('AccessDropdown', () => {
         expect($dropdownToggleText).not.toHaveClass('is-default');
       });
     });
+
+    describe('with users and deploy keys', () => {
+      beforeEach(() => {
+        const selectedTypes = [LEVEL_TYPES.DEPLOY_KEY, LEVEL_TYPES.USER];
+        dropdown.setSelectedItems(dummyItems.filter(item => selectedTypes.includes(item.type)));
+        $dropdownToggleText.addClass('is-default');
+      });
+
+      it('displays number of deploy keys', () => {
+        const label = dropdown.toggleLabel();
+
+        expect(label).toBe('2 users, 3 deploy keys');
+        expect($dropdownToggleText).not.toHaveClass('is-default');
+      });
+    });
   });
 
   describe('userRowHtml', () => {