Commit 4b1d91e1 authored by Frédéric Caplette's avatar Frédéric Caplette

Merge branch '216979-link-to-attachments' into 'master'

Add link to test case attachment in test report

See merge request gitlab-org/gitlab!60528
parents a72c81dd a6df1fc3
<script>
import { GlBadge, GlModal } from '@gitlab/ui';
import { __, n__, sprintf } from '~/locale';
import { GlBadge, GlFriendlyWrap, GlLink, GlModal } from '@gitlab/ui';
import { __, n__, s__, sprintf } from '~/locale';
import CodeBlock from '~/vue_shared/components/code_block.vue';
export default {
......@@ -8,6 +8,8 @@ export default {
components: {
CodeBlock,
GlBadge,
GlFriendlyWrap,
GlLink,
GlModal,
},
props: {
......@@ -50,6 +52,7 @@ export default {
duration: __('Execution time'),
history: __('History'),
trace: __('System output'),
attachment: s__('TestReports|Attachment'),
},
modalCloseButton: {
text: __('Close'),
......@@ -85,6 +88,18 @@ export default {
</div>
</div>
<div v-if="testCase.attachment_url" class="gl-display-flex gl-flex-wrap gl-mx-n4 gl-my-3">
<strong class="gl-text-right col-sm-3">{{ $options.text.attachment }}</strong>
<gl-link
class="col-sm-9"
:href="testCase.attachment_url"
target="_blank"
data-testid="test-case-attachment-url"
>
<gl-friendly-wrap :symbols="$options.wrapSymbols" :text="testCase.attachment_url" />
</gl-link>
</div>
<div
v-if="testCase.system_output"
class="gl-display-flex gl-flex-wrap gl-mx-n4 gl-my-3"
......
......@@ -31588,6 +31588,9 @@ msgstr ""
msgid "TestReports|%{rate}%{sign} success rate"
msgstr ""
msgid "TestReports|Attachment"
msgstr ""
msgid "TestReports|Jobs"
msgstr ""
......
import { GlModal } from '@gitlab/ui';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import TestCaseDetails from '~/pipelines/components/test_reports/test_case_details.vue';
import CodeBlock from '~/vue_shared/components/code_block.vue';
......@@ -18,24 +19,27 @@ describe('Test case details', () => {
system_output: 'Line 42 is broken',
};
const findModal = () => wrapper.find(GlModal);
const findName = () => wrapper.find('[data-testid="test-case-name"]');
const findDuration = () => wrapper.find('[data-testid="test-case-duration"]');
const findRecentFailures = () => wrapper.find('[data-testid="test-case-recent-failures"]');
const findSystemOutput = () => wrapper.find('[data-testid="test-case-trace"]');
const findModal = () => wrapper.findComponent(GlModal);
const findName = () => wrapper.findByTestId('test-case-name');
const findDuration = () => wrapper.findByTestId('test-case-duration');
const findRecentFailures = () => wrapper.findByTestId('test-case-recent-failures');
const findAttachmentUrl = () => wrapper.findByTestId('test-case-attachment-url');
const findSystemOutput = () => wrapper.findByTestId('test-case-trace');
const createComponent = (testCase = {}) => {
wrapper = shallowMount(TestCaseDetails, {
localVue,
propsData: {
modalId: 'my-modal',
testCase: {
...defaultTestCase,
...testCase,
wrapper = extendedWrapper(
shallowMount(TestCaseDetails, {
localVue,
propsData: {
modalId: 'my-modal',
testCase: {
...defaultTestCase,
...testCase,
},
},
},
stubs: { CodeBlock, GlModal },
});
stubs: { CodeBlock, GlModal },
}),
);
};
afterEach(() => {
......@@ -91,6 +95,25 @@ describe('Test case details', () => {
});
});
describe('when test case has attachment URL', () => {
it('renders the attachment URL as a link', () => {
const expectedUrl = '/my/path.jpg';
createComponent({ attachment_url: expectedUrl });
const attachmentUrl = findAttachmentUrl();
expect(attachmentUrl.exists()).toBe(true);
expect(attachmentUrl.attributes('href')).toBe(expectedUrl);
});
});
describe('when test case does not have attachment URL', () => {
it('does not render the attachment URL', () => {
createComponent({ attachment_url: null });
expect(findAttachmentUrl().exists()).toBe(false);
});
});
describe('when test case has system output', () => {
it('renders the test case system output', () => {
createComponent();
......
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