1
0
mirror of https://github.com/lana-k/sqliteviz.git synced 2025-12-06 18:18:53 +08:00

fix tests

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

View File

@@ -1,8 +1,11 @@
import { expect } from 'chai'
import { mount, DOMWrapper } from '@vue/test-utils'
import { mount } from '@vue/test-utils'
import RunResult from '@/views/Main/Workspace/Tabs/Tab/RunResult'
import csv from '@/lib/csv'
import sinon from 'sinon'
import { nextTick } from 'vue'
const $store = { state: { isWorkspaceVisible: true } }
describe('RunResult.vue', () => {
afterEach(() => {
@@ -23,10 +26,14 @@ describe('RunResult.vue', () => {
name: ['foo']
}
}
},
global: {
mocks: { $store },
stubs: { teleport: true, transition: false }
}
})
const copyBtn = new DOMWrapper(wrapper.findComponent({ name: 'clipboardIcon' }).vm.$parent)
const copyBtn = wrapper.findComponent({ ref: 'copyToClipboardBtn' })
await copyBtn.trigger('click')
expect(
@@ -38,12 +45,14 @@ describe('RunResult.vue', () => {
).to.equal(true)
window.ClipboardItem = ClipboardItem
wrapper.unmount()
})
it('copy to clipboard more than 1 sec', async () => {
sinon.stub(window.navigator.clipboard, 'writeText').resolves()
const clock = sinon.useFakeTimers()
const wrapper = mount(RunResult, {
attachTo: document.body,
props: {
tab: { id: 1 },
result: {
@@ -53,6 +62,10 @@ describe('RunResult.vue', () => {
name: ['foo']
}
}
},
global: {
mocks: { $store },
stubs: { teleport: true, transition: false }
}
})
sinon.stub(csv, 'serialize').callsFake(() => {
@@ -60,36 +73,43 @@ describe('RunResult.vue', () => {
})
// Click copy to clipboard
const copyBtn = new DOMWrapper(wrapper.findComponent({ name: 'clipboardIcon' }).vm.$parent)
const copyBtn = wrapper.findComponent({ ref: 'copyToClipboardBtn' })
await copyBtn.trigger('click')
await nextTick()
// The dialog is shown...
expect(wrapper.find('[data-modal="prepareCSVCopy"]').exists()).to.equal(true)
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
expect(wrapper.find('.dialog.vfm .dialog-header').text())
.to.contain('Copy to clipboard')
// ... with Building message...
expect(wrapper.find('.dialog-body').text()).to.equal('Building CSV...')
// Switch to microtasks (let serialize run)
clock.tick(0)
await wrapper.vm.$nextTick()
await clock.tick(0)
await nextTick()
// The dialog is shown...
expect(wrapper.find('[data-modal="prepareCSVCopy"]').exists()).to.equal(true)
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
// ... with Ready message...
expect(wrapper.find('.dialog-body').text()).to.equal('CSV is ready')
// Click copy
await wrapper.find('.dialog-buttons-container button.primary').trigger('click')
await window.navigator.clipboard.writeText.returnValues[0]
// The dialog is not shown...
expect(wrapper.find('[data-modal="prepareCSVCopy"]').exists()).to.equal(false)
await clock.tick(100)
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
wrapper.unmount()
})
it('copy to clipboard less than 1 sec', async () => {
sinon.stub(window.navigator.clipboard, 'writeText').resolves()
const clock = sinon.useFakeTimers()
const wrapper = mount(RunResult, {
attachTo: document.body,
props: {
tab: { id: 1 },
result: {
@@ -99,31 +119,38 @@ describe('RunResult.vue', () => {
name: ['foo']
}
}
},
global: {
mocks: { $store },
stubs: { teleport: true, transition: false }
}
})
sinon.spy(wrapper.vm, 'copyToClipboard')
sinon.stub(csv, 'serialize').callsFake(() => {
clock.tick(500)
sinon.stub(csv, 'serialize').callsFake(async () => {
await clock.tick(500)
})
// Click copy to clipboard
const copyBtn = new DOMWrapper(wrapper.findComponent({ name: 'clipboardIcon' }).vm.$parent)
const copyBtn = wrapper.findComponent({ ref: 'copyToClipboardBtn' })
await copyBtn.trigger('click')
// Switch to microtasks (let serialize run)
clock.tick(0)
await wrapper.vm.$nextTick()
await clock.tick(0)
await nextTick()
// The dialog is not shown...
expect(wrapper.find('[data-modal="prepareCSVCopy"]').exists()).to.equal(false)
await clock.tick(100)
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
// copyToClipboard is called
expect(wrapper.vm.copyToClipboard.calledOnce).to.equal(true)
wrapper.unmount()
})
it('cancel long copy', async () => {
sinon.stub(window.navigator.clipboard, 'writeText').resolves()
const clock = sinon.useFakeTimers()
const wrapper = mount(RunResult, {
attachTo: document.body,
props: {
tab: { id: 1 },
result: {
@@ -133,28 +160,33 @@ describe('RunResult.vue', () => {
name: ['foo']
}
}
},
global: {
mocks: { $store },
stubs: { teleport: true, transition: false }
}
})
sinon.spy(wrapper.vm, 'copyToClipboard')
sinon.stub(csv, 'serialize').callsFake(() => {
clock.tick(5000)
sinon.stub(csv, 'serialize').callsFake(async () => {
await clock.tick(5000)
})
// Click copy to clipboard
const copyBtn = new DOMWrapper(wrapper.findComponent({ name: 'clipboardIcon' }).vm.$parent)
const copyBtn = wrapper.findComponent({ ref: 'copyToClipboardBtn' })
await copyBtn.trigger('click')
// Switch to microtasks (let serialize run)
clock.tick(0)
await wrapper.vm.$nextTick()
await clock.tick(0)
await nextTick()
// Click cancel
await wrapper.find('.dialog-buttons-container button.secondary').trigger('click')
// The dialog is not shown...
expect(wrapper.find('[data-modal="prepareCSVCopy"]').exists()).to.equal(false)
await clock.tick(100)
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
// copyToClipboard is not called
expect(wrapper.vm.copyToClipboard.calledOnce).to.equal(false)
wrapper.unmount()
})
it('shows value of selected cell - result set', async () => {
@@ -168,14 +200,16 @@ describe('RunResult.vue', () => {
name: ['foo', 'bar']
}
}
},
global: {
mocks: { $store },
stubs: { teleport: true, transition: false }
}
})
// Open cell value panel
const viewValueBtn = new DOMWrapper(
wrapper.findComponent({ name: 'viewCellValueIcon' }).vm.$parent
)
await viewValueBtn.trigger('click')
const viewValueBtn = wrapper.findComponent({ ref: 'viewCellValueBtn' })
await viewValueBtn.vm.$emit('click')
/*
Result set:
@@ -208,18 +242,18 @@ describe('RunResult.vue', () => {
// Click on 'bar' cell
await rows[1].findAll('td')[1].trigger('click')
expect(wrapper.find('.value-body').text()).to.equals('bar')
// Click on 'bar' cell again
await rows[1].findAll('td')[1].trigger('click')
expect(wrapper.find('.value-viewer-container .table-preview').text())
.to.equals('No cell selected to view')
wrapper.unmount()
})
it('shows value of selected cell - record view', async () => {
const wrapper = mount(RunResult, {
attachTo: document.body,
props: {
tab: { id: 1 },
result: {
@@ -229,20 +263,19 @@ describe('RunResult.vue', () => {
name: ['foo', 'bar']
}
}
},
global: {
mocks: { $store }
}
})
// Open cell value panel
const viewValueBtn = new DOMWrapper(
wrapper.findComponent({ name: 'viewCellValueIcon' }).vm.$parent
)
await viewValueBtn.trigger('click')
const viewValueBtn = wrapper.findComponent({ ref: 'viewCellValueBtn' })
await viewValueBtn.vm.$emit('click')
// Go to record view
const vierRecordBtn = new DOMWrapper(
wrapper.findComponent({ name: 'rowIcon' }).vm.$parent
)
await vierRecordBtn.trigger('click')
const vierRecordBtn = wrapper.findComponent({ ref: 'rowBtn' })
await vierRecordBtn.vm.$emit('click')
/*
Record 1:
@@ -266,7 +299,7 @@ describe('RunResult.vue', () => {
// Go to next record
await wrapper.find('.icon-btn.next').trigger('click')
await wrapper.vm.$nextTick()
await nextTick()
expect(wrapper.find('.value-body').text()).to.equals('bar')
// Go to '2' with up arrow key
@@ -275,7 +308,7 @@ describe('RunResult.vue', () => {
// Go to prev record
await wrapper.find('.icon-btn.prev').trigger('click')
await wrapper.vm.$nextTick()
await nextTick()
expect(wrapper.find('.value-body').text()).to.equals('1')
// Click on 'foo' cell
@@ -287,10 +320,12 @@ describe('RunResult.vue', () => {
await rows[1].find('td').trigger('click')
expect(wrapper.find('.value-viewer-container .table-preview').text())
.to.equals('No cell selected to view')
wrapper.unmount()
})
it('keeps selected cell when switch between record and regular view', async () => {
const wrapper = mount(RunResult, {
attachTo: document.body,
props: {
tab: { id: 1 },
result: {
@@ -300,14 +335,15 @@ describe('RunResult.vue', () => {
name: [...Array(30)].map((x, i) => `name-${i}`)
}
}
},
global: {
mocks: { $store }
}
})
// Open cell value panel
const viewValueBtn = new DOMWrapper(
wrapper.findComponent({ name: 'viewCellValueIcon' }).vm.$parent
)
await viewValueBtn.trigger('click')
const viewValueBtn = wrapper.findComponent({ ref: 'viewCellValueBtn' })
await viewValueBtn.vm.$emit('click')
// Click on 'name-1' cell
const rows = wrapper.findAll('table tbody tr')
@@ -316,10 +352,8 @@ describe('RunResult.vue', () => {
expect(wrapper.find('.value-body').text()).to.equals('name-1')
// Go to record view
const vierRecordBtn = new DOMWrapper(
wrapper.findComponent({ name: 'rowIcon' }).vm.$parent
)
await vierRecordBtn.trigger('click')
const vierRecordBtn = wrapper.findComponent({ ref: 'rowBtn' })
await vierRecordBtn.vm.$emit('click')
// 'name-1' is selected
expect(wrapper.find('.value-body').text()).to.equals('name-1')
@@ -329,7 +363,7 @@ describe('RunResult.vue', () => {
// Go to last record
await wrapper.find('.icon-btn.last').trigger('click')
await wrapper.vm.$nextTick()
await nextTick()
expect(wrapper.find('.value-body').text()).to.equals('name-29')
// Go to '29' with up arrow key
@@ -337,12 +371,13 @@ describe('RunResult.vue', () => {
expect(wrapper.find('.value-body').text()).to.equals('29')
// Go to regular view
await vierRecordBtn.trigger('click')
await vierRecordBtn.vm.$emit('click')
// '29' is selected
expect(wrapper.find('.value-body').text()).to.equals('29')
selectedCell = wrapper
.find('.sqliteviz-table tbody td[aria-selected="true"]')
expect(selectedCell.text()).to.equals('29')
wrapper.unmount()
})
})