diff --git a/src/components/Tabs.vue b/src/components/Tabs.vue index 7a7439a..9ded1da 100644 --- a/src/components/Tabs.vue +++ b/src/components/Tabs.vue @@ -86,9 +86,6 @@ export default { created () { window.addEventListener('beforeunload', this.leavingSqliteviz) }, - unmounted () { - window.removeEventListener('beforeunload', this.leavingSqliteviz) - }, methods: { leavingSqliteviz (event) { if (this.tabs.some(tab => tab.isUnsaved)) { diff --git a/tests/unit/components/Tabs.spec.js b/tests/unit/components/Tabs.spec.js index 5259f2b..b373a34 100644 --- a/tests/unit/components/Tabs.spec.js +++ b/tests/unit/components/Tabs.spec.js @@ -229,4 +229,47 @@ describe('Tabs.vue', () => { // check that the dialog is closed expect(wrapper.find('[data-modal="close-warn"]').exists()).to.equal(false) }) + + it('Prevents closing a tab of a browser if there is unsaved query', () => { + // mock store state + const state = { + tabs: [ + { id: 1, name: 'foo', query: 'select * from foo', chart: [], isUnsaved: false }, + { id: 2, name: null, tempName: 'Untitled', query: '', chart: [], isUnsaved: true } + ], + currentTabId: 2 + } + + const store = new Vuex.Store({ state, mutations }) + + // mount the component + const wrapper = shallowMount(Tabs, { store }) + + const event = new Event('beforeunload') + sinon.spy(event, 'preventDefault') + wrapper.vm.leavingSqliteviz(event) + + expect(event.preventDefault.calledOnce).to.equal(true) + }) + + it("Doesn't prevent closing a tab of a browser if there is unsaved query", () => { + // mock store state + const state = { + tabs: [ + { id: 1, name: 'foo', query: 'select * from foo', chart: [], isUnsaved: false } + ], + currentTabId: 1 + } + + const store = new Vuex.Store({ state, mutations }) + + // mount the component + const wrapper = shallowMount(Tabs, { store }) + + const event = new Event('beforeunload') + sinon.spy(event, 'preventDefault') + wrapper.vm.leavingSqliteviz(event) + + expect(event.preventDefault.calledOnce).to.equal(false) + }) })