diff --git a/app/assets/javascripts/security_configuration/components/app.vue b/app/assets/javascripts/security_configuration/components/app.vue index 866148596e38122753d798e9db5c316cf85c92cd..d0c4ad3646cc85f513fb553d389b31ed0713104b 100644 --- a/app/assets/javascripts/security_configuration/components/app.vue +++ b/app/assets/javascripts/security_configuration/components/app.vue @@ -57,6 +57,9 @@ export default { update({ currentLicense }) { return currentLicense?.plan; }, + error() { + this.hasCurrentLicenseFetchError = true; + }, }, }, props: { @@ -99,6 +102,7 @@ export default { autoDevopsEnabledAlertDismissedProjects: [], errorMessage: '', currentLicensePlan: '', + hasCurrentLicenseFetchError: false, }; }, computed: { @@ -120,7 +124,10 @@ export default { ); }, shouldShowVulnerabilityManagementTab() { - return this.currentLicensePlan === LICENSE_ULTIMATE; + // if the query fails (if the plan is `null` also means an error has occurred) we still want to show the feature + const hasQueryError = this.hasCurrentLicenseFetchError || this.currentLicensePlan === null; + + return hasQueryError || this.currentLicensePlan === LICENSE_ULTIMATE; }, }, methods: { diff --git a/spec/frontend/security_configuration/components/app_spec.js b/spec/frontend/security_configuration/components/app_spec.js index a983ec435571568f46779f31ebfc1b1d1fd52cf9..d7d46d0d41587851ead140b7ed80fae80b1df378 100644 --- a/spec/frontend/security_configuration/components/app_spec.js +++ b/spec/frontend/security_configuration/components/app_spec.js @@ -54,13 +54,22 @@ describe('App component', () => { const createComponent = ({ shouldShowCallout = true, - license = LICENSE_ULTIMATE, + licenseQueryResponse = LICENSE_ULTIMATE, ...propsData }) => { userCalloutDismissSpy = jest.fn(); mockApollo = createMockApollo([ - [currentLicenseQuery, jest.fn().mockResolvedValue(getCurrentLicensePlanResponse(license))], + [ + currentLicenseQuery, + jest + .fn() + .mockResolvedValue( + licenseQueryResponse instanceof Error + ? licenseQueryResponse + : getCurrentLicensePlanResponse(licenseQueryResponse), + ), + ], ]); wrapper = extendedWrapper( @@ -484,19 +493,23 @@ describe('App component', () => { }); it.each` - license | display - ${LICENSE_ULTIMATE} | ${true} - ${LICENSE_PREMIUM} | ${false} - ${LICENSE_FREE} | ${false} - ${null} | ${false} - `('displays $display for license $license', async ({ license, display }) => { - createComponent({ - license, - augmentedSecurityFeatures: securityFeaturesMock, - augmentedComplianceFeatures: complianceFeaturesMock, - }); - await waitForPromises(); - expect(findVulnerabilityManagementTab().exists()).toBe(display); - }); + licenseQueryResponse | display + ${LICENSE_ULTIMATE} | ${true} + ${LICENSE_PREMIUM} | ${false} + ${LICENSE_FREE} | ${false} + ${null} | ${true} + ${new Error()} | ${true} + `( + 'displays $display for license $licenseQueryResponse', + async ({ licenseQueryResponse, display }) => { + createComponent({ + licenseQueryResponse, + augmentedSecurityFeatures: securityFeaturesMock, + augmentedComplianceFeatures: complianceFeaturesMock, + }); + await waitForPromises(); + expect(findVulnerabilityManagementTab().exists()).toBe(display); + }, + ); }); });