Commit 4a29e7c1 authored by Savas Vedova's avatar Savas Vedova

Merge branch '346596-sync-active-tabs-sec-config' into 'master'

Add active sync to security configuration tab

See merge request gitlab-org/gitlab!77178
parents e501c9af a41a51f7
......@@ -160,8 +160,12 @@ export default {
</template>
</user-callout-dismisser>
<gl-tabs content-class="gl-pt-0">
<gl-tab data-testid="security-testing-tab" :title="$options.i18n.securityTesting">
<gl-tabs content-class="gl-pt-0" sync-active-tab-with-query-params>
<gl-tab
data-testid="security-testing-tab"
:title="$options.i18n.securityTesting"
query-param-value="security-testing"
>
<auto-dev-ops-enabled-alert
v-if="shouldShowAutoDevopsEnabledAlert"
class="gl-mt-3"
......@@ -203,7 +207,11 @@ export default {
</template>
</section-layout>
</gl-tab>
<gl-tab data-testid="compliance-testing-tab" :title="$options.i18n.compliance">
<gl-tab
data-testid="compliance-testing-tab"
:title="$options.i18n.compliance"
query-param-value="compliance-testing"
>
<section-layout :heading="$options.i18n.compliance">
<template #description>
<p>
......@@ -241,6 +249,7 @@ export default {
v-if="glFeatures.secureVulnerabilityTraining"
data-testid="vulnerability-management-tab"
:title="$options.i18n.vulnerabilityManagement"
query-param-value="vulnerability-management"
>
<section-layout :heading="$options.i18n.securityTraining">
<template #features>
......
import { GlTab } from '@gitlab/ui';
import { GlTab, GlTabs } from '@gitlab/ui';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';
import { useLocalStorageSpy } from 'helpers/local_storage_helper';
......@@ -77,6 +77,7 @@ describe('App component', () => {
const findMainHeading = () => wrapper.find('h1');
const findTab = () => wrapper.findComponent(GlTab);
const findTabs = () => wrapper.findAllComponents(GlTab);
const findGlTabs = () => wrapper.findComponent(GlTabs);
const findByTestId = (id) => wrapper.findByTestId(id);
const findFeatureCards = () => wrapper.findAllComponents(FeatureCard);
const findTrainingProviderList = () => wrapper.findComponent(TrainingProviderList);
......@@ -154,6 +155,10 @@ describe('App component', () => {
expect(findTab().exists()).toBe(true);
});
it('passes the `sync-active-tab-with-query-params` prop', () => {
expect(findGlTabs().props('syncActiveTabWithQueryParams')).toBe(true);
});
it('renders correct amount of tabs', () => {
expect(findTabs()).toHaveLength(expectedTabs.length);
});
......@@ -161,6 +166,10 @@ describe('App component', () => {
it.each(expectedTabs)('renders the %s tab', (tabName) => {
expect(findByTestId(`${tabName}-tab`).exists()).toBe(true);
});
it.each(expectedTabs)('has the %s query-param-value', (tabName) => {
expect(findByTestId(`${tabName}-tab`).props('queryParamValue')).toBe(tabName);
});
});
it('renders right amount of feature cards for given props with correct props', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment