summaryrefslogtreecommitdiff
path: root/spec/javascripts
diff options
context:
space:
mode:
authorFilipa Lacerda <filipa@gitlab.com>2019-09-04 14:10:29 +0000
committerKushal Pandya <kushalspandya@gmail.com>2019-09-04 14:10:29 +0000
commitbe449e23e319cbaa15c226560b9fa52ec4aa326e (patch)
treea1eb5963ebf19ac31902c6f7d98a7c6230b998f5 /spec/javascripts
parent0da3257c35b6c8c527c3a66b26548c134765829f (diff)
downloadgitlab-ce-be449e23e319cbaa15c226560b9fa52ec4aa326e.tar.gz
Creates base components for new job log
Creates a link component, a line component and a clickable line component to handle the new job log format
Diffstat (limited to 'spec/javascripts')
-rw-r--r--spec/javascripts/jobs/components/log/line_header_spec.js84
-rw-r--r--spec/javascripts/jobs/components/log/line_number_spec.js40
-rw-r--r--spec/javascripts/jobs/components/log/line_spec.js49
3 files changed, 173 insertions, 0 deletions
diff --git a/spec/javascripts/jobs/components/log/line_header_spec.js b/spec/javascripts/jobs/components/log/line_header_spec.js
new file mode 100644
index 00000000000..4efd412a6cd
--- /dev/null
+++ b/spec/javascripts/jobs/components/log/line_header_spec.js
@@ -0,0 +1,84 @@
+import { mount } from '@vue/test-utils';
+import LineHeader from '~/jobs/components/log/line_header.vue';
+import LineNumber from '~/jobs/components/log/line_number.vue';
+
+describe('Job Log Header Line', () => {
+ let wrapper;
+
+ const data = {
+ line: {
+ content: [
+ {
+ text: 'Running with gitlab-runner 12.1.0 (de7731dd)',
+ style: 'term-fg-l-green',
+ },
+ ],
+ lineNumber: 0,
+ },
+ isClosed: true,
+ path: '/jashkenas/underscore/-/jobs/335',
+ };
+
+ const createComponent = (props = {}) => {
+ wrapper = mount(LineHeader, {
+ sync: false,
+ propsData: {
+ ...props,
+ },
+ });
+ };
+
+ afterEach(() => {
+ wrapper.destroy();
+ });
+
+ describe('line', () => {
+ beforeEach(() => {
+ createComponent(data);
+ });
+
+ it('renders the line number component', () => {
+ expect(wrapper.contains(LineNumber)).toBe(true);
+ });
+
+ it('renders a span the provided text', () => {
+ expect(wrapper.find('span').text()).toBe(data.line.content[0].text);
+ });
+
+ it('renders the provided style as a class attribute', () => {
+ expect(wrapper.find('span').classes()).toContain(data.line.content[0].style);
+ });
+ });
+
+ describe('when isCloses is true', () => {
+ beforeEach(() => {
+ createComponent({ ...data, isClosed: true });
+ });
+
+ it('sets icon name to be angle-right', () => {
+ expect(wrapper.vm.iconName).toEqual('angle-right');
+ });
+ });
+
+ describe('when isCloses is false', () => {
+ beforeEach(() => {
+ createComponent({ ...data, isClosed: false });
+ });
+
+ it('sets icon name to be angle-down', () => {
+ expect(wrapper.vm.iconName).toEqual('angle-down');
+ });
+ });
+
+ describe('on click', () => {
+ beforeEach(() => {
+ createComponent(data);
+ });
+
+ it('emits toggleLine event', () => {
+ wrapper.trigger('click');
+
+ expect(wrapper.emitted().toggleLine.length).toBe(1);
+ });
+ });
+});
diff --git a/spec/javascripts/jobs/components/log/line_number_spec.js b/spec/javascripts/jobs/components/log/line_number_spec.js
new file mode 100644
index 00000000000..fcf2edf9159
--- /dev/null
+++ b/spec/javascripts/jobs/components/log/line_number_spec.js
@@ -0,0 +1,40 @@
+import { shallowMount } from '@vue/test-utils';
+import LineNumber from '~/jobs/components/log/line_number.vue';
+
+describe('Job Log Line Number', () => {
+ let wrapper;
+
+ const data = {
+ lineNumber: 0,
+ path: '/jashkenas/underscore/-/jobs/335',
+ };
+
+ const createComponent = (props = {}) => {
+ wrapper = shallowMount(LineNumber, {
+ sync: false,
+ propsData: {
+ ...props,
+ },
+ });
+ };
+
+ beforeEach(() => {
+ createComponent(data);
+ });
+
+ afterEach(() => {
+ wrapper.destroy();
+ });
+
+ it('renders incremented lineNunber by 1', () => {
+ expect(wrapper.text()).toBe('1');
+ });
+
+ it('renders link with lineNumber as an ID', () => {
+ expect(wrapper.attributes().id).toBe('L1');
+ });
+
+ it('links to the provided path with line number as anchor', () => {
+ expect(wrapper.attributes().href).toBe(`${data.path}#L1`);
+ });
+});
diff --git a/spec/javascripts/jobs/components/log/line_spec.js b/spec/javascripts/jobs/components/log/line_spec.js
new file mode 100644
index 00000000000..ea593e3c39a
--- /dev/null
+++ b/spec/javascripts/jobs/components/log/line_spec.js
@@ -0,0 +1,49 @@
+import { shallowMount } from '@vue/test-utils';
+import Line from '~/jobs/components/log/line.vue';
+import LineNumber from '~/jobs/components/log/line_number.vue';
+
+describe('Job Log Line', () => {
+ let wrapper;
+
+ const data = {
+ line: {
+ content: [
+ {
+ text: 'Running with gitlab-runner 12.1.0 (de7731dd)',
+ style: 'term-fg-l-green',
+ },
+ ],
+ lineNumber: 0,
+ },
+ path: '/jashkenas/underscore/-/jobs/335',
+ };
+
+ const createComponent = (props = {}) => {
+ wrapper = shallowMount(Line, {
+ sync: false,
+ propsData: {
+ ...props,
+ },
+ });
+ };
+
+ beforeEach(() => {
+ createComponent(data);
+ });
+
+ afterEach(() => {
+ wrapper.destroy();
+ });
+
+ it('renders the line number component', () => {
+ expect(wrapper.contains(LineNumber)).toBe(true);
+ });
+
+ it('renders a span the provided text', () => {
+ expect(wrapper.find('span').text()).toBe(data.line.content[0].text);
+ });
+
+ it('renders the provided style as a class attribute', () => {
+ expect(wrapper.find('span').classes()).toContain(data.line.content[0].style);
+ });
+});