144 lines
4.8 KiB
JavaScript
144 lines
4.8 KiB
JavaScript
import { nextTick } from 'vue';
|
|
import { mount } from '@vue/test-utils';
|
|
|
|
import { TEST_HOST } from 'helpers/test_constants';
|
|
import JobDetail from '~/ide/components/jobs/detail.vue';
|
|
import { createStore } from '~/ide/stores';
|
|
import { jobs } from '../../mock_data';
|
|
|
|
describe('IDE jobs detail view', () => {
|
|
let wrapper;
|
|
let store;
|
|
|
|
const createComponent = () => {
|
|
store = createStore();
|
|
|
|
store.state.pipelines.detailJob = {
|
|
...jobs[0],
|
|
isLoading: true,
|
|
output: 'testing',
|
|
rawPath: `${TEST_HOST}/raw`,
|
|
};
|
|
|
|
jest.spyOn(store, 'dispatch');
|
|
store.dispatch.mockResolvedValue();
|
|
|
|
wrapper = mount(JobDetail, { store });
|
|
};
|
|
|
|
const findBuildJobLog = () => wrapper.find('pre');
|
|
const findScrollToBottomButton = () => wrapper.find('button[aria-label="Scroll to bottom"]');
|
|
const findScrollToTopButton = () => wrapper.find('button[aria-label="Scroll to top"]');
|
|
|
|
beforeEach(() => {
|
|
createComponent();
|
|
});
|
|
|
|
describe('mounted', () => {
|
|
const findJobOutput = () => wrapper.find('.bash');
|
|
const findBuildLoaderAnimation = () => wrapper.find('.build-loader-animation');
|
|
|
|
it('calls fetchJobLogs', () => {
|
|
expect(store.dispatch).toHaveBeenCalledWith('pipelines/fetchJobLogs', undefined);
|
|
});
|
|
|
|
it('scrolls to bottom', () => {
|
|
expect(findBuildJobLog().element.scrollTo).toHaveBeenCalled();
|
|
});
|
|
|
|
it('renders job output', () => {
|
|
expect(findJobOutput().text()).toContain('testing');
|
|
});
|
|
|
|
it('renders empty message output', async () => {
|
|
store.state.pipelines.detailJob.output = '';
|
|
await nextTick();
|
|
|
|
expect(findJobOutput().text()).toContain('No messages were logged');
|
|
});
|
|
|
|
it('renders loading icon', () => {
|
|
expect(findBuildLoaderAnimation().exists()).toBe(true);
|
|
expect(findBuildLoaderAnimation().isVisible()).toBe(true);
|
|
});
|
|
|
|
it('hides output when loading', () => {
|
|
expect(findJobOutput().exists()).toBe(true);
|
|
expect(findJobOutput().isVisible()).toBe(false);
|
|
});
|
|
|
|
it('hide loading icon when isLoading is false', async () => {
|
|
store.state.pipelines.detailJob.isLoading = false;
|
|
await nextTick();
|
|
|
|
expect(findBuildLoaderAnimation().isVisible()).toBe(false);
|
|
});
|
|
|
|
it('resets detailJob when clicking header button', async () => {
|
|
await wrapper.find('.btn').trigger('click');
|
|
|
|
expect(store.dispatch).toHaveBeenCalledWith('pipelines/setDetailJob', null);
|
|
});
|
|
|
|
it('renders raw path link', () => {
|
|
expect(wrapper.find('.controllers-buttons').attributes('href')).toBe(`${TEST_HOST}/raw`);
|
|
});
|
|
});
|
|
|
|
describe('scroll buttons', () => {
|
|
beforeEach(() => {
|
|
createComponent();
|
|
});
|
|
|
|
it.each`
|
|
fnName | btnName | scrollPos | targetScrollPos
|
|
${'scroll down'} | ${'down'} | ${0} | ${200}
|
|
${'scroll up'} | ${'up'} | ${200} | ${0}
|
|
`('triggers $fnName when clicking $btnName button', async ({ scrollPos, targetScrollPos }) => {
|
|
jest.spyOn(findBuildJobLog().element, 'offsetHeight', 'get').mockReturnValue(0);
|
|
jest.spyOn(findBuildJobLog().element, 'scrollHeight', 'get').mockReturnValue(200);
|
|
jest.spyOn(findBuildJobLog().element, 'scrollTop', 'get').mockReturnValue(scrollPos);
|
|
findBuildJobLog().element.scrollTo.mockReset();
|
|
|
|
await findBuildJobLog().trigger('scroll'); // trigger button updates
|
|
|
|
await wrapper.find('.controllers button:not(:disabled)').trigger('click');
|
|
|
|
expect(findBuildJobLog().element.scrollTo).toHaveBeenCalledWith(0, targetScrollPos);
|
|
});
|
|
});
|
|
|
|
describe('scrolling build log', () => {
|
|
beforeEach(() => {
|
|
jest.spyOn(findBuildJobLog().element, 'offsetHeight', 'get').mockReturnValue(100);
|
|
jest.spyOn(findBuildJobLog().element, 'scrollHeight', 'get').mockReturnValue(200);
|
|
});
|
|
|
|
it('keeps scroll at bottom when already at the bottom', async () => {
|
|
jest.spyOn(findBuildJobLog().element, 'scrollTop', 'get').mockReturnValue(100);
|
|
|
|
await findBuildJobLog().trigger('scroll');
|
|
|
|
expect(findScrollToBottomButton().attributes('disabled')).toBeDefined();
|
|
expect(findScrollToTopButton().attributes('disabled')).toBeUndefined();
|
|
});
|
|
|
|
it('keeps scroll at top when already at top', async () => {
|
|
jest.spyOn(findBuildJobLog().element, 'scrollTop', 'get').mockReturnValue(0);
|
|
|
|
await findBuildJobLog().trigger('scroll');
|
|
|
|
expect(findScrollToBottomButton().attributes('disabled')).toBeUndefined();
|
|
expect(findScrollToTopButton().attributes('disabled')).toBeDefined();
|
|
});
|
|
|
|
it('resets scroll when not at top or bottom', async () => {
|
|
jest.spyOn(findBuildJobLog().element, 'scrollTop', 'get').mockReturnValue(10);
|
|
|
|
await findBuildJobLog().trigger('scroll');
|
|
|
|
expect(findScrollToBottomButton().attributes('disabled')).toBeUndefined();
|
|
expect(findScrollToTopButton().attributes('disabled')).toBeUndefined();
|
|
});
|
|
});
|
|
});
|