Add latest changes from gitlab-org/gitlab@master

1 files changed, 55 insertions, 2 deletions

diff --git a/spec/frontend/integrations/index/components/integrations_table_spec.js b/spec/frontend/integrations/index/components/integrations_table_spec.js
index bfe0a5987b4..976c7b74890 100644
--- a/spec/frontend/integrations/index/components/integrations_table_spec.js
+++ b/spec/frontend/integrations/index/components/integrations_table_spec.js
@@ -1,5 +1,6 @@
-import { GlTable, GlIcon } from '@gitlab/ui';
+import { GlTable, GlIcon, GlLink } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
+import { INTEGRATION_TYPE_SLACK } from '~/integrations/constants';
 import IntegrationsTable from '~/integrations/index/components/integrations_table.vue';
 import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
 
@@ -10,12 +11,17 @@ describe('IntegrationsTable', () => {
 
   const findTable = () => wrapper.findComponent(GlTable);
 
-  const createComponent = (propsData = {}) => {
+  const createComponent = (propsData = {}, flagIsOn = false) => {
     wrapper = mount(IntegrationsTable, {
       propsData: {
         integrations: mockActiveIntegrations,
         ...propsData,
       },
+      provide: {
+        glFeatures: {
+          integrationSlackAppNotifications: flagIsOn,
+        },
+      },
     });
   };
 
@@ -50,4 +56,51 @@ describe('IntegrationsTable', () => {
       expect(findTable().findComponent(GlIcon).exists()).toBe(shouldRenderActiveIcon);
     });
   });
+
+  describe('integrations filtering', () => {
+    const slackActive = {
+      ...mockActiveIntegrations[0],
+      name: INTEGRATION_TYPE_SLACK,
+      title: 'Slack',
+    };
+    const slackInactive = {
+      ...mockInactiveIntegrations[0],
+      name: INTEGRATION_TYPE_SLACK,
+      title: 'Slack',
+    };
+
+    describe.each`
+      desc                                         | flagIsOn | integrations                                                               | expectedIntegrations
+      ${'only active'}                             | ${false} | ${mockActiveIntegrations}                                                  | ${mockActiveIntegrations}
+      ${'only active'}                             | ${true}  | ${mockActiveIntegrations}                                                  | ${mockActiveIntegrations}
+      ${'only inactive'}                           | ${true}  | ${mockInactiveIntegrations}                                                | ${mockInactiveIntegrations}
+      ${'only inactive'}                           | ${false} | ${mockInactiveIntegrations}                                                | ${mockInactiveIntegrations}
+      ${'active and inactive'}                     | ${true}  | ${[...mockActiveIntegrations, ...mockInactiveIntegrations]}                | ${[...mockActiveIntegrations, ...mockInactiveIntegrations]}
+      ${'active and inactive'}                     | ${false} | ${[...mockActiveIntegrations, ...mockInactiveIntegrations]}                | ${[...mockActiveIntegrations, ...mockInactiveIntegrations]}
+      ${'Slack active with active'}                | ${false} | ${[slackActive, ...mockActiveIntegrations]}                                | ${[slackActive, ...mockActiveIntegrations]}
+      ${'Slack active with active'}                | ${true}  | ${[slackActive, ...mockActiveIntegrations]}                                | ${[slackActive, ...mockActiveIntegrations]}
+      ${'Slack active with inactive'}              | ${false} | ${[slackActive, ...mockInactiveIntegrations]}                              | ${[slackActive, ...mockInactiveIntegrations]}
+      ${'Slack active with inactive'}              | ${true}  | ${[slackActive, ...mockInactiveIntegrations]}                              | ${[slackActive, ...mockInactiveIntegrations]}
+      ${'Slack inactive with active'}              | ${false} | ${[slackInactive, ...mockActiveIntegrations]}                              | ${[slackInactive, ...mockActiveIntegrations]}
+      ${'Slack inactive with active'}              | ${true}  | ${[slackInactive, ...mockActiveIntegrations]}                              | ${mockActiveIntegrations}
+      ${'Slack inactive with inactive'}            | ${false} | ${[slackInactive, ...mockInactiveIntegrations]}                            | ${[slackInactive, ...mockInactiveIntegrations]}
+      ${'Slack inactive with inactive'}            | ${true}  | ${[slackInactive, ...mockInactiveIntegrations]}                            | ${mockInactiveIntegrations}
+      ${'Slack active with active and inactive'}   | ${true}  | ${[slackActive, ...mockActiveIntegrations, ...mockInactiveIntegrations]}   | ${[slackActive, ...mockActiveIntegrations, ...mockInactiveIntegrations]}
+      ${'Slack active with active and inactive'}   | ${false} | ${[slackActive, ...mockActiveIntegrations, ...mockInactiveIntegrations]}   | ${[slackActive, ...mockActiveIntegrations, ...mockInactiveIntegrations]}
+      ${'Slack inactive with active and inactive'} | ${true}  | ${[slackInactive, ...mockActiveIntegrations, ...mockInactiveIntegrations]} | ${[...mockActiveIntegrations, ...mockInactiveIntegrations]}
+      ${'Slack inactive with active and inactive'} | ${false} | ${[slackInactive, ...mockActiveIntegrations, ...mockInactiveIntegrations]} | ${[slackInactive, ...mockActiveIntegrations, ...mockInactiveIntegrations]}
+    `('when $desc and flag "$flagIsOn"', ({ flagIsOn, integrations, expectedIntegrations }) => {
+      beforeEach(() => {
+        createComponent({ integrations }, flagIsOn);
+      });
+
+      it('renders correctly', () => {
+        const links = wrapper.findAllComponents(GlLink);
+        expect(links).toHaveLength(expectedIntegrations.length);
+        expectedIntegrations.forEach((integration, index) => {
+          expect(links.at(index).text()).toBe(integration.title);
+        });
+      });
+    });
+  });
 });