diff options
Diffstat (limited to 'app/assets/javascripts/pipelines/pipeline_details_bundle.js')
-rw-r--r-- | app/assets/javascripts/pipelines/pipeline_details_bundle.js | 56 |
1 files changed, 30 insertions, 26 deletions
diff --git a/app/assets/javascripts/pipelines/pipeline_details_bundle.js b/app/assets/javascripts/pipelines/pipeline_details_bundle.js index 90109598542..f1102a9bddf 100644 --- a/app/assets/javascripts/pipelines/pipeline_details_bundle.js +++ b/app/assets/javascripts/pipelines/pipeline_details_bundle.js @@ -10,8 +10,7 @@ import PipelinesMediator from './pipeline_details_mediator'; import pipelineHeader from './components/header_component.vue'; import eventHub from './event_hub'; import TestReports from './components/test_reports/test_reports.vue'; -import testReportsStore from './stores/test_reports'; -import axios from '~/lib/utils/axios_utils'; +import createTestReportsStore from './stores/test_reports'; Vue.use(Translate); @@ -93,15 +92,11 @@ const createPipelineHeaderApp = mediator => { }); }; -const createPipelinesTabs = dataset => { +const createPipelinesTabs = testReportsStore => { const tabsElement = document.querySelector('.pipelines-tabs'); - const testReportsEnabled = - window.gon && window.gon.features && window.gon.features.junitPipelineView; - - if (tabsElement && testReportsEnabled) { - const fetchReportsAction = 'fetchReports'; - testReportsStore.dispatch('setEndpoint', dataset.testReportEndpoint); + if (tabsElement) { + const fetchReportsAction = 'fetchFullReport'; const isTestTabActive = Boolean( document.querySelector('.pipelines-tabs > li > a.test-tab.active'), ); @@ -121,28 +116,35 @@ const createPipelinesTabs = dataset => { } }; -const createTestDetails = detailsEndpoint => { +const createTestDetails = () => { + if (!window.gon?.features?.junitPipelineView) { + return; + } + + const el = document.querySelector('#js-pipeline-tests-detail'); + const { fullReportEndpoint, summaryEndpoint, countEndpoint } = el?.dataset || {}; + + const testReportsStore = createTestReportsStore({ + fullReportEndpoint, + summaryEndpoint: summaryEndpoint || countEndpoint, + useBuildSummaryReport: window.gon?.features?.buildReportSummary, + }); + + if (!window.gon?.features?.buildReportSummary) { + createPipelinesTabs(testReportsStore); + } + // eslint-disable-next-line no-new new Vue({ - el: '#js-pipeline-tests-detail', + el, components: { TestReports, }, + store: testReportsStore, render(createElement) { return createElement('test-reports'); }, }); - - axios - .get(detailsEndpoint) - .then(({ data }) => { - if (!data.total_count) { - return; - } - - document.querySelector('.js-test-report-badge-counter').innerHTML = data.total_count; - }) - .catch(() => {}); }; const createDagApp = () => { @@ -151,7 +153,8 @@ const createDagApp = () => { } const el = document.querySelector('#js-pipeline-dag-vue'); - const graphUrl = el?.dataset?.pipelineDataPath; + const { pipelineDataPath, emptySvgPath, dagDocPath } = el?.dataset; + // eslint-disable-next-line no-new new Vue({ el, @@ -161,7 +164,9 @@ const createDagApp = () => { render(createElement) { return createElement('dag', { props: { - graphUrl, + graphUrl: pipelineDataPath, + emptySvgPath, + dagDocPath, }, }); }, @@ -175,7 +180,6 @@ export default () => { createPipelinesDetailApp(mediator); createPipelineHeaderApp(mediator); - createPipelinesTabs(dataset); - createTestDetails(dataset.testReportsCountEndpoint); + createTestDetails(); createDagApp(); }; |