zynfly/sqliteviz
1
0
Fork 0
mirror of https://github.com/lana-k/sqliteviz.git synced 2025-12-08 11:08:55 +08:00
Code Issues Projects Releases Wiki Activity

fix tests

Browse Source
This commit is contained in:
lana-k
2025-03-09 21:57:36 +01:00
parent 828cad6439
commit b5504b91ce
48 changed files with 7871 additions and 29372 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
tests/views/Main/Workspace/Tabs/Tab/Tab.spec.js
View File

@@ -1,9 +1,10 @@
import { expect } from 'chai'
import sinon from 'sinon'
import { mount, DOMWrapper } from '@vue/test-utils'
import { mount } from '@vue/test-utils'
import mutations from '@/store/mutations'
import Vuex from 'vuex'
import { createStore } from 'vuex'
import Tab from '@/views/Main/Workspace/Tabs/Tab'
import { nextTick } from 'vue'
let place
@@ -18,19 +19,20 @@ describe('Tab.vue', () => {
place.remove()
})
it('Renders passed query', () => {
it('Renders passed query', async () => {
// mock store state
const state = {
currentTabId: 1
currentTabId: 1,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
attachTo: place,
store,
global: {
stubs: ['chart']
stubs: { 'chart': true, 'icon-button': true },
plugins: [store]
},
props: {
tab: {
@@ -52,26 +54,28 @@ describe('Tab.vue', () => {
}
}
})
await nextTick()
expect(wrapper.find('.tab-content-container').isVisible()).to.equal(true)
expect(wrapper.find('.bottomPane .run-result-panel').exists()).to.equal(true)
expect(wrapper.find('.run-result-panel .result-before').isVisible()).to.equal(true)
expect(wrapper.find('.above .sql-editor-panel .codemirror-container').text())
.to.equal('SELECT * FROM foo')
.to.contain('SELECT * FROM foo')
})
it("Doesn't render tab when it's not active", () => {
it("Doesn't render tab when it's not active", async () => {
// mock store state
const state = {
currentTabId: 0
currentTabId: 0,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab: {
@@ -93,22 +97,25 @@ describe('Tab.vue', () => {
}
}
})
await nextTick()
expect(wrapper.find('.tab-content-container').isVisible()).to.equal(false)
})
it('Is not visible when not active', async () => {
// mock store state
const state = {
currentTabId: 0
currentTabId: 0,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab: {
@@ -130,13 +137,14 @@ describe('Tab.vue', () => {
}
}
})
await nextTick()
expect(wrapper.find('.tab-content-container').isVisible()).to.equal(false)
})
it('Update tab state when a query is changed', async () => {
it('Updates tab state when a query is changed', async () => {
// mock store state
const state = {
isWorkspaceVisible: true,
tabs: [
{
id: 1,
@@ -160,25 +168,28 @@ describe('Tab.vue', () => {
currentTabId: 1
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab: state.tabs[0]
tab: store.state.tabs[0]
}
})
await wrapper.findComponent({ name: 'SqlEditor' }).vm.$emit('input', ' limit 100')
expect(state.tabs[0].isSaved).to.equal(false)
await nextTick()
await wrapper.findComponent({ name: 'SqlEditor' }).setValue(' limit 100')
expect(store.state.tabs[0].isSaved).to.equal(false)
})
it('Update tab state when data view settings are changed', async () => {
it('Updates tab state when data view settings are changed', async () => {
// mock store state
const state = {
isWorkspaceVisible: true,
tabs: [
{
id: 1,
@@ -202,30 +213,25 @@ describe('Tab.vue', () => {
currentTabId: 1
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab: state.tabs[0]
tab: store.state.tabs[0]
}
})
await nextTick()
await wrapper.findComponent({ name: 'DataView' }).vm.$emit('update')
expect(state.tabs[0].isSaved).to.equal(false)
expect(store.state.tabs[0].isSaved).to.equal(false)
})
it('Shows .result-in-progress message when executing query', async () => {
// mock store state
const state = {
currentTabId: 1
}
const store = new Vuex.Store({ state, mutations })
// mount the component
const tab = {
id: 1,
name: 'foo',
@@ -244,28 +250,34 @@ describe('Tab.vue', () => {
time: 0,
isSaved: true
}
// mock store state
const state = {
currentTabId: 1,
isWorkspaceVisible: true,
tabs: [tab]
}
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true, 'icon-button': true },
plugins: [store]
},
props: {
tab
}
})
await nextTick()
tab.isGettingResults = true
await wrapper.vm.$nextTick()
expect(wrapper.find('.run-result-panel .result-in-progress').isVisible()).to.equal(true)
store.state.tabs[0].isGettingResults = true
await nextTick()
expect(wrapper.find('.run-result-panel .result-in-progress').exists()).to.equal(true)
})
it('Shows error when executing query ends with error', async () => {
// mock store state
const state = {
currentTabId: 1
}
const store = new Vuex.Store({ state, mutations })
const tab = {
id: 1,
name: 'foo',
@@ -284,22 +296,33 @@ describe('Tab.vue', () => {
time: 0,
isSaved: true
}
// mock store state
const state = {
currentTabId: 1,
isWorkspaceVisible: true,
tabs: [tab]
}
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true, 'icon-button': true, },
plugins: [store]
},
props: {
tab
tab: store.state.tabs[0]
}
})
tab.error = {
await nextTick()
store.state.tabs[0].error = {
type: 'error',
message: 'There is no table foo'
}
await wrapper.vm.$nextTick()
await nextTick()
expect(wrapper.find('.run-result-panel .result-before').isVisible()).to.equal(false)
expect(wrapper.find('.run-result-panel .result-in-progress').exists()).to.equal(false)
expect(wrapper.findComponent({ name: 'logs' }).isVisible()).to.equal(true)
@@ -314,11 +337,6 @@ describe('Tab.vue', () => {
name: ['foo', 'bar']
}
}
// mock store state
const state = {
currentTabId: 1
}
const tab = {
id: 1,
name: 'foo',
@@ -337,22 +355,29 @@ describe('Tab.vue', () => {
time: 0,
isSaved: true
}
// mock store state
const state = {
currentTabId: 1,
isWorkspaceVisible: true,
tabs: [tab]
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
// mount the component
const wrapper = mount(Tab, {
store,
attachTo: place,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab
}
})
tab.result = result
await wrapper.vm.$nextTick()
await nextTick()
store.state.tabs[0].result = result
await nextTick()
expect(wrapper.find('.run-result-panel .result-before').isVisible()).to.equal(false)
expect(wrapper.find('.run-result-panel .result-in-progress').exists()).to.equal(false)
expect(wrapper.findComponent({ name: 'logs' }).exists()).to.equal(false)
@@ -361,10 +386,11 @@ describe('Tab.vue', () => {
it('Switches views', async () => {
const state = {
currentTabId: 1
currentTabId: 1,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
const tab = {
id: 1,
@@ -387,49 +413,50 @@ describe('Tab.vue', () => {
const wrapper = mount(Tab, {
attachTo: place,
store,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab
}
})
let tableBtn = new DOMWrapper(wrapper.find('.above .side-tool-bar')
.findComponent({ name: 'tableIcon' }).vm.$parent)
await tableBtn.trigger('click')
let tableBtn = wrapper.find('.above .side-tool-bar')
.findComponent({ ref: 'tableBtn' })
await tableBtn.vm.$emit('click')
expect(wrapper.find('.bottomPane .sql-editor-panel').exists()).to.equal(true)
expect(wrapper.find('.above .run-result-panel').exists()).to.equal(true)
const dataViewBtn = new DOMWrapper(wrapper.find('.above .side-tool-bar')
.findComponent({ name: 'dataViewIcon' }).vm.$parent)
await dataViewBtn.trigger('click')
const dataViewBtn = wrapper.find('.above .side-tool-bar')
.findComponent({ ref: 'dataViewBtn' })
await dataViewBtn.vm.$emit('click')
expect(wrapper.find('.bottomPane .sql-editor-panel').exists()).to.equal(true)
expect(wrapper.find('.above .data-view-panel').exists()).to.equal(true)
const sqlEditorBtn = new DOMWrapper(wrapper.find('.above .side-tool-bar')
.findComponent({ name: 'sqlEditorIcon' }).vm.$parent)
await sqlEditorBtn.trigger('click')
const sqlEditorBtn = wrapper.find('.above .side-tool-bar')
.findComponent({ ref: 'sqlEditorBtn' })
await sqlEditorBtn.vm.$emit('click')
expect(wrapper.find('.above .sql-editor-panel').exists()).to.equal(true)
expect(wrapper.find('.bottomPane .data-view-panel').exists()).to.equal(true)
tableBtn = new DOMWrapper(wrapper.find('.bottomPane .side-tool-bar')
.findComponent({ name: 'tableIcon' }).vm.$parent)
await tableBtn.trigger('click')
tableBtn = wrapper.find('.bottomPane .side-tool-bar')
.findComponent({ ref: 'tableBtn' })
await tableBtn.vm.$emit('click')
expect(wrapper.find('.above .sql-editor-panel').exists()).to.equal(true)
expect(wrapper.find('.bottomPane .run-result-panel').exists()).to.equal(true)
})
it('Maximize top panel if maximized panel is above', () => {
it('Maximize top panel if maximized panel is above', async () => {
const state = {
currentTabId: 1
currentTabId: 1,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
const tab = {
id: 1,
name: 'foo',
@@ -452,24 +479,26 @@ describe('Tab.vue', () => {
const wrapper = mount(Tab, {
attachTo: place,
store,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab
}
})
await nextTick()
expect(wrapper.find('.above').element.parentElement.style.height)
.to.equal('100%')
})
it('Maximize bottom panel if maximized panel is below', () => {
it('Maximize bottom panel if maximized panel is below', async () => {
const state = {
currentTabId: 1
currentTabId: 1,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
const tab = {
id: 1,
name: 'foo',
@@ -492,24 +521,25 @@ describe('Tab.vue', () => {
const wrapper = mount(Tab, {
attachTo: place,
store,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab
}
})
await nextTick()
expect(wrapper.find('.bottomPane').element.parentElement.style.height)
.to.equal('100%')
})
it('Panel size is 50 is nothing to maximize', () => {
it('Panel size is 50 if nothing to maximize', async () => {
const state = {
currentTabId: 1
currentTabId: 1,
isWorkspaceVisible: true
}
const store = new Vuex.Store({ state, mutations })
const store = createStore({ state, mutations })
const tab = {
id: 1,
name: 'foo',
@@ -531,15 +561,16 @@ describe('Tab.vue', () => {
const wrapper = mount(Tab, {
attachTo: place,
store,
global: {
stubs: ['chart']
stubs: { 'chart': true },
plugins: [store]
},
props: {
tab
}
})
await nextTick()
expect(wrapper.find('.above').element.parentElement.style.height)
.to.equal('50%')
expect(wrapper.find('.bottomPane').element.parentElement.style.height)