Skip to content

G
gitlab-ce
Commit 22914612 authored by Dheeraj Joshi's avatar Dheeraj Joshi Committed by Paul Slaughter
Browse files
Options

Update DAST profile summary to hide empty values 

This is to improve UX by removing empty values to
be shown in profile summary card

Changelog: changed
EE: true
parent 11f4c756
Show whitespace changes
Inline Side-by-side
Showing with 342 additions and 501 deletions
ee/app/assets/javascripts/on_demand_scans_form/components/profile_selector/scanner_profile_summary.vue
View file @ 22914612
<script> <script>
import { SCAN_TYPE_LABEL } from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/constants'; import { SCAN_TYPE_LABEL } from 'ee/security_configuration/dast_profiles/dast_scanner_profiles/constants';
import ProfileSelectorSummaryCell from './summary_cell.vue'; import SummaryCell from './summary_cell.vue';
export default { export default {
name: 'DastScannerProfileSummary', name: 'DastScannerProfileSummary',
components: { components: {
ProfileSelectorSummaryCell, SummaryCell,
}, },
props: { props: {
profile: { profile: {
...@@ -23,30 +23,25 @@ export default { ...@@ -23,30 +23,25 @@ export default {
</script> </script>
<template> <template>
<div>
<div class="row"> <div class="row">
<profile-selector-summary-cell <summary-cell
:class="{ 'gl-text-red-500': hasConflict }" :class="{ 'gl-text-red-500': hasConflict }"
:label="s__('DastProfiles|Scan mode')" :label="s__('DastProfiles|Scan mode')"
:value="$options.SCAN_TYPE_LABEL[profile.scanType]" :value="$options.SCAN_TYPE_LABEL[profile.scanType]"
/> />
</div> <summary-cell
<div class="row">
<profile-selector-summary-cell
:label="s__('DastProfiles|Spider timeout')" :label="s__('DastProfiles|Spider timeout')"
:value="n__('%d minute', '%d minutes', profile.spiderTimeout || 0)" :value="n__('%d minute', '%d minutes', profile.spiderTimeout || 0)"
/> />
<profile-selector-summary-cell <summary-cell
:label="s__('DastProfiles|Target timeout')" :label="s__('DastProfiles|Target timeout')"
:value="n__('%d second', '%d seconds', profile.targetTimeout || 0)" :value="n__('%d second', '%d seconds', profile.targetTimeout || 0)"
/> />
</div> <summary-cell
<div class="row">
<profile-selector-summary-cell
:label="s__('DastProfiles|AJAX spider')" :label="s__('DastProfiles|AJAX spider')"
:value="profile.useAjaxSpider ? __('On') : __('Off')" :value="profile.useAjaxSpider ? __('On') : __('Off')"
/> />
<profile-selector-summary-cell <summary-cell
:label="s__('DastProfiles|Debug messages')" :label="s__('DastProfiles|Debug messages')"
:value=" :value="
profile.showDebugMessages profile.showDebugMessages
...@@ -55,5 +50,4 @@ export default { ...@@ -55,5 +50,4 @@ export default {
" "
/> />
</div> </div>
</div>
</template> </template>
ee/app/assets/javascripts/on_demand_scans_form/components/profile_selector/site_profile_summary.vue
View file @ 22914612
...@@ -5,12 +5,12 @@ import { ...@@ -5,12 +5,12 @@ import {
} from 'ee/security_configuration/dast_profiles/dast_site_profiles/constants'; } from 'ee/security_configuration/dast_profiles/dast_site_profiles/constants';
import { DAST_SITE_VALIDATION_STATUS } from 'ee/security_configuration/dast_site_validation/constants'; import { DAST_SITE_VALIDATION_STATUS } from 'ee/security_configuration/dast_site_validation/constants';
import { s__ } from '~/locale'; import { s__ } from '~/locale';
import ProfileSelectorSummaryCell from './summary_cell.vue'; import SummaryCell from './summary_cell.vue';
export default { export default {
name: 'DastSiteProfileSummary', name: 'DastSiteProfileSummary',
components: { components: {
ProfileSelectorSummaryCell, SummaryCell,
}, },
props: { props: {
profile: { profile: {
...@@ -39,6 +39,7 @@ export default { ...@@ -39,6 +39,7 @@ export default {
? s__('DastProfiles|Excluded paths') ? s__('DastProfiles|Excluded paths')
: s__('DastProfiles|Excluded URLs'), : s__('DastProfiles|Excluded URLs'),
requestHeaders: s__('DastProfiles|Request headers'), requestHeaders: s__('DastProfiles|Request headers'),
validationStatus: s__('DastProfiles|Validation status'),
}; };
}, },
hasExcludedUrls() { hasExcludedUrls() {
...@@ -66,47 +67,25 @@ export default { ...@@ -66,47 +67,25 @@ export default {
</script> </script>
<template> <template>
<div>
<div class="row"> <div class="row">
<profile-selector-summary-cell <summary-cell
:class="{ 'gl-text-red-500': hasConflict }" :class="{ 'gl-text-red-500': hasConflict }"
:label="i18n.targetUrl" :label="i18n.targetUrl"
:value="profile.targetUrl" :value="profile.targetUrl"
/> />
<profile-selector-summary-cell :label="i18n.targetType" :value="targetTypeValue" /> <summary-cell :label="i18n.targetType" :value="targetTypeValue" />
</div>
<template v-if="profile.auth.enabled"> <template v-if="profile.auth.enabled">
<div class="row"> <summary-cell :label="i18n.authUrl" :value="profile.auth.url" />
<profile-selector-summary-cell :label="i18n.authUrl" :value="profile.auth.url" /> <summary-cell :label="i18n.username" :value="profile.auth.username" />
</div> <summary-cell :label="i18n.password" value="••••••••" />
<div class="row"> <summary-cell :label="i18n.usernameField" :value="profile.auth.usernameField" />
<profile-selector-summary-cell :label="i18n.username" :value="profile.auth.username" /> <summary-cell :label="i18n.passwordField" :value="profile.auth.passwordField" />
<profile-selector-summary-cell :label="i18n.password" value="••••••••" />
</div>
<div class="row">
<profile-selector-summary-cell
:label="i18n.usernameField"
:value="profile.auth.usernameField"
/>
<profile-selector-summary-cell
:label="i18n.passwordField"
:value="profile.auth.passwordField"
/>
</div>
</template> </template>
<div class="row"> <summary-cell :label="i18n.excludedUrls" :value="displayExcludedUrls" />
<profile-selector-summary-cell :label="i18n.excludedUrls" :value="displayExcludedUrls" /> <summary-cell
<profile-selector-summary-cell
:label="i18n.requestHeaders" :label="i18n.requestHeaders"
:value="profile.requestHeaders ? __('[Redacted]') : undefined" :value="profile.requestHeaders ? __('[Redacted]') : undefined"
/> />
</div> <summary-cell :label="i18n.validationStatus" :value="isProfileValidated" />
<div class="row">
<profile-selector-summary-cell
:label="s__('DastProfiles|Validation status')"
:value="isProfileValidated"
/>
</div>
</div> </div>
</template> </template>
ee/app/assets/javascripts/on_demand_scans_form/components/profile_selector/summary_cell.vue
View file @ 22914612
<script> <script>
import { __ } from '~/locale';
export default { export default {
name: 'OnDemandScansProfileSummaryCell', name: 'OnDemandScansProfileSummaryCell',
props: { props: {
...@@ -11,14 +9,14 @@ export default { ...@@ -11,14 +9,14 @@ export default {
value: { value: {
type: String, type: String,
required: false, required: false,
default: __('None'), default: null,
}, },
}, },
}; };
</script> </script>
<template> <template>
<div class="col-md-6"> <div v-if="value" class="col-md-6">
<div class="row gl-my-2"> <div class="row gl-my-2">
<div class="col-md-4">{{ label }}:</div> <div class="col-md-4">{{ label }}:</div>
<div class="col-md-8"> <div class="col-md-8">
......
ee/spec/frontend/on_demand_scans_form/components/profile_selector/__snapshots__/scanner_profile_summary_spec.js.snap
View file @ 22914612
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`DastScannerProfileSummary renders properly 1`] = ` exports[`DastScannerProfileSummary renders properly 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Scan mode" label="Scan mode"
value="Passive" value="Passive"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Spider timeout" label="Spider timeout"
value="5 minutes" value="5 minutes"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Target timeout" label="Target timeout"
value="10 seconds" value="10 seconds"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="AJAX spider" label="AJAX spider"
value="Off" value="Off"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Debug messages" label="Debug messages"
value="Hide debug messages" value="Hide debug messages"
/> />
</div>
</div> </div>
`; `;
ee/spec/frontend/on_demand_scans_form/components/profile_selector/__snapshots__/site_profile_summary_spec.js.snap
View file @ 22914612
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`DastSiteProfileSummary renders properly profile 0 1`] = ` exports[`DastSiteProfileSummary renders properly profile 0 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Target URL" label="Target URL"
value="http://pending.test" value="http://pending.test"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Site type" label="Site type"
value="Website" value="Website"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Authentication URL" label="Authentication URL"
value="http://pending.test/sign-in" value="http://pending.test/sign-in"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username" label="Username"
value="validation-pending@example.com" value="validation-pending@example.com"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password" label="Password"
value="••••••••" value="••••••••"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username form field" label="Username form field"
value="session[username]" value="session[username]"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password form field" label="Password form field"
value="session[password]" value="session[password]"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Excluded URLs" label="Excluded URLs"
value="http://pending.test/sign-out,http://pending.test/hidden" value="http://pending.test/sign-out,http://pending.test/hidden"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Request headers" label="Request headers"
value="None"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Validation status" label="Validation status"
value="Not Validated" value="Not Validated"
/> />
</div>
</div> </div>
`; `;
exports[`DastSiteProfileSummary renders properly profile 1 1`] = ` exports[`DastSiteProfileSummary renders properly profile 1 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Target URL" label="Target URL"
value="http://inprogress.test" value="http://inprogress.test"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Site type" label="Site type"
value="Website" value="Website"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Authentication URL" label="Authentication URL"
value="http://inprogress.test/sign-in" value="http://inprogress.test/sign-in"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username" label="Username"
value="validation-in-progress@example.com" value="validation-in-progress@example.com"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password" label="Password"
value="••••••••" value="••••••••"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username form field" label="Username form field"
value="session[username]" value="session[username]"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password form field" label="Password form field"
value="session[password]" value="session[password]"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Excluded URLs" label="Excluded URLs"
value="http://inprogress.test/sign-out,http://inprogress.test/hidden" value="http://inprogress.test/sign-out,http://inprogress.test/hidden"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Request headers" label="Request headers"
value="None"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Validation status" label="Validation status"
value="Not Validated" value="Not Validated"
/> />
</div>
</div> </div>
`; `;
exports[`DastSiteProfileSummary renders properly profile 2 1`] = ` exports[`DastSiteProfileSummary renders properly profile 2 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Target URL" label="Target URL"
value="http://passed.test" value="http://passed.test"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Site type" label="Site type"
value="Website" value="Website"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Authentication URL" label="Authentication URL"
value="http://passed.test/sign-in" value="http://passed.test/sign-in"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username" label="Username"
value="validation-passed@example.com" value="validation-passed@example.com"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password" label="Password"
value="••••••••" value="••••••••"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username form field" label="Username form field"
value="session[username]" value="session[username]"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password form field" label="Password form field"
value="session[password]" value="session[password]"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Excluded URLs" label="Excluded URLs"
value="http://passed.test/sign-out,http://passed.test/hidden" value="http://passed.test/sign-out,http://passed.test/hidden"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Request headers" label="Request headers"
value="None"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Validation status" label="Validation status"
value="Validated" value="Validated"
/> />
</div>
</div> </div>
`; `;
exports[`DastSiteProfileSummary renders properly profile 3 1`] = ` exports[`DastSiteProfileSummary renders properly profile 3 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Target URL" label="Target URL"
value="http://failed.test" value="http://failed.test"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Site type" label="Site type"
value="Website" value="Website"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Authentication URL" label="Authentication URL"
value="http://failed.test/sign-in" value="http://failed.test/sign-in"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username" label="Username"
value="validation-failed@example.com" value="validation-failed@example.com"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password" label="Password"
value="••••••••" value="••••••••"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username form field" label="Username form field"
value="session[username]" value="session[username]"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password form field" label="Password form field"
value="session[password]" value="session[password]"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Excluded URLs" label="Excluded URLs"
value="http://failed.test/sign-out,http://failed.test/hidden" value="http://failed.test/sign-out,http://failed.test/hidden"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Request headers" label="Request headers"
value="None"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Validation status" label="Validation status"
value="Not Validated" value="Not Validated"
/> />
</div>
</div> </div>
`; `;
exports[`DastSiteProfileSummary renders properly profile 4 1`] = ` exports[`DastSiteProfileSummary renders properly profile 4 1`] = `
<div> <div
<div
class="row" class="row"
> >
<profile-selector-summary-cell-stub <summary-cell-stub
class="" class=""
label="Target URL" label="Target URL"
value="http://none.test" value="http://none.test"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Site type" label="Site type"
value="Website" value="Website"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Authentication URL" label="Authentication URL"
value="http://none.test/sign-in" value="http://none.test/sign-in"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username" label="Username"
value="non-validated@example.com" value="non-validated@example.com"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password" label="Password"
value="••••••••" value="••••••••"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Username form field" label="Username form field"
value="session[username]" value="session[username]"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Password form field" label="Password form field"
value="session[password]" value="session[password]"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Excluded URLs" label="Excluded URLs"
value="http://none.test/sign-out,http://none.test/hidden" value="http://none.test/sign-out,http://none.test/hidden"
/> />
<profile-selector-summary-cell-stub <summary-cell-stub
label="Request headers" label="Request headers"
value="None"
/> />
</div>
<div <summary-cell-stub
class="row"
>
<profile-selector-summary-cell-stub
label="Validation status" label="Validation status"
value="Not Validated" value="Not Validated"
/> />
</div>
</div> </div>
`; `;
ee/spec/frontend/on_demand_scans_form/components/profile_selector/summary_cell_spec.js
View file @ 22914612
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import OnDemandScansProfileSummaryCell from 'ee/on_demand_scans_form/components/profile_selector/summary_cell.vue'; import OnDemandScansProfileSummaryCell from 'ee/on_demand_scans_form/components/profile_selector/summary_cell.vue';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
describe('OnDemandScansProfileSummaryCell', () => { describe('OnDemandScansProfileSummaryCell', () => {
let wrapper; let wrapper;
const createFullComponent = (propsData) => { const createFullComponent = (propsData) => {
wrapper = extendedWrapper( wrapper = shallowMount(OnDemandScansProfileSummaryCell, {
shallowMount(OnDemandScansProfileSummaryCell, {
propsData, propsData,
}), });
);
}; };
const findValue = () => wrapper.findByTestId('summary-value');
afterEach(() => { afterEach(() => {
wrapper.destroy(); wrapper.destroy();
}); });
...@@ -28,12 +23,12 @@ describe('OnDemandScansProfileSummaryCell', () => { ...@@ -28,12 +23,12 @@ describe('OnDemandScansProfileSummaryCell', () => {
expect(wrapper.element).toMatchSnapshot(); expect(wrapper.element).toMatchSnapshot();
}); });
it('renders default when value prop is undefined', () => { it('renders nothing when value prop is undefined', () => {
createFullComponent({ createFullComponent({
label: 'Row Label', label: 'Row Label',
value: undefined, value: undefined,
}); });
expect(findValue().text()).toContain('None'); expect(wrapper.html()).toBe('');
}); });
}); });
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7