Commit 95b47df5 authored by Winnie Hellmann's avatar Winnie Hellmann Committed by Clement Ho

Clear refresh interval when MRWidgetFailedToMerge component is destroyed

parent c73b5d31
<script>
import { n__ } from '~/locale';
import statusIcon from '../mr_widget_status_icon.vue';
import eventHub from '../../event_hub';
import { n__ } from '~/locale';
import statusIcon from '../mr_widget_status_icon.vue';
import eventHub from '../../event_hub';
export default {
export default {
name: 'MRWidgetFailedToMerge',
components: {
......@@ -22,6 +22,7 @@
return {
timer: 10,
isRefreshing: false,
intervalId: null,
};
},
......@@ -36,15 +37,19 @@
},
mounted() {
setInterval(() => {
this.updateTimer();
}, 1000);
this.intervalId = setInterval(this.updateTimer, 1000);
},
created() {
eventHub.$emit('DisablePolling');
},
beforeDestroy() {
if (this.intervalId) {
clearInterval(this.intervalId);
}
},
methods: {
refresh() {
this.isRefreshing = true;
......@@ -59,8 +64,7 @@
}
},
},
};
};
</script>
<template>
<div class="mr-widget-body media">
......
......@@ -4,21 +4,37 @@ import eventHub from '~/vue_merge_request_widget/event_hub';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
describe('MRWidgetFailedToMerge', () => {
const dummyIntervalId = 1337;
let Component;
let vm;
beforeEach(() => {
Component = Vue.extend(failedToMergeComponent);
spyOn(eventHub, '$emit');
vm = mountComponent(Component, { mr: {
spyOn(window, 'setInterval').and.returnValue(dummyIntervalId);
spyOn(window, 'clearInterval').and.stub();
vm = mountComponent(Component, {
mr: {
mergeError: 'Merge error happened.',
} });
},
});
});
afterEach(() => {
vm.$destroy();
});
it('sets interval to refresh', () => {
expect(window.setInterval).toHaveBeenCalledWith(vm.updateTimer, 1000);
expect(vm.intervalId).toBe(dummyIntervalId);
});
it('clears interval when destroying ', () => {
vm.$destroy();
expect(window.clearInterval).toHaveBeenCalledWith(dummyIntervalId);
});
describe('computed', () => {
describe('timerText', () => {
it('should return correct timer text', () => {
......@@ -65,11 +81,13 @@ describe('MRWidgetFailedToMerge', () => {
});
describe('while it is refreshing', () => {
it('renders Refresing now', (done) => {
it('renders Refresing now', done => {
vm.isRefreshing = true;
Vue.nextTick(() => {
expect(vm.$el.querySelector('.js-refresh-label').textContent.trim()).toEqual('Refreshing now');
expect(vm.$el.querySelector('.js-refresh-label').textContent.trim()).toEqual(
'Refreshing now',
);
done();
});
});
......@@ -78,11 +96,15 @@ describe('MRWidgetFailedToMerge', () => {
describe('while it is not regresing', () => {
it('renders warning icon and disabled merge button', () => {
expect(vm.$el.querySelector('.js-ci-status-icon-warning')).not.toBeNull();
expect(vm.$el.querySelector('.js-disabled-merge-button').getAttribute('disabled')).toEqual('disabled');
expect(vm.$el.querySelector('.js-disabled-merge-button').getAttribute('disabled')).toEqual(
'disabled',
);
});
it('renders given error', () => {
expect(vm.$el.querySelector('.has-error-message').textContent.trim()).toEqual('Merge error happened..');
expect(vm.$el.querySelector('.has-error-message').textContent.trim()).toEqual(
'Merge error happened..',
);
});
it('renders refresh button', () => {
......@@ -90,13 +112,13 @@ describe('MRWidgetFailedToMerge', () => {
});
it('renders remaining time', () => {
expect(
vm.$el.querySelector('.has-custom-error').textContent.trim(),
).toEqual('Refreshing in 10 seconds to show the updated status...');
expect(vm.$el.querySelector('.has-custom-error').textContent.trim()).toEqual(
'Refreshing in 10 seconds to show the updated status...',
);
});
});
it('should just generic merge failed message if merge_error is not available', (done) => {
it('should just generic merge failed message if merge_error is not available', done => {
vm.mr.mergeError = null;
Vue.nextTick(() => {
......@@ -106,7 +128,7 @@ describe('MRWidgetFailedToMerge', () => {
});
});
it('should show refresh label when refresh requested', (done) => {
it('should show refresh label when refresh requested', done => {
vm.refresh();
Vue.nextTick(() => {
expect(vm.$el.innerText).not.toContain('Merge failed. Refreshing');
......
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