Commit f8cd8559 authored by Andrew Fontaine's avatar Andrew Fontaine

Merge branch '33779-reorganise-security-dashboard-files-ee' into 'master'

Resolve "Reorganise Security Dashboard frontend files"

See merge request gitlab-org/gitlab!23879
parents 057dfc02 0264e335
import initSecurityDashboard from 'ee/security_dashboard/index'; import initGroupSecurityDashboard from 'ee/security_dashboard/group_init';
import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', initGroupSecurityDashboard);
initSecurityDashboard(DASHBOARD_TYPES.GROUP);
});
import initSecurityDashboard from 'ee/security_dashboard/index'; import initGroupSecurityDashboard from 'ee/security_dashboard/group_init';
import leaveByUrl from '~/namespaces/leave_by_url'; import leaveByUrl from '~/namespaces/leave_by_url';
import initGroupDetails from '~/pages/groups/shared/group_details'; import initGroupDetails from '~/pages/groups/shared/group_details';
import initGroupAnalytics from 'ee/analytics/group_analytics/group_analytics_bundle'; import initGroupAnalytics from 'ee/analytics/group_analytics/group_analytics_bundle';
...@@ -7,7 +7,7 @@ document.addEventListener('DOMContentLoaded', () => { ...@@ -7,7 +7,7 @@ document.addEventListener('DOMContentLoaded', () => {
leaveByUrl('group'); leaveByUrl('group');
if (document.querySelector('#js-group-security-dashboard')) { if (document.querySelector('#js-group-security-dashboard')) {
initSecurityDashboard(); initGroupSecurityDashboard();
} else { } else {
initGroupDetails(); initGroupDetails();
} }
......
import initPipelineDetails from '~/pipelines/pipeline_details_bundle'; import initPipelineDetails from '~/pipelines/pipeline_details_bundle';
import initPipelines from '~/pages/projects/pipelines/init_pipelines'; import initPipelines from '~/pages/projects/pipelines/init_pipelines';
import initSecurityReport from './security_report'; import initPipelineSecurityDashboard from 'ee/security_dashboard/pipeline_init';
import initLicenseReport from './license_report'; import initLicenseReport from './license_report';
import initCodequalityReport from './codequality_report'; import initCodequalityReport from './codequality_report';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
initPipelines(); initPipelines();
initPipelineDetails(); initPipelineDetails();
initSecurityReport(); initPipelineSecurityDashboard();
initLicenseReport(); initLicenseReport();
initCodequalityReport(); initCodequalityReport();
}); });
import Vue from 'vue'; import initPipelineSecurityDashboard from 'ee/security_dashboard/pipeline_init';
import createDashboardStore from 'ee/security_dashboard/store';
import PipelineSecurityDashboard from 'ee/security_dashboard/components/pipeline_security_dashboard.vue';
import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
import { LOADING_VULNERABILITIES_ERROR_CODES } from 'ee/security_dashboard/store/modules/vulnerabilities/constants';
const initSecurityDashboardApp = el => { document.addEventListener('DOMContentLoaded', initPipelineSecurityDashboard);
const {
dashboardDocumentation,
emptyStateSvgPath,
pipelineId,
projectId,
sourceBranch,
vulnerabilitiesEndpoint,
vulnerabilityFeedbackHelpPath,
emptyStateUnauthorizedSvgPath,
emptyStateForbiddenSvgPath,
} = el.dataset;
const loadingErrorIllustrations = {
[LOADING_VULNERABILITIES_ERROR_CODES.UNAUTHORIZED]: emptyStateUnauthorizedSvgPath,
[LOADING_VULNERABILITIES_ERROR_CODES.FORBIDDEN]: emptyStateForbiddenSvgPath,
};
return new Vue({
el,
store: createDashboardStore({
dashboardType: DASHBOARD_TYPES.PIPELINE,
}),
render(createElement) {
return createElement(PipelineSecurityDashboard, {
props: {
projectId: parseInt(projectId, 10),
pipelineId: parseInt(pipelineId, 10),
vulnerabilitiesEndpoint,
vulnerabilityFeedbackHelpPath,
sourceBranch,
dashboardDocumentation,
emptyStateSvgPath,
loadingErrorIllustrations,
},
});
},
});
};
export default () => {
const securityTab = document.getElementById('js-security-report-app');
if (securityTab) {
initSecurityDashboardApp(securityTab);
}
};
import Vue from 'vue'; import initProjectSecurityDashboard from 'ee/security_dashboard/project_init';
import createRouter from 'ee/security_dashboard/store/router';
import syncWithRouter from 'ee/security_dashboard/store/plugins/sync_with_router';
import createStore from 'ee/security_dashboard/store';
import SecurityReportApp from 'ee/vue_shared/security_reports/card_security_reports_app.vue';
import { parseBoolean } from '~/lib/utils/common_utils';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', initProjectSecurityDashboard);
const securityTab = document.getElementById('js-security-report-app');
const {
hasPipelineData,
userPath,
userAvatarPath,
pipelineCreated,
pipelinePath,
userName,
commitId,
commitPath,
refId,
refPath,
pipelineId,
projectId,
projectName,
dashboardDocumentation,
emptyStateSvgPath,
vulnerabilitiesEndpoint,
vulnerabilitiesSummaryEndpoint,
vulnerabilityFeedbackHelpPath,
securityDashboardHelpPath,
emptyStateIllustrationPath,
} = securityTab.dataset;
const parsedPipelineId = parseInt(pipelineId, 10);
const parsedHasPipelineData = parseBoolean(hasPipelineData);
let props = {
hasPipelineData: parsedHasPipelineData,
dashboardDocumentation,
emptyStateSvgPath,
vulnerabilitiesEndpoint,
vulnerabilitiesSummaryEndpoint,
vulnerabilityFeedbackHelpPath,
securityDashboardHelpPath,
emptyStateIllustrationPath,
};
if (parsedHasPipelineData) {
props = {
...props,
project: {
id: projectId,
name: projectName,
},
triggeredBy: {
avatarPath: userAvatarPath,
name: userName,
path: userPath,
},
pipeline: {
id: parsedPipelineId,
created: pipelineCreated,
path: pipelinePath,
},
commit: {
id: commitId,
path: commitPath,
},
branch: {
id: refId,
path: refPath,
},
};
}
const router = createRouter();
const store = createStore({ plugins: [syncWithRouter(router)] });
return new Vue({
el: securityTab,
store,
router,
components: {
SecurityReportApp,
},
render(createElement) {
return createElement('security-report-app', {
props,
});
},
});
});
import Vue from 'vue'; import initInstanceSecurityDashboard from 'ee/security_dashboard/instance_init';
import createRouter from 'ee/security_dashboard/store/router';
import projectSelector from 'ee/security_dashboard/store/plugins/project_selector';
import syncWithRouter from 'ee/security_dashboard/store/plugins/sync_with_router';
import createStore from 'ee/security_dashboard/store';
import InstanceSecurityDashboard from 'ee/security_dashboard/components/instance_security_dashboard.vue';
if (gon.features && gon.features.instanceSecurityDashboard) { if (gon.features?.instanceSecurityDashboard) {
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', initInstanceSecurityDashboard);
const el = document.querySelector('#js-security');
const {
dashboardDocumentation,
emptyStateSvgPath,
emptyDashboardStateSvgPath,
projectAddEndpoint,
projectListEndpoint,
vulnerabilitiesEndpoint,
vulnerabilitiesHistoryEndpoint,
vulnerabilityFeedbackHelpPath,
vulnerableProjectsEndpoint,
} = el.dataset;
const router = createRouter();
const store = createStore({ plugins: [projectSelector, syncWithRouter(router)] });
return new Vue({
el,
router,
store,
components: {
InstanceSecurityDashboard,
},
render(createElement) {
return createElement(InstanceSecurityDashboard, {
props: {
dashboardDocumentation,
emptyStateSvgPath,
emptyDashboardStateSvgPath,
projectAddEndpoint,
projectListEndpoint,
vulnerabilitiesEndpoint,
vulnerabilitiesHistoryEndpoint,
vulnerabilityFeedbackHelpPath,
vulnerableProjectsEndpoint,
},
});
},
});
});
} }
<script> <script>
import { mapActions } from 'vuex'; import { mapActions } from 'vuex';
import { GlEmptyState } from '@gitlab/ui'; import { GlEmptyState } from '@gitlab/ui';
import SecurityDashboard from './app.vue'; import SecurityDashboard from './security_dashboard.vue';
export default { export default {
name: 'GroupSecurityDashboard', name: 'GroupSecurityDashboard',
......
...@@ -3,7 +3,7 @@ import { mapActions, mapState } from 'vuex'; ...@@ -3,7 +3,7 @@ import { mapActions, mapState } from 'vuex';
import { GlButton, GlEmptyState, GlLink, GlLoadingIcon } from '@gitlab/ui'; import { GlButton, GlEmptyState, GlLink, GlLoadingIcon } from '@gitlab/ui';
import { s__ } from '~/locale'; import { s__ } from '~/locale';
import ProjectManager from './project_manager.vue'; import ProjectManager from './project_manager.vue';
import SecurityDashboard from './app.vue'; import SecurityDashboard from './security_dashboard.vue';
export default { export default {
name: 'InstanceSecurityDashboard', name: 'InstanceSecurityDashboard',
......
<script> <script>
import { mapActions } from 'vuex'; import { mapActions } from 'vuex';
import { GlEmptyState } from '@gitlab/ui'; import { GlEmptyState } from '@gitlab/ui';
import SecurityDashboard from './app.vue'; import SecurityDashboard from './security_dashboard.vue';
export default { export default {
name: 'PipelineSecurityDashboard', name: 'PipelineSecurityDashboard',
......
<script> <script>
import { isUndefined } from 'underscore'; import { isUndefined } from 'underscore';
import { GlEmptyState, GlSprintf } from '@gitlab/ui'; import { GlEmptyState, GlSprintf } from '@gitlab/ui';
import SecurityDashboardApp from 'ee/security_dashboard/components/app.vue';
import { s__ } from '~/locale'; import { s__ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue'; import Icon from '~/vue_shared/components/icon.vue';
import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue'; import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
import SecurityDashboard from './security_dashboard.vue';
export default { export default {
name: 'ProjectSecurityDashboard',
components: { components: {
GlEmptyState, GlEmptyState,
GlSprintf, GlSprintf,
UserAvatarLink, UserAvatarLink,
Icon, Icon,
TimeagoTooltip, TimeagoTooltip,
SecurityDashboardApp, SecurityDashboard,
}, },
props: { props: {
hasPipelineData: { hasPipelineData: {
...@@ -133,7 +134,7 @@ export default { ...@@ -133,7 +134,7 @@ export default {
</div> </div>
</div> </div>
<h4 class="mt-4 mb-3">{{ __('Vulnerabilities') }}</h4> <h4 class="mt-4 mb-3">{{ __('Vulnerabilities') }}</h4>
<security-dashboard-app <security-dashboard
:lock-to-project="project" :lock-to-project="project"
:vulnerabilities-endpoint="vulnerabilitiesEndpoint" :vulnerabilities-endpoint="vulnerabilitiesEndpoint"
:vulnerabilities-count-endpoint="vulnerabilitiesSummaryEndpoint" :vulnerabilities-count-endpoint="vulnerabilitiesSummaryEndpoint"
...@@ -154,7 +155,7 @@ export default { ...@@ -154,7 +155,7 @@ export default {
" "
/> />
</template> </template>
</security-dashboard-app> </security-dashboard>
</template> </template>
<gl-empty-state <gl-empty-state
v-else v-else
......
...@@ -10,7 +10,7 @@ import VulnerabilitySeverity from './vulnerability_severity.vue'; ...@@ -10,7 +10,7 @@ import VulnerabilitySeverity from './vulnerability_severity.vue';
import LoadingError from './loading_error.vue'; import LoadingError from './loading_error.vue';
export default { export default {
name: 'SecurityDashboardApp', name: 'SecurityDashboard',
components: { components: {
Filters, Filters,
IssueModal, IssueModal,
......
import Vue from 'vue'; import Vue from 'vue';
import GroupSecurityDashboardApp from './components/group_security_dashboard.vue'; import GroupSecurityDashboard from './components/group_security_dashboard.vue';
import UnavailableState from './components/unavailable_state.vue'; import UnavailableState from './components/unavailable_state.vue';
import createStore from './store'; import createStore from './store';
import { DASHBOARD_TYPES } from './store/constants';
import createRouter from './store/router'; import createRouter from './store/router';
import projectsPlugin from './store/plugins/projects'; import projectsPlugin from './store/plugins/projects';
import syncWithRouter from './store/plugins/sync_with_router'; import syncWithRouter from './store/plugins/sync_with_router';
export default function(dashboardType) { export default () => {
const el = document.getElementById('js-group-security-dashboard'); const el = document.getElementById('js-group-security-dashboard');
const { isUnavailable, dashboardDocumentation, emptyStateSvgPath } = el.dataset; const { isUnavailable, dashboardDocumentation, emptyStateSvgPath } = el.dataset;
...@@ -26,16 +27,15 @@ export default function(dashboardType) { ...@@ -26,16 +27,15 @@ export default function(dashboardType) {
const router = createRouter(); const router = createRouter();
const store = createStore({ const store = createStore({
dashboardType, dashboardType: DASHBOARD_TYPES.GROUP,
plugins: [projectsPlugin, syncWithRouter(router)], plugins: [projectsPlugin, syncWithRouter(router)],
}); });
return new Vue({ return new Vue({
el, el,
store, store,
router, router,
components: { GroupSecurityDashboardApp },
render(createElement) { render(createElement) {
return createElement('group-security-dashboard-app', { return createElement(GroupSecurityDashboard, {
props: { props: {
dashboardDocumentation: el.dataset.dashboardDocumentation, dashboardDocumentation: el.dataset.dashboardDocumentation,
emptyStateSvgPath: el.dataset.emptyStateSvgPath, emptyStateSvgPath: el.dataset.emptyStateSvgPath,
...@@ -48,4 +48,4 @@ export default function(dashboardType) { ...@@ -48,4 +48,4 @@ export default function(dashboardType) {
}); });
}, },
}); });
} };
import Vue from 'vue';
import createRouter from './store/router';
import projectSelector from './store/plugins/project_selector';
import syncWithRouter from './store/plugins/sync_with_router';
import createStore from './store';
import { DASHBOARD_TYPES } from './store/constants';
import InstanceSecurityDashboard from './components/instance_security_dashboard.vue';
export default () => {
const el = document.querySelector('#js-security');
const {
dashboardDocumentation,
emptyStateSvgPath,
emptyDashboardStateSvgPath,
projectAddEndpoint,
projectListEndpoint,
vulnerabilitiesEndpoint,
vulnerabilitiesHistoryEndpoint,
vulnerabilityFeedbackHelpPath,
vulnerableProjectsEndpoint,
} = el.dataset;
const router = createRouter();
const store = createStore({
dashboardType: DASHBOARD_TYPES.INSTANCE,
plugins: [projectSelector, syncWithRouter(router)],
});
return new Vue({
el,
router,
store,
render(createElement) {
return createElement(InstanceSecurityDashboard, {
props: {
dashboardDocumentation,
emptyStateSvgPath,
emptyDashboardStateSvgPath,
projectAddEndpoint,
projectListEndpoint,
vulnerabilitiesEndpoint,
vulnerabilitiesHistoryEndpoint,
vulnerabilityFeedbackHelpPath,
vulnerableProjectsEndpoint,
},
});
},
});
};
import Vue from 'vue';
import createDashboardStore from './store';
import PipelineSecurityDashboard from './components/pipeline_security_dashboard.vue';
import { DASHBOARD_TYPES } from './store/constants';
import { LOADING_VULNERABILITIES_ERROR_CODES } from './store/modules/vulnerabilities/constants';
export default () => {
const el = document.getElementById('js-security-report-app');
if (!el) {
return null;
}
const {
dashboardDocumentation,
emptyStateSvgPath,
pipelineId,
projectId,
sourceBranch,
vulnerabilitiesEndpoint,
vulnerabilityFeedbackHelpPath,
emptyStateUnauthorizedSvgPath,
emptyStateForbiddenSvgPath,
} = el.dataset;
const loadingErrorIllustrations = {
[LOADING_VULNERABILITIES_ERROR_CODES.UNAUTHORIZED]: emptyStateUnauthorizedSvgPath,
[LOADING_VULNERABILITIES_ERROR_CODES.FORBIDDEN]: emptyStateForbiddenSvgPath,
};
return new Vue({
el,
store: createDashboardStore({
dashboardType: DASHBOARD_TYPES.PIPELINE,
}),
render(createElement) {
return createElement(PipelineSecurityDashboard, {
props: {
projectId: parseInt(projectId, 10),
pipelineId: parseInt(pipelineId, 10),
vulnerabilitiesEndpoint,
vulnerabilityFeedbackHelpPath,
sourceBranch,
dashboardDocumentation,
emptyStateSvgPath,
loadingErrorIllustrations,
},
});
},
});
};
import Vue from 'vue';
import createRouter from './store/router';
import syncWithRouter from './store/plugins/sync_with_router';
import createStore from './store';
import { DASHBOARD_TYPES } from './store/constants';
import ProjectSecurityDashboard from './components/project_security_dashboard.vue';
import { parseBoolean } from '~/lib/utils/common_utils';
export default () => {
const securityTab = document.getElementById('js-security-report-app');
const {
hasPipelineData,
userPath,
userAvatarPath,
pipelineCreated,
pipelinePath,
userName,
commitId,
commitPath,
refId,
refPath,
pipelineId,
projectId,
projectName,
dashboardDocumentation,
emptyStateSvgPath,
vulnerabilitiesEndpoint,
vulnerabilitiesSummaryEndpoint,
vulnerabilityFeedbackHelpPath,
securityDashboardHelpPath,
emptyStateIllustrationPath,
} = securityTab.dataset;
const parsedPipelineId = parseInt(pipelineId, 10);
const parsedHasPipelineData = parseBoolean(hasPipelineData);
let props = {
hasPipelineData: parsedHasPipelineData,
dashboardDocumentation,
emptyStateSvgPath,
vulnerabilitiesEndpoint,
vulnerabilitiesSummaryEndpoint,
vulnerabilityFeedbackHelpPath,
securityDashboardHelpPath,
emptyStateIllustrationPath,
};
if (parsedHasPipelineData) {
props = {
...props,
project: {
id: projectId,
name: projectName,
},
triggeredBy: {
avatarPath: userAvatarPath,
name: userName,
path: userPath,
},
pipeline: {
id: parsedPipelineId,
created: pipelineCreated,
path: pipelinePath,
},
commit: {
id: commitId,
path: commitPath,
},
branch: {
id: refId,
path: refPath,
},
};
}
const router = createRouter();
const store = createStore({
dashboardType: DASHBOARD_TYPES.PROJECT,
plugins: [syncWithRouter(router)],
});
return new Vue({
el: securityTab,
store,
router,
render(createElement) {
return createElement(ProjectSecurityDashboard, {
props,
});
},
});
};
...@@ -3,7 +3,7 @@ import DependenciesTableRow from 'ee/dependencies/components/dependencies_table_ ...@@ -3,7 +3,7 @@ import DependenciesTableRow from 'ee/dependencies/components/dependencies_table_
import DependencyVulnerability from 'ee/dependencies/components/dependency_vulnerability.vue'; import DependencyVulnerability from 'ee/dependencies/components/dependency_vulnerability.vue';
import { MAX_DISPLAYED_VULNERABILITIES_PER_DEPENDENCY } from 'ee/dependencies/components/constants'; import { MAX_DISPLAYED_VULNERABILITIES_PER_DEPENDENCY } from 'ee/dependencies/components/constants';
import { makeDependency } from './utils'; import { makeDependency } from './utils';
import mockDataVulnerabilities from '../../security_dashboard/store/vulnerabilities/data/mock_data_vulnerabilities'; import mockDataVulnerabilities from '../../security_dashboard/store/modules/vulnerabilities/data/mock_data_vulnerabilities';
describe('DependenciesTableRow component', () => { describe('DependenciesTableRow component', () => {
let wrapper; let wrapper;
......
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import DependencyVulnerability from 'ee/dependencies/components/dependency_vulnerability.vue'; import DependencyVulnerability from 'ee/dependencies/components/dependency_vulnerability.vue';
import SeverityBadge from 'ee/vue_shared/security_reports/components/severity_badge.vue'; import SeverityBadge from 'ee/vue_shared/security_reports/components/severity_badge.vue';
import mockDataVulnerabilities from '../../security_dashboard/store/vulnerabilities/data/mock_data_vulnerabilities'; import mockDataVulnerabilities from '../../security_dashboard/store/modules/vulnerabilities/data/mock_data_vulnerabilities';
describe('DependencyVulnerability component', () => { describe('DependencyVulnerability component', () => {
let wrapper; let wrapper;
......
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Card security reports app Empty State renders correctly renders empty state component with correct props 1`] = ` exports[`Project Security Dashboard component Empty State renders correctly renders empty state component with correct props 1`] = `
Object { Object {
"compact": false, "compact": false,
"description": "The security dashboard displays the latest security report. Use it to find and fix vulnerabilities.", "description": "The security dashboard displays the latest security report. Use it to find and fix vulnerabilities.",
...@@ -13,8 +13,46 @@ Object { ...@@ -13,8 +13,46 @@ Object {
} }
`; `;
exports[`Card security reports app Headline renders renders branch and commit information 1`] = ` exports[`Project Security Dashboard component Headline renders renders branch and commit information 1`] = `
"<span class=\\"js-security-dashboard-right pull-right\\"><svg aria-hidden=\\"true\\" class=\\"s16 ic-branch\\"><use xlink:href=\\"#branch\\"></use></svg> <a href=\\"http://test.host/branch\\" class=\\"monospace\\">master</a> <span class=\\"text-muted prepend-left-5 append-right-5\\">·</span> <svg aria-hidden=\\"true\\" class=\\"s16 ic-commit\\"> <span
<use xlink:href=\\"#commit\\"></use> class="js-security-dashboard-right pull-right"
</svg> <a href=\\"http://test.host/commit\\" class=\\"monospace\\">1234adf</a></span>" >
<svg
aria-hidden="true"
class="s16 ic-branch"
>
<use
xlink:href="#branch"
/>
</svg>
<a
class="monospace"
href="http://test.host/branch"
>
master
</a>
<span
class="text-muted prepend-left-5 append-right-5"
>
·
</span>
<svg
aria-hidden="true"
class="s16 ic-commit"
>
<use
xlink:href="#commit"
/>
</svg>
<a
class="monospace"
href="http://test.host/commit"
>
1234adf
</a>
</span>
`; `;
...@@ -2,7 +2,7 @@ import Vuex from 'vuex'; ...@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import { GlEmptyState } from '@gitlab/ui'; import { GlEmptyState } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils'; import { shallowMount, createLocalVue } from '@vue/test-utils';
import GroupSecurityDashboard from 'ee/security_dashboard/components/group_security_dashboard.vue'; import GroupSecurityDashboard from 'ee/security_dashboard/components/group_security_dashboard.vue';
import SecurityDashboard from 'ee/security_dashboard/components/app.vue'; import SecurityDashboard from 'ee/security_dashboard/components/security_dashboard.vue';
const localVue = createLocalVue(); const localVue = createLocalVue();
localVue.use(Vuex); localVue.use(Vuex);
......
...@@ -2,7 +2,7 @@ import Vuex from 'vuex'; ...@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import { shallowMount, createLocalVue } from '@vue/test-utils'; import { shallowMount, createLocalVue } from '@vue/test-utils';
import { GlEmptyState, GlLoadingIcon } from '@gitlab/ui'; import { GlEmptyState, GlLoadingIcon } from '@gitlab/ui';
import InstanceSecurityDashboard from 'ee/security_dashboard/components/instance_security_dashboard.vue'; import InstanceSecurityDashboard from 'ee/security_dashboard/components/instance_security_dashboard.vue';
import SecurityDashboard from 'ee/security_dashboard/components/app.vue'; import SecurityDashboard from 'ee/security_dashboard/components/security_dashboard.vue';
import ProjectManager from 'ee/security_dashboard/components/project_manager.vue'; import ProjectManager from 'ee/security_dashboard/components/project_manager.vue';
const localVue = createLocalVue(); const localVue = createLocalVue();
......
...@@ -2,7 +2,7 @@ import Vuex from 'vuex'; ...@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import { GlEmptyState } from '@gitlab/ui'; import { GlEmptyState } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils'; import { shallowMount, createLocalVue } from '@vue/test-utils';
import PipelineSecurityDashboard from 'ee/security_dashboard/components/pipeline_security_dashboard.vue'; import PipelineSecurityDashboard from 'ee/security_dashboard/components/pipeline_security_dashboard.vue';
import SecurityDashboard from 'ee/security_dashboard/components/app.vue'; import SecurityDashboard from 'ee/security_dashboard/components/security_dashboard.vue';
const localVue = createLocalVue(); const localVue = createLocalVue();
localVue.use(Vuex); localVue.use(Vuex);
......
...@@ -3,7 +3,7 @@ import { GlEmptyState } from '@gitlab/ui'; ...@@ -3,7 +3,7 @@ import { GlEmptyState } from '@gitlab/ui';
import MockAdapter from 'axios-mock-adapter'; import MockAdapter from 'axios-mock-adapter';
import { TEST_HOST } from 'helpers/test_constants'; import { TEST_HOST } from 'helpers/test_constants';
import CardSecurityDashboardApp from 'ee/vue_shared/security_reports/card_security_reports_app.vue'; import ProjectSecurityDashboard from 'ee/security_dashboard/components/project_security_dashboard.vue';
import createStore from 'ee/security_dashboard/store'; import createStore from 'ee/security_dashboard/store';
import { trimText } from 'helpers/text_helper'; import { trimText } from 'helpers/text_helper';
import axios from '~/lib/utils/axios_utils'; import axios from '~/lib/utils/axios_utils';
...@@ -11,7 +11,7 @@ import axios from '~/lib/utils/axios_utils'; ...@@ -11,7 +11,7 @@ import axios from '~/lib/utils/axios_utils';
const vulnerabilitiesEndpoint = `${TEST_HOST}/vulnerabilities`; const vulnerabilitiesEndpoint = `${TEST_HOST}/vulnerabilities`;
const vulnerabilitiesSummaryEndpoint = `${TEST_HOST}/vulnerabilities_summary`; const vulnerabilitiesSummaryEndpoint = `${TEST_HOST}/vulnerabilities_summary`;
describe('Card security reports app', () => { describe('Project Security Dashboard component', () => {
let wrapper; let wrapper;
let mock; let mock;
...@@ -19,7 +19,7 @@ describe('Card security reports app', () => { ...@@ -19,7 +19,7 @@ describe('Card security reports app', () => {
runDate.setDate(runDate.getDate() - 7); runDate.setDate(runDate.getDate() - 7);
const createComponent = props => { const createComponent = props => {
wrapper = mount(CardSecurityDashboardApp, { wrapper = mount(ProjectSecurityDashboard, {
store: createStore(), store: createStore(),
stubs: ['security-dashboard-table'], stubs: ['security-dashboard-table'],
propsData: { propsData: {
...@@ -88,12 +88,12 @@ describe('Card security reports app', () => { ...@@ -88,12 +88,12 @@ describe('Card security reports app', () => {
it('renders branch and commit information', () => { it('renders branch and commit information', () => {
const revInformation = wrapper.find('.card-header .js-security-dashboard-right'); const revInformation = wrapper.find('.card-header .js-security-dashboard-right');
expect(revInformation.html()).toMatchSnapshot(); expect(revInformation.element).toMatchSnapshot();
}); });
}); });
describe('Dashboard renders properly', () => { describe('Dashboard renders properly', () => {
const findDashboard = () => wrapper.find(CardSecurityDashboardApp); const findDashboard = () => wrapper.find(ProjectSecurityDashboard);
it('renders security dashboard', () => { it('renders security dashboard', () => {
const dashboard = findDashboard(); const dashboard = findDashboard();
......
...@@ -2,7 +2,7 @@ import { shallowMount } from '@vue/test-utils'; ...@@ -2,7 +2,7 @@ import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter'; import MockAdapter from 'axios-mock-adapter';
import { TEST_HOST } from 'helpers/test_constants'; import { TEST_HOST } from 'helpers/test_constants';
import SecurityDashboardApp from 'ee/security_dashboard/components/app.vue'; import SecurityDashboard from 'ee/security_dashboard/components/security_dashboard.vue';
import Filters from 'ee/security_dashboard/components/filters.vue'; import Filters from 'ee/security_dashboard/components/filters.vue';
import SecurityDashboardTable from 'ee/security_dashboard/components/security_dashboard_table.vue'; import SecurityDashboardTable from 'ee/security_dashboard/components/security_dashboard_table.vue';
import VulnerabilityChart from 'ee/security_dashboard/components/vulnerability_chart.vue'; import VulnerabilityChart from 'ee/security_dashboard/components/vulnerability_chart.vue';
...@@ -24,7 +24,7 @@ jest.mock('~/lib/utils/url_utility', () => ({ ...@@ -24,7 +24,7 @@ jest.mock('~/lib/utils/url_utility', () => ({
getParameterValues: jest.fn().mockReturnValue([]), getParameterValues: jest.fn().mockReturnValue([]),
})); }));
describe('Security Dashboard app', () => { describe('Security Dashboard component', () => {
let wrapper; let wrapper;
let mock; let mock;
let lockFilterSpy; let lockFilterSpy;
...@@ -39,7 +39,7 @@ describe('Security Dashboard app', () => { ...@@ -39,7 +39,7 @@ describe('Security Dashboard app', () => {
const createComponent = props => { const createComponent = props => {
store = createStore(); store = createStore();
wrapper = shallowMount(SecurityDashboardApp, { wrapper = shallowMount(SecurityDashboard, {
store, store,
methods: { methods: {
lockFilter: lockFilterSpy, lockFilter: lockFilterSpy,
......
...@@ -3,7 +3,7 @@ import { GlFormCheckbox } from '@gitlab/ui'; ...@@ -3,7 +3,7 @@ import { GlFormCheckbox } from '@gitlab/ui';
import SecurityDashboardTableRow from 'ee/security_dashboard/components/security_dashboard_table_row.vue'; import SecurityDashboardTableRow from 'ee/security_dashboard/components/security_dashboard_table_row.vue';
import createStore from 'ee/security_dashboard/store'; import createStore from 'ee/security_dashboard/store';
import { mount, shallowMount, createLocalVue } from '@vue/test-utils'; import { mount, shallowMount, createLocalVue } from '@vue/test-utils';
import mockDataVulnerabilities from '../store/vulnerabilities/data/mock_data_vulnerabilities'; import mockDataVulnerabilities from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities';
import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants'; import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
const localVue = createLocalVue(); const localVue = createLocalVue();
......
...@@ -13,7 +13,7 @@ import { ...@@ -13,7 +13,7 @@ import {
REQUEST_VULNERABILITIES, REQUEST_VULNERABILITIES,
} from 'ee/security_dashboard/store/modules/vulnerabilities/mutation_types'; } from 'ee/security_dashboard/store/modules/vulnerabilities/mutation_types';
import mockDataVulnerabilities from '../store/vulnerabilities/data/mock_data_vulnerabilities'; import mockDataVulnerabilities from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities';
const localVue = createLocalVue(); const localVue = createLocalVue();
localVue.use(Vuex); localVue.use(Vuex);
......
...@@ -4,7 +4,7 @@ import component from 'ee/security_dashboard/components/vulnerability_action_but ...@@ -4,7 +4,7 @@ import component from 'ee/security_dashboard/components/vulnerability_action_but
import createStore from 'ee/security_dashboard/store'; import createStore from 'ee/security_dashboard/store';
import { mountComponentWithStore } from 'helpers/vue_mount_component_helper'; import { mountComponentWithStore } from 'helpers/vue_mount_component_helper';
import { resetStore } from '../helpers'; import { resetStore } from '../helpers';
import mockDataVulnerabilities from '../store/vulnerabilities/data/mock_data_vulnerabilities'; import mockDataVulnerabilities from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities';
describe('Security Dashboard Action Buttons', () => { describe('Security Dashboard Action Buttons', () => {
const Component = Vue.extend(component); const Component = Vue.extend(component);
......
...@@ -3,7 +3,7 @@ import component from 'ee/security_dashboard/components/vulnerability_count_list ...@@ -3,7 +3,7 @@ import component from 'ee/security_dashboard/components/vulnerability_count_list
import createStore from 'ee/security_dashboard/store'; import createStore from 'ee/security_dashboard/store';
import { mountComponentWithStore } from 'helpers/vue_mount_component_helper'; import { mountComponentWithStore } from 'helpers/vue_mount_component_helper';
import { resetStore } from '../helpers'; import { resetStore } from '../helpers';
import mockData from '../store/vulnerabilities/data/mock_data_vulnerabilities_count.json'; import mockData from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities_count.json';
describe('Vulnerability Count List', () => { describe('Vulnerability Count List', () => {
const Component = Vue.extend(component); const Component = Vue.extend(component);
......
import { isSameVulnerability } from 'ee/security_dashboard/store/modules/vulnerabilities/utils'; import { isSameVulnerability } from 'ee/security_dashboard/store/modules/vulnerabilities/utils';
import mockData from '../../../security_dashboard/store/vulnerabilities/data/mock_data_vulnerabilities'; import mockData from './data/mock_data_vulnerabilities';
describe('Vulnerabilities utils', () => { describe('Vulnerabilities utils', () => {
const clone = serializable => JSON.parse(JSON.stringify(serializable)); const clone = serializable => JSON.parse(JSON.stringify(serializable));
......
export { export {
default, default,
} from '../../../../../frontend/security_dashboard/store/vulnerabilities/data/mock_data_vulnerabilities'; } from '../../../../../frontend/security_dashboard/store/modules/vulnerabilities/data/mock_data_vulnerabilities';
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