From 92d6e517e4ae1fb5ec84efd014932bcb55d87baf Mon Sep 17 00:00:00 2001
From: David Pisek <dpisek@gitlab.com>
Date: Fri, 24 Dec 2021 13:35:03 +0000
Subject: [PATCH] Update security configuration tabs to utilize lazy loading
---
.../javascripts/security_configuration/components/app.vue | 2 +-
spec/frontend/security_configuration/components/app_spec.js | 4 ++++
2 files changed, 5 insertions(+), 1 deletion(-)
diff --git a/app/assets/javascripts/security_configuration/components/app.vue b/app/assets/javascripts/security_configuration/components/app.vue
index 10c677a3721f..4a6ea11d7c3e 100644
--- a/app/assets/javascripts/security_configuration/components/app.vue
+++ b/app/assets/javascripts/security_configuration/components/app.vue
@@ -160,7 +160,7 @@ export default {
</template>
</user-callout-dismisser>
- <gl-tabs content-class="gl-pt-0" sync-active-tab-with-query-params>
+ <gl-tabs content-class="gl-pt-0" sync-active-tab-with-query-params lazy>
<gl-tab
data-testid="security-testing-tab"
:title="$options.i18n.securityTesting"
diff --git a/spec/frontend/security_configuration/components/app_spec.js b/spec/frontend/security_configuration/components/app_spec.js
index f123352d7815..e4b83aa68da2 100644
--- a/spec/frontend/security_configuration/components/app_spec.js
+++ b/spec/frontend/security_configuration/components/app_spec.js
@@ -159,6 +159,10 @@ describe('App component', () => {
expect(findGlTabs().props('syncActiveTabWithQueryParams')).toBe(true);
});
+ it('lazy loads each tab', () => {
+ expect(findGlTabs().attributes('lazy')).not.toBe(undefined);
+ });
+
it('renders correct amount of tabs', () => {
expect(findTabs()).toHaveLength(expectedTabs.length);
});
--
GitLab