mirror of
https://github.com/lana-k/sqliteviz.git
synced 2025-12-06 10:08:52 +08:00
fix tests
This commit is contained in:
lana-k
119
karma.conf.cjs
Normal file
119
karma.conf.cjs
Normal file
@@ -0,0 +1,119 @@
|
||||
module.exports = function (config) {
|
||||
config.set({
|
||||
vite: {
|
||||
config: {
|
||||
resolve: {
|
||||
alias: {
|
||||
'vue': 'vue/dist/vue.esm-bundler.js'
|
||||
}
|
||||
},
|
||||
},
|
||||
coverage: {
|
||||
enable: true,
|
||||
include: 'src/*',
|
||||
exclude: ['node_modules', 'src/components/svg/*'],
|
||||
extension: ['.js', '.vue'],
|
||||
requireEnv: false
|
||||
}
|
||||
},
|
||||
// base path that will be used to resolve all patterns (eg. files, exclude)
|
||||
basePath: '',
|
||||
|
||||
// frameworks to use
|
||||
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
|
||||
frameworks: ['mocha', 'sinon-chai', 'vite'],
|
||||
|
||||
// list of files / patterns to load in the browser
|
||||
files: [
|
||||
{
|
||||
pattern: 'test.setup.js',
|
||||
type: 'module',
|
||||
watched: false,
|
||||
served: false,
|
||||
},
|
||||
{
|
||||
pattern: 'tests/**/*.spec.js',
|
||||
type: 'module',
|
||||
watched: false,
|
||||
served: false,
|
||||
},
|
||||
{
|
||||
pattern: 'src/assets/styles/*.css',
|
||||
type: 'css',
|
||||
watched: false,
|
||||
served: false,
|
||||
}
|
||||
],
|
||||
|
||||
plugins: [
|
||||
'karma-vite',
|
||||
'karma-mocha',
|
||||
'karma-sinon-chai',
|
||||
'karma-firefox-launcher',
|
||||
'karma-chrome-launcher',
|
||||
'karma-spec-reporter',
|
||||
'karma-coverage'
|
||||
],
|
||||
|
||||
// list of files / patterns to exclude
|
||||
exclude: [],
|
||||
|
||||
// test results reporter to use
|
||||
// possible values: 'dots', 'progress'
|
||||
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
|
||||
reporters: ['spec', 'coverage'],
|
||||
|
||||
coverageReporter: {
|
||||
dir: 'coverage',
|
||||
reporters: [{ type: 'lcov', subdir: '.' }, { type: 'text-summary' }]
|
||||
},
|
||||
|
||||
// web server port
|
||||
port: 9876,
|
||||
|
||||
// enable / disable colors in the output (reporters and logs)
|
||||
colors: true,
|
||||
|
||||
// level of logging
|
||||
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN ||
|
||||
// config.LOG_INFO || config.LOG_DEBUG
|
||||
logLevel: config.LOG_INFO,
|
||||
|
||||
// enable / disable watching file and executing tests whenever any file changes
|
||||
autoWatch: false,
|
||||
|
||||
customLaunchers: {
|
||||
FirefoxHeadlessTouch: {
|
||||
base: 'FirefoxHeadless',
|
||||
prefs: {
|
||||
'dom.w3c_touch_events.enabled': 1,
|
||||
'dom.events.asyncClipboard.clipboardItem': true
|
||||
}
|
||||
}
|
||||
},
|
||||
// start these browsers
|
||||
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
|
||||
browsers: ['ChromiumHeadless', 'FirefoxHeadlessTouch'],
|
||||
|
||||
// Continuous Integration mode
|
||||
// if true, Karma captures browsers, runs the tests and exits
|
||||
singleRun: true,
|
||||
|
||||
// Concurrency level
|
||||
// how many browser should be started simultaneous
|
||||
concurrency: 2,
|
||||
|
||||
client: {
|
||||
captureConsole: true,
|
||||
mocha: {
|
||||
timeout: 7000
|
||||
}
|
||||
},
|
||||
browserConsoleLogOptions: {
|
||||
terminal: true,
|
||||
level: ''
|
||||
}
|
||||
})
|
||||
// Fix the timezone
|
||||
process.env.TZ = 'Europe/Amsterdam'
|
||||
}
|
||||
203
karma.conf.js
203
karma.conf.js
@@ -1,203 +0,0 @@
|
||||
// Karma configuration
|
||||
'use strict'
|
||||
const path = require('path')
|
||||
const VueLoaderPlugin = require('vue-loader/lib/plugin')
|
||||
|
||||
function resolve (dir) {
|
||||
return path.join(__dirname, dir)
|
||||
}
|
||||
|
||||
module.exports = function (config) {
|
||||
config.set({
|
||||
// base path that will be used to resolve all patterns (eg. files, exclude)
|
||||
basePath: '',
|
||||
|
||||
// frameworks to use
|
||||
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
|
||||
frameworks: ['mocha', 'sinon-chai'],
|
||||
|
||||
// list of files / patterns to load in the browser
|
||||
files: [
|
||||
'./karma.files.js',
|
||||
{
|
||||
pattern: 'node_modules/sql.js/dist/sql-wasm.wasm',
|
||||
watched: false,
|
||||
included: false,
|
||||
served: true,
|
||||
nocache: false
|
||||
}
|
||||
],
|
||||
|
||||
// list of files / patterns to exclude
|
||||
exclude: [],
|
||||
|
||||
// preprocess matching files before serving them to the browser
|
||||
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
|
||||
preprocessors: {
|
||||
'./karma.files.js': ['webpack']
|
||||
},
|
||||
|
||||
// test results reporter to use
|
||||
// possible values: 'dots', 'progress'
|
||||
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
|
||||
reporters: ['spec', 'coverage'],
|
||||
|
||||
coverageReporter: {
|
||||
dir: 'coverage',
|
||||
reporters: [{ type: 'lcov', subdir: '.' }, { type: 'text-summary' }]
|
||||
},
|
||||
|
||||
// !!DONOT delete this reporter, or vue-cli-addon-ui-karma doesnot work
|
||||
jsonResultReporter: {
|
||||
outputFile: 'report/karma-result.json',
|
||||
isSynchronous: true
|
||||
},
|
||||
|
||||
junitReporter: {
|
||||
outputDir: 'report', // results will be saved as $outputDir/$browserName.xml
|
||||
// if included, results will be saved as $outputDir/$browserName/$outputFile
|
||||
outputFile: undefined,
|
||||
suite: '', // suite will become the package name attribute in xml testsuite element
|
||||
useBrowserName: true, // add browser name to report and classes names
|
||||
// function (browser, result) to customize the name attribute in xml testcase element
|
||||
nameFormatter: undefined,
|
||||
// function (browser, result) to customize the classname attribute in xml testcase element
|
||||
classNameFormatter: undefined,
|
||||
properties: {} // key value pairs add to the <properties> section of the report
|
||||
},
|
||||
|
||||
// web server port
|
||||
port: 9876,
|
||||
|
||||
// enable / disable colors in the output (reporters and logs)
|
||||
colors: true,
|
||||
|
||||
// level of logging
|
||||
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN ||
|
||||
// config.LOG_INFO || config.LOG_DEBUG
|
||||
logLevel: config.LOG_INFO,
|
||||
|
||||
// enable / disable watching file and executing tests whenever any file changes
|
||||
autoWatch: false,
|
||||
|
||||
customLaunchers: {
|
||||
FirefoxHeadlessTouch: {
|
||||
base: 'FirefoxHeadless',
|
||||
prefs: {
|
||||
'dom.w3c_touch_events.enabled': 1,
|
||||
'dom.events.asyncClipboard.clipboardItem': true
|
||||
}
|
||||
}
|
||||
},
|
||||
// start these browsers
|
||||
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
|
||||
browsers: ['ChromiumHeadless', 'FirefoxHeadlessTouch'],
|
||||
|
||||
// Continuous Integration mode
|
||||
// if true, Karma captures browsers, runs the tests and exits
|
||||
singleRun: true,
|
||||
|
||||
// Concurrency level
|
||||
// how many browser should be started simultaneous
|
||||
concurrency: 2,
|
||||
|
||||
client: {
|
||||
captureConsole: true,
|
||||
mocha: {
|
||||
timeout: 7000
|
||||
}
|
||||
},
|
||||
browserConsoleLogOptions: {
|
||||
terminal: true,
|
||||
level: ''
|
||||
},
|
||||
webpack: {
|
||||
mode: 'development',
|
||||
entry: './src/main.js',
|
||||
resolve: {
|
||||
extensions: ['.js', '.vue', '.json'],
|
||||
alias: {
|
||||
vue$: 'vue/dist/vue.esm.js',
|
||||
'@': resolve('src')
|
||||
}
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /(node_modules|bower_components)/,
|
||||
use: [
|
||||
{
|
||||
loader: 'babel-loader'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
include: /src/,
|
||||
exclude: /(node_modules|bower_components|\.spec\.js$)/,
|
||||
use: [
|
||||
{
|
||||
loader: 'istanbul-instrumenter-loader',
|
||||
options: {
|
||||
esModules: true
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /worker\.js$/,
|
||||
loader: 'worker-loader'
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
|
||||
loader: 'url-loader'
|
||||
},
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue-loader',
|
||||
options: {
|
||||
loaders: {
|
||||
js: 'babel-loader'
|
||||
},
|
||||
postLoaders: {
|
||||
js: 'istanbul-instrumenter-loader?esModules=true'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: ['vue-style-loader', 'css-loader']
|
||||
},
|
||||
{
|
||||
test: /\.scss$/,
|
||||
use: ['vue-style-loader', 'css-loader', 'sass-loader']
|
||||
},
|
||||
{
|
||||
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: resolve('fonts/[name].[hash:7].[ext]')
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
plugins: [new VueLoaderPlugin()],
|
||||
node: {
|
||||
fs: 'empty'
|
||||
}
|
||||
},
|
||||
webpackMiddleware: {
|
||||
watchOptions: {
|
||||
ignored: /node_modules/
|
||||
}
|
||||
},
|
||||
proxies: {
|
||||
'/_karma_webpack_/sql-wasm.wasm': '/base/node_modules/sql.js/dist/sql-wasm.wasm',
|
||||
'/base/sql-wasm.wasm': '/base/node_modules/sql.js/dist/sql-wasm.wasm'
|
||||
}
|
||||
})
|
||||
// Fix the timezone
|
||||
process.env.TZ = 'Europe/Amsterdam'
|
||||
}
|
||||
@@ -1,21 +0,0 @@
|
||||
import Vue from 'vue'
|
||||
// import { VuePlugin } from 'vuera'
|
||||
// import VModal from 'vue-js-modal'
|
||||
|
||||
// Vue.use(VuePlugin)
|
||||
// Vue.use(VModal)
|
||||
Vue.config.productionTip = false
|
||||
|
||||
// require all test files (files that ends with .spec.js)
|
||||
const testsContext = require.context('./tests', true, /\.spec.js$/)
|
||||
|
||||
// Read more about why we need to call testContext:
|
||||
// https://www.npmjs.com/package/require-context#context-api
|
||||
testsContext.keys().forEach(testsContext)
|
||||
|
||||
// require all src files except main.js and router/index.js for coverage.
|
||||
// you can also change this to match only the subset of files that
|
||||
// you want coverage for.
|
||||
// We don't include router/index.js to avoid installing VueRouter globally in tests
|
||||
const srcContext = require.context('./src', true, /^\.\/(?!(main|(router(\/)?(index)?))(\.js)?$)/)
|
||||
srcContext.keys().forEach(srcContext)
|
||||
34854
package-lock.json
generated
34854
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
45
package.json
45
package.json
@@ -3,14 +3,17 @@
|
||||
"version": "0.25.1",
|
||||
"license": "Apache-2.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "NODE_OPTIONS=--max_old_space_size=4096 vue-cli-service build",
|
||||
"test": "vue-cli-service karma",
|
||||
"lint": "vue-cli-service lint"
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"serve": "vite preview",
|
||||
"test": "karma start karma.conf.cjs",
|
||||
"lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src"
|
||||
},
|
||||
"dependencies": {
|
||||
"assert": "^2.1.0",
|
||||
"buffer": "^6.0.3",
|
||||
"codemirror": "^5.65.18",
|
||||
"codemirror-editor-vue3": "^2.8.0",
|
||||
"core-js": "^3.6.5",
|
||||
@@ -28,7 +31,6 @@
|
||||
"sql.js": "file:./lib/sql-js",
|
||||
"stream-browserify": "^3.0.0",
|
||||
"tiny-emitter": "^2.1.0",
|
||||
"url-loader": "^4.1.1",
|
||||
"veaury": "^2.5.1",
|
||||
"vue": "^3.5.11",
|
||||
"vue-final-modal": "^4.5.5",
|
||||
@@ -39,16 +41,11 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.25.7",
|
||||
"@babel/eslint-parser": "^7.25.7",
|
||||
"@vue/cli-plugin-babel": "^5.0.8",
|
||||
"@vue/cli-plugin-eslint": "^5.0.8",
|
||||
"@vue/cli-plugin-router": "^5.0.8",
|
||||
"@vue/cli-plugin-vuex": "^5.0.8",
|
||||
"@vue/cli-service": "^5.0.8",
|
||||
"@vitejs/plugin-vue": "^5.2.1",
|
||||
"@vue/eslint-config-standard": "^8.0.1",
|
||||
"@vue/test-utils": "^2.4.6",
|
||||
"chai": "^4.1.2",
|
||||
"chai-as-promised": "^7.1.1",
|
||||
"chai-as-promised": "^8.0.1",
|
||||
"copy-webpack-plugin": "^6.4.1",
|
||||
"eslint": "^8.57.1",
|
||||
"eslint-plugin-import": "^2.20.2",
|
||||
@@ -57,11 +54,27 @@
|
||||
"eslint-plugin-standard": "^4.0.0",
|
||||
"eslint-plugin-vue": "^9.28.0",
|
||||
"flush-promises": "^1.0.2",
|
||||
"karma": "^3.1.4",
|
||||
"karma-firefox-launcher": "^2.1.0",
|
||||
"karma": "^6.4.4",
|
||||
"karma-coverage": "^2.2.1",
|
||||
"karma-coverage-istanbul-reporter": "^3.0.3",
|
||||
"karma-firefox-launcher": "^2.1.3",
|
||||
"karma-mocha": "^1.3.0",
|
||||
"karma-spec-reporter": "^0.0.36",
|
||||
"karma-vite": "^1.0.5",
|
||||
"karma-webpack": "^5.0.1",
|
||||
"mocha": "^5.2.0",
|
||||
"process": "^0.11.10",
|
||||
"url-loader": "^4.1.1",
|
||||
"vite": "^5.4.14",
|
||||
"vite-plugin-istanbul": "^5.0.0",
|
||||
"vite-plugin-node-polyfills": "^0.23.0",
|
||||
"vite-plugin-static-copy": "^2.2.0",
|
||||
"vue-cli-plugin-ui-karma": "^0.2.5",
|
||||
"workbox-webpack-plugin": "^6.1.5",
|
||||
"worker-loader": "^3.0.8"
|
||||
"workbox-webpack-plugin": "^6.1.5"
|
||||
},
|
||||
"overrides": {
|
||||
"karma-vite": {
|
||||
"vite-plugin-istanbul": "$vite-plugin-istanbul"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,13 +5,18 @@
|
||||
>
|
||||
<div v-show="!checked" class="unchecked" />
|
||||
<img
|
||||
v-show="checked && !disabled"
|
||||
:src="theme === 'light'
|
||||
? '~@/assets/images/checkbox_checked_light.svg'
|
||||
: '~@/assets/images/checkbox_checked.svg'"
|
||||
v-show="checked && !disabled && theme === 'light'"
|
||||
class="checked-light"
|
||||
src="~@/assets/images/checkbox_checked_light.svg"
|
||||
/>
|
||||
<img
|
||||
v-show="checked && !disabled && theme !== 'light'"
|
||||
class="checked"
|
||||
src="~@/assets/images/checkbox_checked.svg"
|
||||
/>
|
||||
<img
|
||||
v-show="checked && disabled"
|
||||
class="checked-disabled"
|
||||
src="~@/assets/images/checkbox_checked_disabled.svg"
|
||||
/>
|
||||
<span v-if="label" class="label">{{ label }}</span>
|
||||
|
||||
@@ -47,6 +47,7 @@ import ClearIcon from '@/components/svg/clear'
|
||||
export default {
|
||||
name: 'DelimiterSelector',
|
||||
props: ['modelValue', 'width', 'disabled'],
|
||||
emits: ['update:modelValue'],
|
||||
components: { DropDownChevron, ClearIcon },
|
||||
data () {
|
||||
return {
|
||||
|
||||
@@ -290,17 +290,16 @@ export default {
|
||||
delimiter: this.delimiter,
|
||||
columns: !this.isJson && !this.isNdJson ? null : ['doc']
|
||||
}
|
||||
const parsingMsg = {
|
||||
let parsingMsg = {}
|
||||
this.importMessages.push({
|
||||
message: `Parsing ${this.typeName}...`,
|
||||
type: 'info'
|
||||
}
|
||||
this.importMessages.push(parsingMsg)
|
||||
})
|
||||
// Get *reactive* link to parsing message for later updates
|
||||
parsingMsg = this.importMessages[this.importMessages.length - 1]
|
||||
const parsingLoadingIndicator = setTimeout(() => { parsingMsg.type = 'loading' }, 1000)
|
||||
|
||||
const importMsg = {
|
||||
message: `Importing ${this.typeName} into a SQLite database...`,
|
||||
type: 'info'
|
||||
}
|
||||
let importMsg = {}
|
||||
let importLoadingIndicator = null
|
||||
|
||||
const updateProgress = progress => {
|
||||
@@ -333,7 +332,11 @@ export default {
|
||||
clearTimeout(parsingLoadingIndicator)
|
||||
|
||||
// Add info about import start
|
||||
this.importMessages.push(importMsg)
|
||||
this.importMessages.push({
|
||||
message: `Importing ${this.typeName} into a SQLite database...`,
|
||||
type: 'info'
|
||||
})
|
||||
importMsg = this.importMessages[this.importMessages.length - 1]
|
||||
|
||||
// Show import progress after 1 second
|
||||
importLoadingIndicator = setTimeout(() => {
|
||||
|
||||
@@ -3,6 +3,8 @@
|
||||
:modal-id="name"
|
||||
class="dialog"
|
||||
:clickToClose="false"
|
||||
:contentTransition="{name: 'loading-dialog'}"
|
||||
:overlayTransition="{name: 'loading-dialog'}"
|
||||
>
|
||||
<div class="dialog-header">
|
||||
{{ title }}
|
||||
@@ -21,6 +23,7 @@
|
||||
<div class="dialog-buttons-container">
|
||||
<button
|
||||
class="secondary"
|
||||
type="button"
|
||||
:disabled="loading"
|
||||
@click="$emit('cancel')"
|
||||
>
|
||||
@@ -28,6 +31,7 @@
|
||||
</button>
|
||||
<button
|
||||
class="primary"
|
||||
type="button"
|
||||
:disabled="loading"
|
||||
@click="$emit('action')"
|
||||
>
|
||||
@@ -68,6 +72,31 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.loading-dialog-enter-active {
|
||||
animation: show-modal 1s linear 0s 1;
|
||||
}
|
||||
.loading-dialog-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes show-modal {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
99% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-modal {
|
||||
width: 400px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
.loading-dialog-body {
|
||||
display: flex;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
import * as dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
import plotly from 'plotly.js'
|
||||
import { nanoid } from 'nanoid'
|
||||
|
||||
@@ -21,7 +21,7 @@ export function getOptionsForSave (state, dataSources) {
|
||||
for (const key in dataSources) {
|
||||
emptySources[key] = []
|
||||
}
|
||||
dereference(stateCopy.data, emptySources)
|
||||
dereference.default(stateCopy.data, emptySources)
|
||||
return stateCopy
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import initSqlJs from 'sql.js/dist/sql-wasm.js'
|
||||
import initSqlJs from 'sql.js'
|
||||
import dbUtils from './_statements'
|
||||
import wasmUrl from 'sql.js/dist/sql-wasm.wasm?url'
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ import 'react-chart-editor/lib/react-chart-editor.css'
|
||||
|
||||
import ReactPlotlyEditor from 'react-chart-editor'
|
||||
import chartHelper from '@/lib/chartHelper'
|
||||
import dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
import * as dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
import fIo from '@/lib/utils/fileIo'
|
||||
import events from '@/lib/utils/events'
|
||||
|
||||
@@ -101,7 +101,7 @@ export default {
|
||||
// we need to update state.data in order to update the graph
|
||||
// https://github.com/plotly/react-chart-editor/issues/948
|
||||
if (this.dataSources) {
|
||||
dereference(this.state.data, this.dataSources)
|
||||
dereference.default(this.state.data, this.dataSources)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -15,6 +15,7 @@ import SortIcon from '@/components/svg/sort'
|
||||
export default {
|
||||
name: 'PivotSortBtn',
|
||||
props: ['direction', 'modelValue'],
|
||||
emits: ['update:modelValue'],
|
||||
components: {
|
||||
SortIcon
|
||||
},
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
ref="customChart"
|
||||
v-bind="customChartComponentProps"
|
||||
@update="$emit('update')"
|
||||
@onLoadingImageCompleted="$emit('loadingImageCompleted')"
|
||||
@loadingImageCompleted="$emit('loadingImageCompleted')"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -183,13 +183,12 @@ export default {
|
||||
|
||||
getOptionsForSave () {
|
||||
const options = { ...this.pivotOptions }
|
||||
if (options.rendererOptions) {
|
||||
if (this.viewCustomChart) {
|
||||
const chartComponent = this.$refs.customChart
|
||||
options.rendererOptions = {
|
||||
customChartOptions: chartComponent.getOptionsForSave()
|
||||
}
|
||||
}
|
||||
|
||||
return options
|
||||
},
|
||||
|
||||
|
||||
@@ -22,6 +22,7 @@
|
||||
<chart-icon />
|
||||
</icon-button>
|
||||
<icon-button
|
||||
ref="pivotBtn"
|
||||
:active="mode === 'pivot'"
|
||||
@click="mode = 'pivot'"
|
||||
tooltip="Switch to pivot"
|
||||
@@ -42,6 +43,7 @@
|
||||
<png-icon />
|
||||
</icon-button>
|
||||
<icon-button
|
||||
ref="svgExportBtn"
|
||||
:disabled="!importToSvgEnabled"
|
||||
tooltip="Save as SVG"
|
||||
tooltip-position="top-left"
|
||||
@@ -51,6 +53,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="htmlExportBtn"
|
||||
tooltip="Save as HTML"
|
||||
tooltip-position="top-left"
|
||||
@click="saveAsHtml"
|
||||
@@ -58,6 +61,7 @@
|
||||
<HtmlIcon />
|
||||
</icon-button>
|
||||
<icon-button
|
||||
ref="copyToClipboardBtn"
|
||||
:loading="copyingImage"
|
||||
tooltip="Copy visualisation to clipboard"
|
||||
tooltip-position="top-left"
|
||||
@@ -234,19 +238,4 @@ export default {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
:deep(.vm--container) {
|
||||
animation: show-modal 1s linear 0s 1;
|
||||
}
|
||||
|
||||
@keyframes show-modal {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
99% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -37,6 +37,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="copyToClipboardBtn"
|
||||
:disabled="!result"
|
||||
tooltip="Copy result set to clipboard"
|
||||
tooltip-position="top-left"
|
||||
@@ -46,6 +47,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="rowBtn"
|
||||
:disabled="!result"
|
||||
tooltip="View record"
|
||||
tooltip-position="top-left"
|
||||
@@ -56,6 +58,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="viewCellValueBtn"
|
||||
:disabled="!result"
|
||||
tooltip="View value"
|
||||
tooltip-position="top-left"
|
||||
@@ -166,7 +169,7 @@ export default {
|
||||
viewRecord: false,
|
||||
defaultPage: 1,
|
||||
defaultSelectedCell: null,
|
||||
enableTeleport: false
|
||||
enableTeleport: this.$store.state.isWorkspaceVisible
|
||||
}
|
||||
},
|
||||
components: {
|
||||
@@ -204,9 +207,6 @@ export default {
|
||||
this.enableTeleport = false
|
||||
},
|
||||
mounted () {
|
||||
if (this.$store.state.isWorkspaceVisible) {
|
||||
this.enableTeleport = true
|
||||
}
|
||||
this.resizeObserver = new ResizeObserver(this.handleResize)
|
||||
this.resizeObserver.observe(this.$refs.runResultPanel)
|
||||
this.calculatePageSize()
|
||||
@@ -376,20 +376,4 @@ export default {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.vm--container) {
|
||||
animation: show-modal 1s linear 0s 1;
|
||||
}
|
||||
|
||||
@keyframes show-modal {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
99% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div class="side-tool-bar">
|
||||
<icon-button
|
||||
ref="sqlEditorBtn"
|
||||
:active="panel === 'sqlEditor'"
|
||||
tooltip="Switch panel to SQL editor"
|
||||
tooltip-position="top-left"
|
||||
@@ -10,6 +11,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="tableBtn"
|
||||
:active="panel === 'table'"
|
||||
tooltip="Switch panel to result set"
|
||||
tooltip-position="top-left"
|
||||
@@ -19,6 +21,7 @@
|
||||
</icon-button>
|
||||
|
||||
<icon-button
|
||||
ref="dataViewBtn"
|
||||
:active="panel === 'dataView'"
|
||||
tooltip="Switch panel to data view"
|
||||
tooltip-position="top-left"
|
||||
|
||||
@@ -43,7 +43,7 @@ export function showHintOnDemand (editor) {
|
||||
CM.showHint(editor, getHints, hintOptions)
|
||||
}
|
||||
|
||||
export default function showHint (value, editor) {
|
||||
export default function showHint (editor) {
|
||||
// Don't show autocomplete after a space or semicolon or in string literals
|
||||
const token = editor.getTokenAt(editor.getCursor())
|
||||
const ch = token.string.slice(-1)
|
||||
|
||||
@@ -11,6 +11,7 @@
|
||||
</div>
|
||||
<side-tool-bar panel="sqlEditor" @switchTo="$emit('switchTo', $event)">
|
||||
<icon-button
|
||||
ref="runBtn"
|
||||
:disabled="runDisabled"
|
||||
:loading="isGettingResults"
|
||||
tooltip="Run SQL query"
|
||||
@@ -72,9 +73,9 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChange: time.debounce(showHint, 400),
|
||||
onChange: time.debounce((value, editor) => showHint(editor), 400),
|
||||
focus () {
|
||||
this.$refs.cm.cminstance.focus()
|
||||
this.$refs.cm.cminstance?.focus()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -89,7 +89,7 @@ export default {
|
||||
topPaneSize: this.tab.maximize
|
||||
? this.tab.layout[this.tab.maximize] === 'above' ? 100 : 0
|
||||
: 50,
|
||||
enableTeleport: false
|
||||
enableTeleport: this.$store.state.isWorkspaceVisible
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -103,7 +103,7 @@ export default {
|
||||
async handler () {
|
||||
if (this.isActive) {
|
||||
await nextTick()
|
||||
this.$refs.sqlEditor.focus()
|
||||
this.$refs.sqlEditor?.focus()
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -114,16 +114,17 @@ export default {
|
||||
})
|
||||
}
|
||||
},
|
||||
activated () {
|
||||
async activated () {
|
||||
this.enableTeleport = true
|
||||
if (this.isActive) {
|
||||
await nextTick()
|
||||
this.$refs.sqlEditor.focus()
|
||||
}
|
||||
},
|
||||
deactivated () {
|
||||
this.enableTeleport = false
|
||||
},
|
||||
mounted () {
|
||||
if (this.$store.state.isWorkspaceVisible) {
|
||||
this.enableTeleport = true
|
||||
}
|
||||
async mounted () {
|
||||
this.tab.dataView = this.$refs.dataView
|
||||
},
|
||||
methods: {
|
||||
|
||||
14
test.setup.js
Normal file
14
test.setup.js
Normal file
@@ -0,0 +1,14 @@
|
||||
import { config } from '@vue/test-utils'
|
||||
import { createVfm, VueFinalModal, useVfm } from 'vue-final-modal'
|
||||
|
||||
config.global.plugins = [createVfm()]
|
||||
config.global.components = {
|
||||
'modal': VueFinalModal
|
||||
}
|
||||
const vfm = useVfm()
|
||||
config.global.mocks = {
|
||||
$modal: {
|
||||
show: modalId => vfm.open(modalId),
|
||||
hide: modalId => vfm.close(modalId)
|
||||
}
|
||||
}
|
||||
@@ -1,10 +1,11 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import { shallowMount } from '@vue/test-utils'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import App from '@/App'
|
||||
import storedInquiries from '@/lib/storedInquiries'
|
||||
import mutations from '@/store/mutations'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('App.vue', () => {
|
||||
afterEach(() => {
|
||||
@@ -19,8 +20,13 @@ describe('App.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
shallowMount(App, { store, stubs: ['router-view'] })
|
||||
const store = createStore({ state, mutations })
|
||||
shallowMount(App, {
|
||||
global: {
|
||||
stubs: ['router-view'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
expect(state.inquiries).to.eql([{ id: 1 }, { id: 2 }, { id: 3 }])
|
||||
})
|
||||
@@ -35,11 +41,14 @@ describe('App.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const wrapper = shallowMount(App, { store, stubs: ['router-view'] })
|
||||
const store = createStore({ state, mutations })
|
||||
shallowMount(App, {
|
||||
global: { stubs: ['router-view'],
|
||||
plugins: [store] }
|
||||
})
|
||||
|
||||
store.state.inquiries.splice(0, 1, { id: 1, name: 'new foo name' })
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
expect(storedInquiries.updateStorage.calledTwice).to.equal(true)
|
||||
|
||||
|
||||
@@ -5,26 +5,34 @@ import CheckBox from '@/components/CheckBox'
|
||||
describe('CheckBox', () => {
|
||||
it('unchecked by default', () => {
|
||||
const wrapper = shallowMount(CheckBox, {
|
||||
props: { init: false }
|
||||
props: { init: false },
|
||||
attachTo: document.body
|
||||
})
|
||||
expect(wrapper.find('img').isVisible()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('gets init state according to passed props', () => {
|
||||
const wrapperChecked = shallowMount(CheckBox, {
|
||||
props: { init: true }
|
||||
props: { init: true },
|
||||
attachTo: document.body
|
||||
})
|
||||
expect(wrapperChecked.find('img').isVisible()).to.equal(true)
|
||||
expect(wrapperChecked.find('img.checked').isVisible()).to.equal(true)
|
||||
wrapperChecked.unmount()
|
||||
|
||||
const wrapperUnchecked = shallowMount(CheckBox, {
|
||||
props: { init: false }
|
||||
props: { init: false },
|
||||
attachTo: document.body
|
||||
})
|
||||
expect(wrapperUnchecked.find('img').isVisible()).to.equal(false)
|
||||
wrapperUnchecked.unmount()
|
||||
})
|
||||
|
||||
it('checked on click', async () => {
|
||||
const wrapper = shallowMount(CheckBox)
|
||||
const wrapper = shallowMount(CheckBox, { attachTo: document.body })
|
||||
await wrapper.trigger('click')
|
||||
expect(wrapper.find('img').isVisible()).to.equal(true)
|
||||
expect(wrapper.find('img.checked').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('emits event on click', async () => {
|
||||
|
||||
@@ -1,15 +1,16 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import CsvJsonImport from '@/components/CsvJsonImport'
|
||||
import csv from '@/lib/csv'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
|
||||
describe('CsvJsonImport.vue', () => {
|
||||
let state = {}
|
||||
let actions = {}
|
||||
let mutations = {}
|
||||
let store = {}
|
||||
let clock
|
||||
let wrapper
|
||||
const newTabId = 1
|
||||
@@ -27,7 +28,7 @@ describe('CsvJsonImport.vue', () => {
|
||||
actions = {
|
||||
addTab: sinon.stub().resolves(newTabId)
|
||||
}
|
||||
store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const db = {
|
||||
sanitizeTableName: sinon.stub().returns('my_data'),
|
||||
@@ -41,17 +42,25 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
// mount the component
|
||||
wrapper = mount(CsvJsonImport, {
|
||||
store,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: {
|
||||
teleport: true,
|
||||
transition: false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
file,
|
||||
dialogName: 'addCsvJson',
|
||||
db
|
||||
}
|
||||
},
|
||||
attachTo: document.body
|
||||
})
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('previews', async () => {
|
||||
@@ -76,11 +85,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(true)
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog-header').text()).to.equal('CSV import')
|
||||
expect(wrapper.find('#csv-json-table-name input').element.value).to.equal('my_data')
|
||||
expect(wrapper.findComponent({ name: 'delimiter-selector' }).vm.value).to.equal('|')
|
||||
expect(wrapper.findComponent({ name: 'delimiter-selector' }).props('modelValue')).to.equal('|')
|
||||
expect(wrapper.find('#quote-char input').element.value).to.equal('"')
|
||||
expect(wrapper.find('#escape-char input').element.value).to.equal('"')
|
||||
expect(wrapper.findComponent({ name: 'check-box' }).vm.checked).to.equal(true)
|
||||
@@ -115,7 +125,8 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
expect(rows).to.have.lengthOf(0)
|
||||
expect(wrapper.findComponent({ name: 'logs' }).text())
|
||||
@@ -123,7 +134,7 @@ describe('CsvJsonImport.vue', () => {
|
||||
expect(wrapper.find('.no-data').isVisible()).to.equal(true)
|
||||
expect(wrapper.find('#import-finish').isVisible()).to.equal(false)
|
||||
expect(wrapper.find('#import-start').isVisible()).to.equal(true)
|
||||
expect(wrapper.find('#import-start').attributes().disabled).to.equal('disabled')
|
||||
expect(wrapper.find('#import-start').attributes().disabled).to.equal('')
|
||||
})
|
||||
|
||||
it('reparses when parameters changes', async () => {
|
||||
@@ -143,7 +154,8 @@ describe('CsvJsonImport.vue', () => {
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await csv.parse.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
parse.onCall(1).resolves({
|
||||
delimiter: ',',
|
||||
@@ -266,7 +278,8 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
let resolveParsing
|
||||
parse.onCall(1).returns(new Promise(resolve => {
|
||||
@@ -286,7 +299,6 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// "Parsing CSV..." in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[1].text())
|
||||
@@ -349,7 +361,8 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
let resolveImport
|
||||
wrapper.vm.db.addTableFromCsv.onCall(0).returns(new Promise(resolve => {
|
||||
@@ -359,7 +372,6 @@ describe('CsvJsonImport.vue', () => {
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[1].text())
|
||||
@@ -420,12 +432,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
@@ -483,12 +495,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
@@ -544,12 +556,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[2].text())
|
||||
@@ -613,12 +625,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Import success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
@@ -670,12 +682,12 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Import success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
@@ -711,17 +723,18 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#import-finish').trigger('click')
|
||||
|
||||
await clock.tick(100)
|
||||
expect(actions.addTab.calledOnce).to.equal(true)
|
||||
await actions.addTab.returnValues[0]
|
||||
expect(mutations.setCurrentTabId.calledOnceWith(state, newTabId)).to.equal(true)
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(false)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
expect(wrapper.emitted('finish')).to.have.lengthOf(1)
|
||||
})
|
||||
|
||||
@@ -742,14 +755,15 @@ describe('CsvJsonImport.vue', () => {
|
||||
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#import-cancel').trigger('click')
|
||||
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
expect(wrapper.vm.db.execute.calledOnceWith('DROP TABLE "my_data"')).to.equal(true)
|
||||
expect(wrapper.vm.db.refreshSchema.calledOnce).to.equal(true)
|
||||
expect(wrapper.emitted('cancel')).to.have.lengthOf(1)
|
||||
@@ -763,23 +777,24 @@ describe('CsvJsonImport.vue', () => {
|
||||
})
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await clock.tick(400)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('#csv-json-table-name .text-field-error').text()).to.equal('')
|
||||
|
||||
wrapper.vm.db.validateTableName = sinon.stub().rejects(new Error('this is a bad table name'))
|
||||
await wrapper.find('#csv-json-table-name input').setValue('bar')
|
||||
await clock.tick(400)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('#csv-json-table-name .text-field-error').text())
|
||||
.to.equal('this is a bad table name. Try another table name.')
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('')
|
||||
await clock.tick(400)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('#csv-json-table-name .text-field-error').text()).to.equal('')
|
||||
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
@@ -793,7 +808,6 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
let state = {}
|
||||
let actions = {}
|
||||
let mutations = {}
|
||||
let store = {}
|
||||
let clock
|
||||
let wrapper
|
||||
const newTabId = 1
|
||||
@@ -817,7 +831,7 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
actions = {
|
||||
addTab: sinon.stub().resolves(newTabId)
|
||||
}
|
||||
store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const db = {
|
||||
sanitizeTableName: sinon.stub().returns('my_data'),
|
||||
@@ -831,24 +845,33 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
|
||||
// mount the component
|
||||
wrapper = mount(CsvJsonImport, {
|
||||
store,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: {
|
||||
teleport: true,
|
||||
transition: false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
file,
|
||||
dialogName: 'addCsvJson',
|
||||
db
|
||||
}
|
||||
},
|
||||
attachTo: document.body
|
||||
})
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('previews', async () => {
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(true)
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog-header').text()).to.equal('JSON import')
|
||||
expect(wrapper.find('#csv-json-table-name input').element.value).to.equal('my_data')
|
||||
expect(wrapper.findComponent({ name: 'delimiter-selector' }).exists()).to.equal(false)
|
||||
@@ -906,11 +929,12 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// "Parsing JSON..." in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[1].text())
|
||||
@@ -946,12 +970,13 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await getJsonParseResult.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[2].text())
|
||||
@@ -984,12 +1009,14 @@ describe('CsvJsonImport.vue - json', () => {
|
||||
|
||||
await wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await getJsonParseResult.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
// Import success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
@@ -1008,7 +1035,6 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
let state = {}
|
||||
let actions = {}
|
||||
let mutations = {}
|
||||
let store = {}
|
||||
let clock
|
||||
let wrapper
|
||||
const newTabId = 1
|
||||
@@ -1026,7 +1052,7 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
actions = {
|
||||
addTab: sinon.stub().resolves(newTabId)
|
||||
}
|
||||
store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const db = {
|
||||
sanitizeTableName: sinon.stub().returns('my_data'),
|
||||
@@ -1040,17 +1066,25 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
// mount the component
|
||||
wrapper = mount(CsvJsonImport, {
|
||||
store,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: {
|
||||
teleport: true,
|
||||
transition: false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
file,
|
||||
dialogName: 'addCsvJson',
|
||||
db
|
||||
}
|
||||
},
|
||||
attachTo: document.body
|
||||
})
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('previews', async () => {
|
||||
@@ -1068,8 +1102,9 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
await wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(true)
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog-header').text()).to.equal('JSON import')
|
||||
expect(wrapper.find('#csv-json-table-name input').element.value).to.equal('my_data')
|
||||
expect(wrapper.findComponent({ name: 'delimiter-selector' }).exists()).to.equal(false)
|
||||
@@ -1100,7 +1135,8 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
let resolveParsing
|
||||
parse.onCall(1).returns(new Promise(resolve => {
|
||||
@@ -1119,7 +1155,7 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// "Parsing JSON..." in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[1].text())
|
||||
@@ -1180,12 +1216,13 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// Parsing success in the logs
|
||||
expect(wrapper.findComponent({ name: 'logs' }).findAll('.msg')[2].text())
|
||||
@@ -1243,12 +1280,13 @@ describe('CsvJsonImport.vue - ndjson', () => {
|
||||
|
||||
wrapper.vm.preview()
|
||||
wrapper.vm.open()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.find('#csv-json-table-name input').setValue('foo')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await csv.parse.returnValues[1]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// Import success in the logs
|
||||
const logs = wrapper.findComponent({ name: 'logs' }).findAll('.msg')
|
||||
|
||||
@@ -1,23 +1,24 @@
|
||||
import { expect } from 'chai'
|
||||
import { mount, shallowMount } from '@vue/test-utils'
|
||||
import DelimiterSelector from '@/components/CsvJsonImport/DelimiterSelector'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('DelimiterSelector', async () => {
|
||||
it('shows the name of value', async () => {
|
||||
let wrapper = shallowMount(DelimiterSelector, {
|
||||
props: { value: ',' }
|
||||
props: { modelValue: ',' }
|
||||
})
|
||||
expect(wrapper.find('input').element.value).to.equal(',')
|
||||
expect(wrapper.find('.name').text()).to.equal('comma')
|
||||
|
||||
wrapper = shallowMount(DelimiterSelector, {
|
||||
props: { value: '\t' }
|
||||
props: { modelValue: '\t' }
|
||||
})
|
||||
expect(wrapper.find('input').element.value).to.equal('\t')
|
||||
expect(wrapper.find('.name').text()).to.equal('horizontal tab')
|
||||
|
||||
wrapper = shallowMount(DelimiterSelector, {
|
||||
props: { value: '' }
|
||||
props: { modelValue: '' }
|
||||
})
|
||||
expect(wrapper.find('input').element.value).to.equal('')
|
||||
expect(wrapper.find('.name').text()).to.equal('')
|
||||
@@ -25,7 +26,7 @@ describe('DelimiterSelector', async () => {
|
||||
|
||||
it('clears the field', async () => {
|
||||
const wrapper = mount(DelimiterSelector, {
|
||||
props: { value: ',' }
|
||||
props: { modelValue: ',' }
|
||||
})
|
||||
|
||||
await wrapper.findComponent({ name: 'clear-icon' }).trigger('click')
|
||||
@@ -36,34 +37,43 @@ describe('DelimiterSelector', async () => {
|
||||
|
||||
it('changes value by typing', async () => {
|
||||
const wrapper = shallowMount(DelimiterSelector, {
|
||||
props: { value: ',' }
|
||||
props: {
|
||||
modelValue: ',',
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('input').setValue(';')
|
||||
expect(wrapper.emitted().input).to.have.lengthOf(1)
|
||||
expect(wrapper.emitted().input[0]).to.eql([';'])
|
||||
expect(wrapper.props('modelValue')).to.eql(';')
|
||||
})
|
||||
|
||||
it('changes value by selection from the list', async () => {
|
||||
const wrapper = mount(DelimiterSelector, {
|
||||
props: { value: '|' }
|
||||
props: {
|
||||
modelValue: '|',
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
},
|
||||
attachTo: document.body
|
||||
})
|
||||
|
||||
await wrapper.findComponent({ name: 'drop-down-chevron' }).trigger('click')
|
||||
expect(wrapper.find('.options').isVisible()).to.equal(true)
|
||||
await wrapper.find('.option').trigger('click')
|
||||
expect(wrapper.find('.options').isVisible()).to.equal(false)
|
||||
expect(wrapper.emitted().input).to.have.lengthOf(1)
|
||||
expect(wrapper.emitted().input[0]).to.eql([','])
|
||||
expect(wrapper.props('modelValue')).to.eql(',')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it("doesn't change value when becomes empty", async () => {
|
||||
const wrapper = mount(DelimiterSelector, {
|
||||
props: { value: '|' }
|
||||
props: {
|
||||
modelValue: '|',
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('input').setValue('')
|
||||
expect(wrapper.emitted().input).to.equal(undefined)
|
||||
expect(wrapper.props('modelValue')).to.eql('|')
|
||||
})
|
||||
|
||||
it('set focus in input when click on character name', async () => {
|
||||
@@ -72,7 +82,7 @@ describe('DelimiterSelector', async () => {
|
||||
|
||||
const wrapper = mount(DelimiterSelector, {
|
||||
attachTo: place,
|
||||
props: { value: '|' }
|
||||
props: { modelValue: '|' }
|
||||
})
|
||||
|
||||
await wrapper.find('.name').trigger('click')
|
||||
@@ -83,23 +93,28 @@ describe('DelimiterSelector', async () => {
|
||||
|
||||
it('disabled', async () => {
|
||||
const wrapper = mount(DelimiterSelector, {
|
||||
props: { value: '|', disabled: true }
|
||||
props: {
|
||||
modelValue: '|',
|
||||
disabled: true,
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
},
|
||||
attachTo: document.body
|
||||
})
|
||||
|
||||
await wrapper.findComponent({ name: 'clear-icon' }).trigger('click')
|
||||
|
||||
expect(wrapper.find('input').element.value).to.equal('|')
|
||||
expect(wrapper.emitted().input).to.equal(undefined)
|
||||
|
||||
await wrapper.findComponent({ name: 'drop-down-chevron' }).trigger('click')
|
||||
expect(wrapper.find('.options').isVisible()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('has filled class when input is not empty', async () => {
|
||||
const wrapper = shallowMount(DelimiterSelector, {
|
||||
props: { value: ',' }
|
||||
props: { modelValue: ',' }
|
||||
})
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('input').classes()).to.include('filled')
|
||||
await wrapper.find('input').setValue('')
|
||||
expect(wrapper.find('input').classes()).to.not.include('filled')
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import { shallowMount, mount } from '@vue/test-utils'
|
||||
import DbUploader from '@/components/DbUploader'
|
||||
import fu from '@/lib/utils/fileIo'
|
||||
import database from '@/lib/database'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
|
||||
describe('DbUploader.vue', () => {
|
||||
let state = {}
|
||||
@@ -18,7 +20,7 @@ describe('DbUploader.vue', () => {
|
||||
mutations = {
|
||||
setDb: sinon.stub()
|
||||
}
|
||||
store = new Vuex.Store({ state, mutations })
|
||||
store = createStore({ state, mutations })
|
||||
|
||||
place = document.createElement('div')
|
||||
document.body.appendChild(place)
|
||||
@@ -47,9 +49,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = shallowMount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -60,7 +62,7 @@ describe('DbUploader.vue', () => {
|
||||
expect(db.loadDb.calledOnceWith(file)).to.equal(true)
|
||||
await db.loadDb.returnValues[0]
|
||||
await wrapper.vm.animationPromise
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect($router.push.calledOnceWith('/workspace')).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -79,9 +81,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = shallowMount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -100,7 +102,7 @@ describe('DbUploader.vue', () => {
|
||||
expect(db.loadDb.calledOnceWith(file)).to.equal(true)
|
||||
await db.loadDb.returnValues[0]
|
||||
await wrapper.vm.animationPromise
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect($router.push.calledOnceWith('/workspace')).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -123,9 +125,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = shallowMount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -135,7 +137,7 @@ describe('DbUploader.vue', () => {
|
||||
await wrapper.find('.drop-area').trigger('click')
|
||||
await db.loadDb.returnValues[0]
|
||||
await wrapper.vm.animationPromise
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect($router.push.called).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -152,9 +154,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = mount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -167,11 +169,11 @@ describe('DbUploader.vue', () => {
|
||||
sinon.stub(CsvImport, 'open')
|
||||
|
||||
await wrapper.find('.drop-area').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(CsvImport.reset.calledOnce).to.equal(true)
|
||||
await wrapper.vm.animationPromise
|
||||
expect(CsvImport.preview.calledOnce).to.equal(true)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(CsvImport.open.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -188,9 +190,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = mount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -203,11 +205,11 @@ describe('DbUploader.vue', () => {
|
||||
sinon.stub(JsonImport, 'open')
|
||||
|
||||
await wrapper.find('.drop-area').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(JsonImport.reset.calledOnce).to.equal(true)
|
||||
await wrapper.vm.animationPromise
|
||||
expect(JsonImport.preview.calledOnce).to.equal(true)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(JsonImport.open.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -224,9 +226,9 @@ describe('DbUploader.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = mount(DbUploader, {
|
||||
attachTo: place,
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -239,11 +241,11 @@ describe('DbUploader.vue', () => {
|
||||
sinon.stub(JsonImport, 'open')
|
||||
|
||||
await wrapper.find('.drop-area').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(JsonImport.reset.calledOnce).to.equal(true)
|
||||
await wrapper.vm.animationPromise
|
||||
expect(JsonImport.preview.calledOnce).to.equal(true)
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(JsonImport.open.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
@@ -259,9 +261,9 @@ describe('DbUploader.vue', () => {
|
||||
|
||||
// mount the component
|
||||
const wrapper = mount(DbUploader, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router, $route }
|
||||
mocks: { $router, $route },
|
||||
plugins: [store]
|
||||
},
|
||||
props: {
|
||||
type: 'illustrated'
|
||||
@@ -274,7 +276,7 @@ describe('DbUploader.vue', () => {
|
||||
sinon.stub(CsvImport, 'open')
|
||||
|
||||
await wrapper.find('.drop-area').trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await CsvImport.$emit('cancel')
|
||||
expect(wrapper.vm.newDb).to.equal(null)
|
||||
})
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { expect } from 'chai'
|
||||
import { shallowMount } from '@vue/test-utils'
|
||||
import Logs from '@/components/Logs'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
let place
|
||||
describe('Logs.vue', () => {
|
||||
@@ -28,8 +29,7 @@ describe('Logs.vue', () => {
|
||||
attachTo: place,
|
||||
props: { messages, style: `height: ${containerHeight}px` }
|
||||
})
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
const height = wrapper.find('.logs-container').element.scrollHeight
|
||||
expect(wrapper.find('.logs-container').element.scrollTop)
|
||||
.to.equal(height - viewHeight)
|
||||
@@ -52,11 +52,11 @@ describe('Logs.vue', () => {
|
||||
props: { messages, style: `height: ${containerHeight}px` }
|
||||
})
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
messages.push({ type: 'error', message: 'msg 5' })
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
const height = wrapper.find('.logs-container').element.scrollHeight
|
||||
expect(wrapper.find('.logs-container').element.scrollTop)
|
||||
.to.equal(height - viewHeight)
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
import { expect } from 'chai'
|
||||
import { shallowMount } from '@vue/test-utils'
|
||||
import Splitpanes from '@/components/Splitpanes'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('Splitpanes.vue', () => {
|
||||
it('renders correctly - vertical', () => {
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 60, max: 100 },
|
||||
@@ -44,8 +45,8 @@ describe('Splitpanes.vue', () => {
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 60, max: 100 },
|
||||
@@ -74,8 +75,8 @@ describe('Splitpanes.vue', () => {
|
||||
// mount the component
|
||||
let wrapper = shallowMount(Splitpanes, {
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 0, max: 100 },
|
||||
@@ -130,24 +131,24 @@ describe('Splitpanes.vue', () => {
|
||||
|
||||
it('drag - vertical', async () => {
|
||||
const root = document.createElement('div')
|
||||
const place = document.createElement('div')
|
||||
root.style.width = '600px'
|
||||
root.style.height = '500px'
|
||||
root.appendChild(place)
|
||||
document.body.appendChild(root)
|
||||
document.body.style.margin = 0
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
attachTo: place,
|
||||
attachTo: root,
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 60, max: 100 },
|
||||
after: { size: 40, max: 100 }
|
||||
}
|
||||
})
|
||||
const parent = root.querySelector('[data-v-app=""]')
|
||||
parent.style.width = '600px'
|
||||
parent.style.height = '500px'
|
||||
|
||||
await wrapper.find('.splitpanes-splitter').trigger('mousedown')
|
||||
document.dispatchEvent(new MouseEvent('mousemove', {
|
||||
@@ -155,7 +156,7 @@ describe('Splitpanes.vue', () => {
|
||||
clientY: 80
|
||||
}))
|
||||
document.dispatchEvent(new MouseEvent('mouseup'))
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findAll('.splitpanes-pane')[0].element.style.width).to.equal('50%')
|
||||
wrapper.unmount()
|
||||
root.remove()
|
||||
@@ -163,18 +164,15 @@ describe('Splitpanes.vue', () => {
|
||||
|
||||
it('drag - horizontal', async () => {
|
||||
const root = document.createElement('div')
|
||||
const place = document.createElement('div')
|
||||
root.style.width = '600px'
|
||||
root.style.height = '500px'
|
||||
root.appendChild(place)
|
||||
document.body.appendChild(root)
|
||||
document.body.style.margin = 0
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
attachTo: place,
|
||||
attachTo: root,
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 10, max: 100 },
|
||||
@@ -183,13 +181,18 @@ describe('Splitpanes.vue', () => {
|
||||
}
|
||||
})
|
||||
|
||||
const parent = root.querySelector('[data-v-app=""]')
|
||||
parent.style.width = '600px'
|
||||
parent.style.height = '500px'
|
||||
|
||||
await wrapper.find('.splitpanes-splitter').trigger('mousedown')
|
||||
document.dispatchEvent(new MouseEvent('mousemove', {
|
||||
clientX: 10,
|
||||
clientY: 250
|
||||
}))
|
||||
document.dispatchEvent(new MouseEvent('mouseup'))
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findAll('.splitpanes-pane')[0].element.style.height).to.equal('50%')
|
||||
wrapper.unmount()
|
||||
root.remove()
|
||||
@@ -197,18 +200,15 @@ describe('Splitpanes.vue', () => {
|
||||
|
||||
it('drag - horizontal - touch', async () => {
|
||||
const root = document.createElement('div')
|
||||
const place = document.createElement('div')
|
||||
root.style.width = '600px'
|
||||
root.style.height = '500px'
|
||||
root.appendChild(place)
|
||||
document.body.appendChild(root)
|
||||
document.body.style.margin = 0
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
attachTo: place,
|
||||
attachTo: root,
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 10, max: 100 },
|
||||
@@ -217,6 +217,10 @@ describe('Splitpanes.vue', () => {
|
||||
}
|
||||
})
|
||||
|
||||
const parent = root.querySelector('[data-v-app=""]')
|
||||
parent.style.width = '600px'
|
||||
parent.style.height = '500px'
|
||||
|
||||
window.ontouchstart = null
|
||||
await wrapper.find('.splitpanes-splitter').trigger('touchstart')
|
||||
const event = new TouchEvent('touchmove')
|
||||
@@ -229,7 +233,7 @@ describe('Splitpanes.vue', () => {
|
||||
})
|
||||
document.dispatchEvent(event)
|
||||
document.dispatchEvent(new MouseEvent('touchend'))
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findAll('.splitpanes-pane')[0].element.style.height).to.equal('50%')
|
||||
wrapper.unmount()
|
||||
root.remove()
|
||||
@@ -238,18 +242,15 @@ describe('Splitpanes.vue', () => {
|
||||
|
||||
it('drag - vertical - touch', async () => {
|
||||
const root = document.createElement('div')
|
||||
const place = document.createElement('div')
|
||||
root.style.width = '600px'
|
||||
root.style.height = '500px'
|
||||
root.appendChild(place)
|
||||
document.body.appendChild(root)
|
||||
document.body.style.margin = 0
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Splitpanes, {
|
||||
attachTo: place,
|
||||
attachTo: root,
|
||||
slots: {
|
||||
leftPane: '<div />',
|
||||
rightPane: '<div />'
|
||||
'left-pane': '<div />',
|
||||
'right-pane': '<div />'
|
||||
},
|
||||
props: {
|
||||
before: { size: 60, max: 100 },
|
||||
@@ -257,6 +258,9 @@ describe('Splitpanes.vue', () => {
|
||||
}
|
||||
})
|
||||
window.ontouchstart = null
|
||||
const parent = root.querySelector('[data-v-app=""]')
|
||||
parent.style.width = '600px'
|
||||
parent.style.height = '500px'
|
||||
|
||||
await wrapper.find('.splitpanes-splitter').trigger('touchstart')
|
||||
const event = new TouchEvent('touchmove')
|
||||
@@ -269,7 +273,7 @@ describe('Splitpanes.vue', () => {
|
||||
})
|
||||
document.dispatchEvent(event)
|
||||
document.dispatchEvent(new MouseEvent('touchend'))
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findAll('.splitpanes-pane')[0].element.style.width).to.equal('50%')
|
||||
wrapper.unmount()
|
||||
root.remove()
|
||||
|
||||
@@ -8,30 +8,20 @@ describe('Pager.vue', () => {
|
||||
sinon.restore()
|
||||
})
|
||||
|
||||
it('emits input event with a page', async () => {
|
||||
it('emits update:modelValue event with a page', async () => {
|
||||
const wrapper = mount(Pager, {
|
||||
props: {
|
||||
pageCount: 5
|
||||
pageCount: 5,
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
}
|
||||
})
|
||||
|
||||
// click on 'next page' link
|
||||
await wrapper.find('.paginator-next').trigger('click')
|
||||
expect(wrapper.emitted('input')[0]).to.eql([2])
|
||||
expect(wrapper.props('modelValue')).to.eql(2)
|
||||
|
||||
// click on the link to page 3 (it has index 2)
|
||||
await wrapper.findAll('.paginator-page-link')[2].trigger('click')
|
||||
expect(wrapper.emitted('input')[1]).to.eql([3])
|
||||
})
|
||||
|
||||
it('changes the page when value is changed', async () => {
|
||||
const wrapper = mount(Pager, {
|
||||
props: {
|
||||
pageCount: 5
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.setProps({ value: 5 })
|
||||
expect(wrapper.emitted('input')[0]).to.eql([5])
|
||||
expect(wrapper.props('modelValue')).to.eql(3)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import * as chartHelper from '@/lib/chartHelper'
|
||||
import chartHelper from '@/lib/chartHelper'
|
||||
import * as dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
|
||||
describe('chartHelper.js', () => {
|
||||
|
||||
@@ -18,7 +18,7 @@ describe('tooltipMixin.js', () => {
|
||||
template: '<div :style="tooltipStyle"></div>',
|
||||
mixins: [tooltipMixin]
|
||||
}
|
||||
const wrapper = mount(component)
|
||||
const wrapper = mount(component, { attachTo: container })
|
||||
expect(wrapper.find('div').isVisible()).to.equal(false)
|
||||
})
|
||||
|
||||
@@ -108,7 +108,7 @@ describe('tooltipMixin.js', () => {
|
||||
template: '<div :style="tooltipStyle"></div>',
|
||||
mixins: [tooltipMixin]
|
||||
}
|
||||
const wrapper = mount(component)
|
||||
const wrapper = mount(component, { attachTo: container })
|
||||
await wrapper.vm.showTooltip(new MouseEvent('mouseenter', {
|
||||
clientX: 10,
|
||||
clientY: 20
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import LoadView from '@/views/LoadView'
|
||||
import fu from '@/lib/utils/fileIo'
|
||||
import database from '@/lib/database'
|
||||
@@ -26,7 +26,7 @@ describe('LoadView.vue', () => {
|
||||
const actions = {
|
||||
addTab: sinon.stub().callsFake(realActions.addTab)
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = {
|
||||
path: '/workspace',
|
||||
query: {
|
||||
@@ -58,10 +58,10 @@ describe('LoadView.vue', () => {
|
||||
Tab.prototype.execute = sinon.stub()
|
||||
|
||||
const wrapper = mount(LoadView, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -106,7 +106,7 @@ describe('LoadView.vue', () => {
|
||||
const actions = {
|
||||
addTab: sinon.stub().callsFake(realActions.addTab)
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = {
|
||||
path: '/workspace',
|
||||
query: {
|
||||
@@ -136,10 +136,10 @@ describe('LoadView.vue', () => {
|
||||
})
|
||||
|
||||
const wrapper = mount(LoadView, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
@@ -1,14 +1,22 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import { mount, shallowMount } from '@vue/test-utils'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import Inquiries from '@/views/Main/Inquiries'
|
||||
import storedInquiries from '@/lib/storedInquiries'
|
||||
import mutations from '@/store/mutations'
|
||||
import actions from '@/store/actions'
|
||||
import fu from '@/lib/utils/fileIo'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
|
||||
describe('Inquiries.vue', () => {
|
||||
let clock
|
||||
|
||||
beforeEach(() => {
|
||||
clock = sinon.useFakeTimers()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
})
|
||||
@@ -24,10 +32,15 @@ describe('Inquiries.vue', () => {
|
||||
updatePredefinedInquiries: sinon.stub(),
|
||||
setLoadingPredefinedInquiries: sinon.stub()
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, {
|
||||
global: {
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
expect(wrapper.find('#start-guide').exists()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Renders the list of saved and predefined inquiries', async () => {
|
||||
@@ -64,10 +77,13 @@ describe('Inquiries.vue', () => {
|
||||
]
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: { plugins: [store] }
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
expect(wrapper.find('#start-guide').exists()).to.equal(false)
|
||||
expect(wrapper.find('#toolbar-btns-import').isVisible()).to.equal(true)
|
||||
@@ -82,6 +98,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(rows[1].findAll('td')[1].text()).to.equals('3 November 2020 20:57')
|
||||
expect(rows[2].findAll('td')[0].text()).to.equals('bar')
|
||||
expect(rows[2].findAll('td')[1].text()).to.equals('4 December 2020 19:53')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Filters the list of inquiries', async () => {
|
||||
@@ -118,15 +135,20 @@ describe('Inquiries.vue', () => {
|
||||
]
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, {
|
||||
global: {
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
await wrapper.find('#toolbar-search input').setValue('OO')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
expect(rows).to.have.lengthOf(1)
|
||||
expect(rows[0].findAll('td')[0].text()).to.equals('foo')
|
||||
expect(rows[0].findAll('td')[1].text()).to.contains('3 November 2020 20:57')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Shows No found message when filter returns nothing', async () => {
|
||||
@@ -163,14 +185,18 @@ describe('Inquiries.vue', () => {
|
||||
]
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: { plugins: [store] }
|
||||
})
|
||||
await wrapper.find('#toolbar-search input').setValue('baz')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
expect(wrapper.find('#inquiries-not-found').text()).to.equal('No inquiries found')
|
||||
expect(wrapper.find('#start-guide').exists()).to.equal(false)
|
||||
expect(wrapper.find('tbody').isVisible()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Predefined inquiry has a badge', async () => {
|
||||
@@ -199,14 +225,19 @@ describe('Inquiries.vue', () => {
|
||||
]
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = shallowMount(Inquiries, {
|
||||
global: {
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
expect(rows[0].find('td .badge').exists()).to.equals(true)
|
||||
expect(rows[1].find('td .badge').exists()).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Exports one inquiry', async () => {
|
||||
@@ -227,12 +258,13 @@ describe('Inquiries.vue', () => {
|
||||
]
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await wrapper.findComponent({ name: 'ExportIcon' }).find('svg').trigger('click')
|
||||
expect(fu.exportToFile.calledOnceWith('I am a serialized inquiry', 'foo.json')).to.equals(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Duplicates an inquiry', async () => {
|
||||
@@ -259,11 +291,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [inquiryInStorage]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await wrapper.findComponent({ name: 'CopyIcon' }).find('svg').trigger('click')
|
||||
|
||||
expect(storedInquiries.duplicateInquiry.calledOnceWith(inquiryInStorage)).to.equals(true)
|
||||
@@ -273,6 +305,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(rows[1].findAll('td')[0].text()).to.equals('foo copy')
|
||||
expect(rows[1].findAll('td')[1].text()).to.contains('3 December 2020 20:57')
|
||||
expect(state.inquiries).to.eql([inquiryInStorage, newInquiry])
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('The copy of the inquiry is not selected if all inquiries were selected before duplication',
|
||||
@@ -299,11 +332,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [inquiryInStorage]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await wrapper.findComponent({ ref: 'mainCheckBox' }).find('.checkbox-container')
|
||||
.trigger('click')
|
||||
await wrapper.findComponent({ name: 'CopyIcon' }).find('svg').trigger('click')
|
||||
@@ -311,6 +344,7 @@ describe('Inquiries.vue', () => {
|
||||
const checkboxes = wrapper.findAllComponents('[data-test="rowCheckBox"]')
|
||||
expect(checkboxes[0].vm.checked).to.equals(true)
|
||||
expect(checkboxes[1].vm.checked).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Opens an inquiry', async () => {
|
||||
@@ -332,23 +366,25 @@ describe('Inquiries.vue', () => {
|
||||
const actions = { addTab: sinon.stub().resolves(1) }
|
||||
sinon.spy(mutations, 'setCurrentTabId')
|
||||
const $router = { push: sinon.stub() }
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = shallowMount(Inquiries, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $router }
|
||||
mocks: { $router },
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await wrapper.find('tbody tr').trigger('click')
|
||||
await clock.tick(0)
|
||||
|
||||
expect(actions.addTab.calledOnce).to.equals(true)
|
||||
expect(actions.addTab.getCall(0).args[1]).to.equals(inquiryInStorage)
|
||||
expect(actions.addTab.getCall(0).args[1]).to.eql(inquiryInStorage)
|
||||
await actions.addTab.returnValues[0]
|
||||
expect(mutations.setCurrentTabId.calledOnceWith(state, 1)).to.equals(true)
|
||||
expect($router.push.calledOnceWith('/workspace')).to.equals(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Rename is not available for predefined inquiries', async () => {
|
||||
@@ -367,12 +403,13 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findComponent({ name: 'RenameIcon' }).exists()).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Renames an inquiry', async () => {
|
||||
@@ -392,17 +429,24 @@ describe('Inquiries.vue', () => {
|
||||
}
|
||||
]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// click Rename icon in the grid
|
||||
await wrapper.findComponent({ name: 'RenameIcon' }).find('svg').trigger('click')
|
||||
|
||||
// check that rename dialog is open
|
||||
expect(wrapper.find('[data-modal="rename"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Rename inquiry')
|
||||
|
||||
// check that input is filled by the current inquiry name
|
||||
expect(wrapper.find('.dialog-body input').element.value).to.equals('foo')
|
||||
@@ -412,10 +456,10 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// find Rename in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Rename')
|
||||
.trigger('click')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// check that the name in the grid is changed
|
||||
expect(wrapper.find('tbody tr td').text()).to.equals('bar')
|
||||
@@ -434,7 +478,9 @@ describe('Inquiries.vue', () => {
|
||||
expect(state.tabs[0].name).to.equals('bar')
|
||||
|
||||
// check that rename dialog is closed
|
||||
expect(wrapper.find('[data-modal="rename"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Shows an error if try to rename to empty string', async () => {
|
||||
@@ -454,11 +500,17 @@ describe('Inquiries.vue', () => {
|
||||
}
|
||||
]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// click Rename icon in the grid
|
||||
await wrapper.findComponent({ name: 'RenameIcon' }).find('svg').trigger('click')
|
||||
@@ -468,14 +520,16 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// find Rename in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Rename')
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.find('.dialog-body .text-field-error').text())
|
||||
.to.equals("Inquiry name can't be empty")
|
||||
// check that rename dialog is still open
|
||||
expect(wrapper.find('[data-modal="rename"]').exists()).to.equal(true)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Imports inquiries', async () => {
|
||||
@@ -502,11 +556,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [inquiryInStorage]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = shallowMount(Inquiries, { store })
|
||||
const wrapper = shallowMount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// click Import
|
||||
await wrapper.find('#toolbar-btns-import').trigger('click')
|
||||
@@ -516,6 +570,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(rows[1].findAll('td')[0].text()).to.equals('bar')
|
||||
expect(rows[1].findAll('td')[1].text()).to.equals('3 December 2020 20:57')
|
||||
expect(state.inquiries).to.eql([inquiryInStorage, importedInquiry])
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Imported inquiries are not selected if master check box was checked', async () => {
|
||||
@@ -542,11 +597,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [inquiryInStorage]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// click on master checkbox
|
||||
await wrapper.findComponent({ ref: 'mainCheckBox' }).find('.checkbox-container')
|
||||
@@ -559,6 +614,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(wrapper.findComponent({ ref: 'mainCheckBox' }).vm.checked).to.equals(false)
|
||||
expect(checkboxes[0].vm.checked).to.equals(true)
|
||||
expect(checkboxes[1].vm.checked).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Deletion is not available for predefined inquiries', async () => {
|
||||
@@ -577,12 +633,13 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.findComponent({ name: 'DeleteIcon' }).exists()).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Delete an inquiry', async () => {
|
||||
@@ -610,23 +667,31 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
// click Delete icon in the first row of the grid
|
||||
await wrapper.findComponent({ name: 'DeleteIcon' }).find('svg').trigger('click')
|
||||
|
||||
// check that delete dialog is open
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Delete inquiry')
|
||||
|
||||
// check the message in the dialog
|
||||
expect(wrapper.find('.dialog-body').text()).to.contains('"foo"?')
|
||||
|
||||
// find Delete in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Delete')
|
||||
.trigger('click')
|
||||
|
||||
@@ -642,7 +707,9 @@ describe('Inquiries.vue', () => {
|
||||
expect(state.inquiries).to.eql([bar])
|
||||
|
||||
// check that delete dialog is closed
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Group operations are available when there are checked rows', async () => {
|
||||
@@ -670,11 +737,14 @@ describe('Inquiries.vue', () => {
|
||||
}
|
||||
]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: { plugins: [store] }
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
expect(wrapper.find('#toolbar-btns-export').isVisible()).to.equal(false)
|
||||
expect(wrapper.find('#toolbar-btns-delete').isVisible()).to.equal(false)
|
||||
@@ -695,6 +765,7 @@ describe('Inquiries.vue', () => {
|
||||
await rows[0].find('.checkbox-container').trigger('click')
|
||||
expect(wrapper.find('#toolbar-btns-export').isVisible()).to.equal(true)
|
||||
expect(wrapper.find('#toolbar-btns-delete').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Exports a group of inquiries', async () => {
|
||||
@@ -730,11 +801,11 @@ describe('Inquiries.vue', () => {
|
||||
createdAt: '2020-03-08T19:57:56.299Z'
|
||||
}]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
|
||||
@@ -751,6 +822,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(
|
||||
fu.exportToFile.calledOnceWith('I am a serialized inquiries', 'My sqliteviz inquiries.json')
|
||||
).to.equals(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Exports all inquiries', async () => {
|
||||
@@ -779,11 +851,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [inquiryInStore]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.findComponent({ ref: 'mainCheckBox' }).find('.checkbox-container')
|
||||
.trigger('click')
|
||||
@@ -797,6 +869,7 @@ describe('Inquiries.vue', () => {
|
||||
expect(
|
||||
fu.exportToFile.calledOnceWith('I am a serialized inquiries', 'My sqliteviz inquiries.json')
|
||||
).to.equals(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Deletes a group of inquiries', async () => {
|
||||
@@ -841,11 +914,17 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar, baz]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
|
||||
@@ -856,7 +935,7 @@ describe('Inquiries.vue', () => {
|
||||
await wrapper.find('#toolbar-btns-delete').trigger('click')
|
||||
|
||||
// check that delete dialog is open
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
|
||||
// check the message in the dialog
|
||||
expect(wrapper.find('.dialog-body').text())
|
||||
@@ -864,7 +943,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// find Delete in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Delete')
|
||||
.trigger('click')
|
||||
|
||||
@@ -882,7 +961,9 @@ describe('Inquiries.vue', () => {
|
||||
expect(state.inquiries).to.eql([baz])
|
||||
|
||||
// check that delete dialog is closed
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Ignores predefined inquiries during deletion', async () => {
|
||||
@@ -918,11 +999,17 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const rows = wrapper.findAll('tbody tr')
|
||||
|
||||
@@ -933,7 +1020,7 @@ describe('Inquiries.vue', () => {
|
||||
await wrapper.find('#toolbar-btns-delete').trigger('click')
|
||||
|
||||
// check that delete dialog is open
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
|
||||
// check the message in the dialog
|
||||
expect(wrapper.find('.dialog-body').text())
|
||||
@@ -943,7 +1030,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// find Delete in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Delete')
|
||||
.trigger('click')
|
||||
|
||||
@@ -956,7 +1043,9 @@ describe('Inquiries.vue', () => {
|
||||
expect(state.inquiries).to.eql([bar])
|
||||
|
||||
// check that delete dialog is closed
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Deletes all inquiries ignoring predefined ones', async () => {
|
||||
@@ -992,11 +1081,17 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
await wrapper.findComponent({ ref: 'mainCheckBox' }).find('.checkbox-container')
|
||||
.trigger('click')
|
||||
@@ -1004,7 +1099,7 @@ describe('Inquiries.vue', () => {
|
||||
await wrapper.find('#toolbar-btns-delete').trigger('click')
|
||||
|
||||
// check that delete dialog is open
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
|
||||
// check the message in the dialog
|
||||
expect(wrapper.find('.dialog-body').text())
|
||||
@@ -1014,7 +1109,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// find Delete in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Delete')
|
||||
.trigger('click')
|
||||
|
||||
@@ -1026,7 +1121,9 @@ describe('Inquiries.vue', () => {
|
||||
expect(state.inquiries).to.eql([])
|
||||
|
||||
// check that delete dialog is closed
|
||||
expect(wrapper.find('[data-modal="delete"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Main checkbox', async () => {
|
||||
@@ -1052,11 +1149,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const mainCheckBox = wrapper.findComponent({ ref: 'mainCheckBox' })
|
||||
// Select all with main checkbox
|
||||
@@ -1076,6 +1173,7 @@ describe('Inquiries.vue', () => {
|
||||
await mainCheckBox.find('.checkbox-container').trigger('click')
|
||||
expect(checkboxes[0].vm.checked).to.equals(false)
|
||||
expect(checkboxes[0].vm.checked).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Selection and filter', async () => {
|
||||
@@ -1110,11 +1208,11 @@ describe('Inquiries.vue', () => {
|
||||
predefinedInquiries: [],
|
||||
inquiries: [foo, bar]
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
|
||||
const wrapper = mount(Inquiries, { store })
|
||||
const wrapper = mount(Inquiries, { global: { plugins: [store] } })
|
||||
await storedInquiries.readPredefinedInquiries.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
const mainCheckBox = wrapper.findComponent({ ref: 'mainCheckBox' })
|
||||
// Select all with main checkbox
|
||||
@@ -1128,7 +1226,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// Filter
|
||||
await wrapper.find('#toolbar-search input').setValue('foo')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect([...wrapper.vm.selectedInquiriesIds]).to.eql([1])
|
||||
expect(wrapper.vm.selectedNotPredefinedCount).to.eql(1)
|
||||
checkboxes = wrapper.findAllComponents('[data-test="rowCheckBox"]')
|
||||
@@ -1136,7 +1234,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// Clear filter
|
||||
await wrapper.find('#toolbar-search input').setValue('')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect([...wrapper.vm.selectedInquiriesIds]).to.eql([1])
|
||||
expect(wrapper.vm.selectedNotPredefinedCount).to.eql(1)
|
||||
checkboxes = wrapper.findAll('tr .checkbox-container')
|
||||
@@ -1151,7 +1249,7 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// Filter
|
||||
await wrapper.find('#toolbar-search input').setValue('hello')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect([...wrapper.vm.selectedInquiriesIds]).to.eql([0])
|
||||
expect(wrapper.vm.selectedNotPredefinedCount).to.eql(0)
|
||||
checkboxes = wrapper.findAllComponents('[data-test="rowCheckBox"]')
|
||||
@@ -1162,7 +1260,8 @@ describe('Inquiries.vue', () => {
|
||||
|
||||
// Clear filter - main checkbox bocomes not checked
|
||||
await wrapper.find('#toolbar-search input').setValue('')
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
expect(mainCheckBox.vm.checked).to.equals(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,13 +1,23 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import { mount, shallowMount, DOMWrapper } from '@vue/test-utils'
|
||||
import Vuex from 'vuex'
|
||||
import { mount, shallowMount } from '@vue/test-utils'
|
||||
import { createStore } from 'vuex'
|
||||
import MainMenu from '@/views/Main/MainMenu'
|
||||
import storedInquiries from '@/lib/storedInquiries'
|
||||
import { nextTick } from 'vue'
|
||||
import eventBus from '@/lib/eventBus'
|
||||
|
||||
let wrapper = null
|
||||
|
||||
describe('MainMenu.vue', () => {
|
||||
let clock
|
||||
|
||||
beforeEach(() => {
|
||||
clock = sinon.useFakeTimers()
|
||||
sinon.spy(eventBus, '$emit')
|
||||
sinon.spy(eventBus, '$off')
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
|
||||
@@ -22,22 +32,33 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [{}],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
// mount the component
|
||||
// mount the component on workspace
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
expect(wrapper.find('#save-btn').exists()).to.equal(true)
|
||||
expect(wrapper.find('#save-btn').isVisible()).to.equal(true)
|
||||
expect(wrapper.find('#create-btn').exists()).to.equal(true)
|
||||
expect(wrapper.find('#create-btn').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
|
||||
await wrapper.vm.$set(wrapper.vm.$route, 'path', '/inquiries')
|
||||
$route.path = '/inquiries'
|
||||
// mount the component on inquiries
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
expect(wrapper.find('#save-btn').exists()).to.equal(true)
|
||||
expect(wrapper.find('#save-btn').isVisible()).to.equal(false)
|
||||
expect(wrapper.find('#create-btn').exists()).to.equal(true)
|
||||
@@ -50,13 +71,14 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
expect(wrapper.find('#save-btn').exists()).to.equal(true)
|
||||
@@ -77,20 +99,20 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [tab],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
const vm = wrapper.vm
|
||||
expect(wrapper.find('#save-btn').element.disabled).to.equal(false)
|
||||
|
||||
await vm.$set(state.tabs[0], 'isSaved', true)
|
||||
store.state.tabs[0].isSaved = true
|
||||
await vm.$nextTick()
|
||||
expect(wrapper.find('#save-btn').element.disabled).to.equal(true)
|
||||
})
|
||||
@@ -113,15 +135,15 @@ describe('MainMenu.vue', () => {
|
||||
const mutations = {
|
||||
setCurrentTabId: sinon.stub()
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
const $router = { push: sinon.stub() }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -150,15 +172,15 @@ describe('MainMenu.vue', () => {
|
||||
const mutations = {
|
||||
setCurrentTabId: sinon.stub()
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/inquiries' }
|
||||
const $router = { push: sinon.stub() }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -181,15 +203,15 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [tab],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
const $router = { push: sinon.stub() }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -202,15 +224,15 @@ describe('MainMenu.vue', () => {
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
|
||||
// Running is disabled and route path is workspace
|
||||
await wrapper.vm.$set(state, 'db', null)
|
||||
store.state.db = null
|
||||
document.dispatchEvent(ctrlR)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaR)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
|
||||
// Running is enabled and route path is not workspace
|
||||
await wrapper.vm.$set(state, 'db', {})
|
||||
await wrapper.vm.$set($route, 'path', '/inquiries')
|
||||
state.db = {}
|
||||
wrapper.vm.$route.path = '/inquiries'
|
||||
document.dispatchEvent(ctrlR)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaR)
|
||||
@@ -229,15 +251,15 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [tab],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
const $router = { push: sinon.stub() }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route, $router },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -250,15 +272,15 @@ describe('MainMenu.vue', () => {
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
|
||||
// Running is disabled and route path is workspace
|
||||
await wrapper.vm.$set(state, 'db', null)
|
||||
store.state.db = null
|
||||
document.dispatchEvent(ctrlEnter)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaEnter)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
|
||||
// Running is enabled and route path is not workspace
|
||||
await wrapper.vm.$set(state, 'db', {})
|
||||
await wrapper.vm.$set($route, 'path', '/inquiries')
|
||||
store.state.db = {}
|
||||
wrapper.vm.$route.path = '/inquiries'
|
||||
document.dispatchEvent(ctrlEnter)
|
||||
expect(state.currentTab.execute.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaEnter)
|
||||
@@ -276,14 +298,14 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [tab],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
sinon.stub(wrapper.vm, 'createNewInquiry')
|
||||
@@ -295,7 +317,7 @@ describe('MainMenu.vue', () => {
|
||||
document.dispatchEvent(metaB)
|
||||
expect(wrapper.vm.createNewInquiry.calledTwice).to.equal(true)
|
||||
|
||||
await wrapper.vm.$set($route, 'path', '/inquiries')
|
||||
wrapper.vm.$route.path = '/inquiries'
|
||||
document.dispatchEvent(ctrlB)
|
||||
expect(wrapper.vm.createNewInquiry.calledThrice).to.equal(true)
|
||||
document.dispatchEvent(metaB)
|
||||
@@ -314,14 +336,14 @@ describe('MainMenu.vue', () => {
|
||||
tabs: [tab],
|
||||
db: {}
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
const $route = { path: '/workspace' }
|
||||
|
||||
wrapper = shallowMount(MainMenu, {
|
||||
store,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
sinon.stub(wrapper.vm, 'checkInquiryBeforeSave')
|
||||
@@ -335,15 +357,15 @@ describe('MainMenu.vue', () => {
|
||||
expect(wrapper.vm.checkInquiryBeforeSave.calledTwice).to.equal(true)
|
||||
|
||||
// tab is saved and route is /workspace
|
||||
await wrapper.vm.$set(state.tabs[0], 'isSaved', true)
|
||||
store.state.tabs[0].isSaved = true
|
||||
document.dispatchEvent(ctrlS)
|
||||
expect(wrapper.vm.checkInquiryBeforeSave.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaS)
|
||||
expect(wrapper.vm.checkInquiryBeforeSave.calledTwice).to.equal(true)
|
||||
|
||||
// tab is unsaved and route is not /workspace
|
||||
await wrapper.vm.$set($route, 'path', '/inquiries')
|
||||
await wrapper.vm.$set(state.tabs[0], 'isSaved', false)
|
||||
wrapper.vm.$route.path = '/inquiries'
|
||||
store.state.tabs[0].isSaved = false
|
||||
document.dispatchEvent(ctrlS)
|
||||
expect(wrapper.vm.checkInquiryBeforeSave.calledTwice).to.equal(true)
|
||||
document.dispatchEvent(metaS)
|
||||
@@ -376,22 +398,26 @@ describe('MainMenu.vue', () => {
|
||||
viewOptions: []
|
||||
})
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
sinon.stub(storedInquiries, 'isTabNeedName').returns(false)
|
||||
|
||||
wrapper = mount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link', 'app-diagnostic-info']
|
||||
stubs: {
|
||||
'router-link': true, 'app-diagnostic-info': true,
|
||||
teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('#save-btn').trigger('click')
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(false)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
|
||||
// check that the inquiry was saved via saveInquiry (newName='')
|
||||
expect(actions.saveInquiry.calledOnce).to.equal(true)
|
||||
@@ -412,8 +438,8 @@ describe('MainMenu.vue', () => {
|
||||
}
|
||||
}))).to.equal(true)
|
||||
|
||||
// check that 'inquirySaved' event was triggered on $root
|
||||
expect(new DOMWrapper(wrapper.vm.$root).emitted('inquirySaved')).to.have.lengthOf(1)
|
||||
// check that 'inquirySaved' event was triggered on eventBus
|
||||
expect(eventBus.$emit.calledOnceWith('inquirySaved')).to.equal(true)
|
||||
})
|
||||
|
||||
it('Shows en error when the new name is needed but not specifyied', async () => {
|
||||
@@ -442,32 +468,39 @@ describe('MainMenu.vue', () => {
|
||||
viewOptions: []
|
||||
})
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
sinon.stub(storedInquiries, 'isTabNeedName').returns(true)
|
||||
|
||||
wrapper = mount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link', 'app-diagnostic-info']
|
||||
stubs: {
|
||||
'router-link': true, 'app-diagnostic-info': true,
|
||||
teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('#save-btn').trigger('click')
|
||||
|
||||
// check that the dialog is open
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Save inquiry')
|
||||
|
||||
// find Save in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Save')
|
||||
.trigger('click')
|
||||
|
||||
// check that we have an error message and dialog is still open
|
||||
expect(wrapper.find('.text-field-error').text()).to.equal('Inquiry name can\'t be empty')
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(true)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
})
|
||||
|
||||
it('Saves the inquiry with a new name', async () => {
|
||||
@@ -496,36 +529,43 @@ describe('MainMenu.vue', () => {
|
||||
viewOptions: []
|
||||
})
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
sinon.stub(storedInquiries, 'isTabNeedName').returns(true)
|
||||
|
||||
wrapper = mount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link', 'app-diagnostic-info']
|
||||
stubs: {
|
||||
'router-link': true, 'app-diagnostic-info': true,
|
||||
teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('#save-btn').trigger('click')
|
||||
|
||||
// check that the dialog is open
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Save inquiry')
|
||||
|
||||
// enter the new name
|
||||
await wrapper.find('.dialog-body input').setValue('foo')
|
||||
|
||||
// find Save in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Save')
|
||||
.trigger('click')
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
|
||||
// check that the inquiry was saved via saveInquiry (newName='foo')
|
||||
expect(actions.saveInquiry.calledOnce).to.equal(true)
|
||||
@@ -547,8 +587,8 @@ describe('MainMenu.vue', () => {
|
||||
}
|
||||
}))).to.equal(true)
|
||||
|
||||
// check that 'inquirySaved' event was triggered on $root
|
||||
expect(new DOMWrapper(wrapper.vm.$root).emitted('inquirySaved')).to.have.lengthOf(1)
|
||||
// check that 'inquirySaved' event was triggered on eventBus
|
||||
expect(eventBus.$emit.calledOnceWith('inquirySaved')).to.equal(true)
|
||||
})
|
||||
|
||||
it('Saves a predefined inquiry with a new name', async () => {
|
||||
@@ -586,22 +626,28 @@ describe('MainMenu.vue', () => {
|
||||
viewOptions: []
|
||||
})
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
sinon.stub(storedInquiries, 'isTabNeedName').returns(true)
|
||||
|
||||
wrapper = mount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link', 'app-diagnostic-info']
|
||||
stubs: {
|
||||
'router-link': true, 'app-diagnostic-info': true,
|
||||
teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('#save-btn').trigger('click')
|
||||
|
||||
// check that the dialog is open
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Save inquiry')
|
||||
|
||||
// check that save-note is visible (save-note is an explanation why do we need a new name)
|
||||
expect(wrapper.find('#save-note').isVisible()).to.equal(true)
|
||||
@@ -611,14 +657,15 @@ describe('MainMenu.vue', () => {
|
||||
|
||||
// find Save in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Save')
|
||||
.trigger('click')
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
|
||||
// check that the inquiry was saved via saveInquiry (newName='bar')
|
||||
expect(actions.saveInquiry.calledOnce).to.equal(true)
|
||||
@@ -640,8 +687,8 @@ describe('MainMenu.vue', () => {
|
||||
}
|
||||
}))).to.equal(true)
|
||||
|
||||
// check that 'inquirySaved' event was triggered on $root
|
||||
expect(new DOMWrapper(wrapper.vm.$root).emitted('inquirySaved')).to.have.lengthOf(1)
|
||||
// check that 'inquirySaved' event was triggered on eventBus
|
||||
expect(eventBus.$emit.calledOnceWith('inquirySaved')).to.equal(true)
|
||||
|
||||
// We saved predefined inquiry, so the tab will be created again
|
||||
// (because of new id) and it will be without sql result and has default view - table.
|
||||
@@ -682,31 +729,38 @@ describe('MainMenu.vue', () => {
|
||||
chart: []
|
||||
})
|
||||
}
|
||||
const store = new Vuex.Store({ state, mutations, actions })
|
||||
const store = createStore({ state, mutations, actions })
|
||||
const $route = { path: '/workspace' }
|
||||
sinon.stub(storedInquiries, 'isTabNeedName').returns(true)
|
||||
|
||||
wrapper = mount(MainMenu, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
mocks: { $route },
|
||||
stubs: ['router-link', 'app-diagnostic-info']
|
||||
stubs: {
|
||||
'router-link': true, 'app-diagnostic-info': true,
|
||||
teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.find('#save-btn').trigger('click')
|
||||
|
||||
// check that the dialog is open
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('Save inquiry')
|
||||
|
||||
// find Cancel in the dialog and click
|
||||
await wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Cancel')
|
||||
.trigger('click')
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="save"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
|
||||
// check that the inquiry was not saved via storedInquiries.save
|
||||
expect(actions.saveInquiry.called).to.equal(false)
|
||||
@@ -714,7 +768,7 @@ describe('MainMenu.vue', () => {
|
||||
// check that the tab was not updated
|
||||
expect(mutations.updateTab.called).to.equal(false)
|
||||
|
||||
// check that 'inquirySaved' event is not listened on $root
|
||||
expect(wrapper.vm.$root.$listeners).to.not.have.property('inquirySaved')
|
||||
// check that 'inquirySaved' event is not listened on eventBus
|
||||
expect(eventBus.$off.calledOnceWith('inquirySaved')).to.equal(true)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -9,8 +9,16 @@ import TableDescription from '@/views/Main/Workspace/Schema/TableDescription'
|
||||
import database from '@/lib/database'
|
||||
import fIo from '@/lib/utils/fileIo'
|
||||
import csv from '@/lib/csv'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
|
||||
describe('Schema.vue', () => {
|
||||
let clock
|
||||
|
||||
beforeEach(() => {
|
||||
clock = sinon.useFakeTimers()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
})
|
||||
@@ -34,6 +42,7 @@ describe('Schema.vue', () => {
|
||||
// check DB name and schema visibility
|
||||
expect(wrapper.find('.db-name').text()).to.equal('fooDB')
|
||||
expect(wrapper.find('.schema').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Schema visibility is toggled when click on DB name', async () => {
|
||||
@@ -47,6 +56,7 @@ describe('Schema.vue', () => {
|
||||
|
||||
// mout the component
|
||||
const wrapper = mount(Schema, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store]
|
||||
}
|
||||
@@ -57,6 +67,7 @@ describe('Schema.vue', () => {
|
||||
expect(wrapper.find('.schema').isVisible()).to.equal(false)
|
||||
await wrapper.find('.db-name').trigger('click')
|
||||
expect(wrapper.find('.schema').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Schema filter', async () => {
|
||||
@@ -117,6 +128,7 @@ describe('Schema.vue', () => {
|
||||
expect(tables[0].vm.name).to.equal('foo')
|
||||
expect(tables[1].vm.name).to.equal('bar')
|
||||
expect(tables[2].vm.name).to.equal('foobar')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('exports db', async () => {
|
||||
@@ -135,6 +147,7 @@ describe('Schema.vue', () => {
|
||||
|
||||
await wrapper.findComponent({ name: 'export-icon' }).find('svg').trigger('click')
|
||||
expect(state.db.export.calledOnceWith('fooDB'))
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('adds table', async () => {
|
||||
@@ -165,8 +178,10 @@ describe('Schema.vue', () => {
|
||||
|
||||
const store = createStore({ state, actions, mutations })
|
||||
const wrapper = mount(Schema, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
plugins: [store]
|
||||
plugins: [store],
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
sinon.spy(wrapper.vm.$refs.addCsvJson, 'preview')
|
||||
@@ -176,13 +191,16 @@ describe('Schema.vue', () => {
|
||||
await wrapper.findComponent({ name: 'add-table-icon' }).find('svg').trigger('click')
|
||||
await wrapper.vm.$refs.addCsvJson.preview.returnValues[0]
|
||||
await wrapper.vm.addCsvJson.returnValues[0]
|
||||
await wrapper.vm.$nextTick()
|
||||
await wrapper.vm.$nextTick()
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(true)
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm .dialog-header').text())
|
||||
.to.contain('CSV import')
|
||||
await wrapper.find('#import-start').trigger('click')
|
||||
await wrapper.vm.$refs.addCsvJson.loadToDb.returnValues[0]
|
||||
await wrapper.find('#import-finish').trigger('click')
|
||||
expect(wrapper.find('[data-modal="addCsvJson"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
await state.db.refreshSchema.returnValues[0]
|
||||
|
||||
expect(wrapper.vm.$store.state.db.schema).to.eql([
|
||||
@@ -195,5 +213,6 @@ describe('Schema.vue', () => {
|
||||
col1: [1],
|
||||
col2: ['foo']
|
||||
})
|
||||
wrapper.unmount()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -5,6 +5,7 @@ import TableDescription from '@/views/Main/Workspace/Schema/TableDescription'
|
||||
describe('TableDescription.vue', () => {
|
||||
it('Initially the columns are hidden and table name is rendered', () => {
|
||||
const wrapper = shallowMount(TableDescription, {
|
||||
attachTo: document.body,
|
||||
props: {
|
||||
name: 'Test table',
|
||||
columns: [
|
||||
@@ -15,6 +16,7 @@ describe('TableDescription.vue', () => {
|
||||
})
|
||||
expect(wrapper.find('.table-name').text()).to.equal('Test table')
|
||||
expect(wrapper.find('.columns').isVisible()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Columns are visible and correct when click on table name', async () => {
|
||||
|
||||
@@ -5,6 +5,7 @@ import Chart from '@/views/Main/Workspace/Tabs/Tab/DataView/Chart'
|
||||
import chartHelper from '@/lib/chartHelper'
|
||||
import * as dereference from 'react-chart-editor/lib/lib/dereference'
|
||||
import fIo from '@/lib/utils/fileIo'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('Chart.vue', () => {
|
||||
afterEach(() => {
|
||||
@@ -19,13 +20,15 @@ describe('Chart.vue', () => {
|
||||
const chartData = vm.getOptionsForSave()
|
||||
expect(stub.calledOnceWith(vm.state, vm.dataSources)).to.equal(true)
|
||||
expect(chartData).to.equal('result')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('emits update when plotly updates', async () => {
|
||||
// mount the component
|
||||
const wrapper = mount(Chart)
|
||||
wrapper.findComponent({ ref: 'plotlyEditor' }).vm.$emit('onUpdate')
|
||||
wrapper.findComponent({ ref: 'plotlyEditor' }).vm.$emit('update')
|
||||
expect(wrapper.emitted('update')).to.have.lengthOf(1)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('calls dereference when dataSources is changed', async () => {
|
||||
@@ -47,6 +50,7 @@ describe('Chart.vue', () => {
|
||||
|
||||
await wrapper.setProps({ dataSources: newDataSources })
|
||||
expect(dereference.default.called).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it("doesn't calls dereference when dataSources is null", async () => {
|
||||
@@ -63,6 +67,7 @@ describe('Chart.vue', () => {
|
||||
|
||||
await wrapper.setProps({ dataSources: null })
|
||||
expect(dereference.default.called).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('saveAsPng', async () => {
|
||||
@@ -77,11 +82,12 @@ describe('Chart.vue', () => {
|
||||
})
|
||||
sinon.spy(wrapper.vm, 'prepareCopy')
|
||||
|
||||
await wrapper.vm.$nextTick() // chart is rendered
|
||||
await nextTick() // chart is rendered
|
||||
await wrapper.vm.saveAsPng()
|
||||
|
||||
const url = await wrapper.vm.prepareCopy.returnValues[0]
|
||||
expect(wrapper.emitted().loadingImageCompleted.length).to.equal(1)
|
||||
expect(fIo.downloadFromUrl.calledOnceWith(url, 'chart'))
|
||||
wrapper.unmount()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import { expect } from 'chai'
|
||||
import { mount, DOMWrapper } from '@vue/test-utils'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import DataView from '@/views/Main/Workspace/Tabs/Tab/DataView'
|
||||
import sinon from 'sinon'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('DataView.vue', () => {
|
||||
afterEach(() => {
|
||||
@@ -11,10 +12,11 @@ describe('DataView.vue', () => {
|
||||
it('emits update on mode changing', async () => {
|
||||
const wrapper = mount(DataView)
|
||||
|
||||
const pivotBtn = new DOMWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
|
||||
const pivotBtn = wrapper.findComponent({ ref: 'pivotBtn' })
|
||||
await pivotBtn.trigger('click')
|
||||
|
||||
expect(wrapper.emitted('update')).to.have.lengthOf(1)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('method getOptionsForSave calls the same method of the current view component', async () => {
|
||||
@@ -25,13 +27,14 @@ describe('DataView.vue', () => {
|
||||
|
||||
expect(wrapper.vm.getOptionsForSave()).to.eql({ here_are: 'chart_settings' })
|
||||
|
||||
const pivotBtn = new DOMWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
|
||||
const pivotBtn = wrapper.findComponent({ ref: 'pivotBtn' })
|
||||
await pivotBtn.trigger('click')
|
||||
|
||||
const pivot = wrapper.findComponent({ name: 'pivot' }).vm
|
||||
sinon.stub(pivot, 'getOptionsForSave').returns({ here_are: 'pivot_settings' })
|
||||
|
||||
expect(wrapper.vm.getOptionsForSave()).to.eql({ here_are: 'pivot_settings' })
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('method saveAsSvg calls the same method of the current view component', async () => {
|
||||
@@ -42,12 +45,12 @@ describe('DataView.vue', () => {
|
||||
sinon.spy(chart, 'saveAsSvg')
|
||||
|
||||
// Export to svg
|
||||
const svgBtn = new DOMWrapper(wrapper.findComponent({ name: 'exportToSvgIcon' }).vm.$parent)
|
||||
const svgBtn = wrapper.findComponent({ ref: 'svgExportBtn' })
|
||||
await svgBtn.trigger('click')
|
||||
expect(chart.saveAsSvg.calledOnce).to.equal(true)
|
||||
|
||||
// Switch to pivot
|
||||
const pivotBtn = new DOMWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
|
||||
const pivotBtn = wrapper.findComponent({ ref: 'pivotBtn' })
|
||||
await pivotBtn.trigger('click')
|
||||
|
||||
// Find pivot and spy the method
|
||||
@@ -61,6 +64,7 @@ describe('DataView.vue', () => {
|
||||
// Export to svg
|
||||
await svgBtn.trigger('click')
|
||||
expect(pivot.saveAsSvg.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('method saveAsHtml calls the same method of the current view component', async () => {
|
||||
@@ -71,12 +75,12 @@ describe('DataView.vue', () => {
|
||||
sinon.spy(chart, 'saveAsHtml')
|
||||
|
||||
// Export to html
|
||||
const htmlBtn = new DOMWrapper(wrapper.findComponent({ name: 'htmlIcon' }).vm.$parent)
|
||||
const htmlBtn = wrapper.findComponent({ ref: 'htmlExportBtn' })
|
||||
await htmlBtn.trigger('click')
|
||||
expect(chart.saveAsHtml.calledOnce).to.equal(true)
|
||||
|
||||
// Switch to pivot
|
||||
const pivotBtn = new DOMWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
|
||||
const pivotBtn = wrapper.findComponent({ ref: 'pivotBtn' })
|
||||
await pivotBtn.trigger('click')
|
||||
|
||||
// Find pivot and spy the method
|
||||
@@ -86,6 +90,7 @@ describe('DataView.vue', () => {
|
||||
// Export to svg
|
||||
await htmlBtn.trigger('click')
|
||||
expect(pivot.saveAsHtml.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('shows alert when ClipboardItem is not supported', async () => {
|
||||
@@ -94,7 +99,7 @@ describe('DataView.vue', () => {
|
||||
sinon.spy(window, 'alert')
|
||||
const wrapper = mount(DataView)
|
||||
|
||||
const copyBtn = new DOMWrapper(wrapper.findComponent({ name: 'clipboardIcon' }).vm.$parent)
|
||||
const copyBtn = wrapper.findComponent({ ref: 'copyToClipboardBtn' })
|
||||
await copyBtn.trigger('click')
|
||||
|
||||
expect(
|
||||
@@ -106,35 +111,44 @@ describe('DataView.vue', () => {
|
||||
).to.equal(true)
|
||||
|
||||
window.ClipboardItem = ClipboardItem
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('copy to clipboard more than 1 sec', async () => {
|
||||
sinon.stub(window.navigator.clipboard, 'write').resolves()
|
||||
const clock = sinon.useFakeTimers()
|
||||
const wrapper = mount(DataView)
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').callsFake(() => {
|
||||
clock.tick(5000)
|
||||
const wrapper = mount(DataView, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').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')
|
||||
|
||||
// The dialog is shown...
|
||||
expect(wrapper.find('[data-modal="prepareCopy"]').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 Rendering message...
|
||||
expect(wrapper.find('.dialog-body').text()).to.equal('Rendering the visualisation...')
|
||||
|
||||
// Switch to microtasks (let prepareCopy run)
|
||||
clock.tick(0)
|
||||
await clock.tick(0)
|
||||
// Wait untill prepareCopy is finished
|
||||
await wrapper.vm.$refs.viewComponent.prepareCopy.returnValues[0]
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
await nextTick()
|
||||
|
||||
// The dialog is shown...
|
||||
expect(wrapper.find('[data-modal="prepareCopy"]').exists()).to.equal(true)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(true)
|
||||
|
||||
// ... with Ready message...
|
||||
expect(wrapper.find('.dialog-body').text()).to.equal('Image is ready')
|
||||
@@ -143,7 +157,9 @@ describe('DataView.vue', () => {
|
||||
await wrapper.find('.dialog-buttons-container button.primary').trigger('click')
|
||||
|
||||
// The dialog is not shown...
|
||||
expect(wrapper.find('[data-modal="prepareCopy"]').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 () => {
|
||||
@@ -151,52 +167,60 @@ describe('DataView.vue', () => {
|
||||
const clock = sinon.useFakeTimers()
|
||||
const wrapper = mount(DataView)
|
||||
sinon.spy(wrapper.vm, 'copyToClipboard')
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').callsFake(() => {
|
||||
clock.tick(500)
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').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 prepareCopy run)
|
||||
clock.tick(0)
|
||||
await clock.tick(0)
|
||||
// Wait untill prepareCopy is finished
|
||||
await wrapper.vm.$refs.viewComponent.prepareCopy.returnValues[0]
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
// The dialog is not shown...
|
||||
expect(wrapper.find('[data-modal="prepareCopy"]').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, 'write').resolves()
|
||||
const clock = sinon.useFakeTimers()
|
||||
const wrapper = mount(DataView)
|
||||
const wrapper = mount(DataView, {
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: { teleport: true, transition: false }
|
||||
}
|
||||
})
|
||||
sinon.spy(wrapper.vm, 'copyToClipboard')
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').callsFake(() => {
|
||||
clock.tick(5000)
|
||||
sinon.stub(wrapper.vm.$refs.viewComponent, 'prepareCopy').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 prepareCopy run)
|
||||
clock.tick(0)
|
||||
await clock.tick(0)
|
||||
// Wait untill prepareCopy is finished
|
||||
await wrapper.vm.$refs.viewComponent.prepareCopy.returnValues[0]
|
||||
|
||||
await wrapper.vm.$nextTick()
|
||||
await nextTick()
|
||||
|
||||
// Click cancel
|
||||
await wrapper.find('.dialog-buttons-container button.secondary').trigger('click')
|
||||
|
||||
// The dialog is not shown...
|
||||
expect(wrapper.find('[data-modal="prepareCopy"]').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()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -123,7 +123,7 @@ describe('Pivot.vue', () => {
|
||||
}
|
||||
})
|
||||
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).setValue({
|
||||
rows: ['year'],
|
||||
cols: ['item'],
|
||||
colOrder: 'value_a_to_z',
|
||||
@@ -132,9 +132,10 @@ describe('Pivot.vue', () => {
|
||||
aggregatorName: 'Count',
|
||||
renderer: $.pivotUtilities.renderers.Table,
|
||||
rendererName: 'Table',
|
||||
rendererOptions: undefined,
|
||||
vals: []
|
||||
})
|
||||
sinon.stub(wrapper.findComponent({ref: "customChart"}).vm, 'getOptionsForSave')
|
||||
.returns({ here_are: 'custom chart settings' })
|
||||
|
||||
let optionsForSave = wrapper.vm.getOptionsForSave()
|
||||
|
||||
@@ -147,7 +148,7 @@ describe('Pivot.vue', () => {
|
||||
expect(optionsForSave.rendererOptions).to.equal(undefined)
|
||||
expect(optionsForSave.vals).to.eql([])
|
||||
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).setValue({
|
||||
rows: ['item'],
|
||||
cols: ['year'],
|
||||
colOrder: 'value_a_to_z',
|
||||
@@ -156,14 +157,6 @@ describe('Pivot.vue', () => {
|
||||
aggregatorName: 'Count',
|
||||
renderer: $.pivotUtilities.renderers['Custom chart'],
|
||||
rendererName: 'Custom chart',
|
||||
rendererOptions: {
|
||||
customChartComponent: {
|
||||
$mount: sinon.stub(),
|
||||
getOptionsForSave () {
|
||||
return { here_are: 'custom chart settings' }
|
||||
}
|
||||
}
|
||||
},
|
||||
vals: []
|
||||
})
|
||||
|
||||
@@ -202,7 +195,10 @@ describe('Pivot.vue', () => {
|
||||
|
||||
expect(await wrapper.vm.prepareCopy()).to.be.instanceof(HTMLCanvasElement)
|
||||
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
|
||||
sinon.stub(wrapper.findComponent({ref: "customChart"}).vm, 'prepareCopy')
|
||||
.returns(URL.createObjectURL(new Blob()))
|
||||
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).setValue({
|
||||
rows: ['item'],
|
||||
cols: ['year'],
|
||||
colOrder: 'value_a_to_z',
|
||||
@@ -211,18 +207,12 @@ describe('Pivot.vue', () => {
|
||||
aggregatorName: 'Count',
|
||||
renderer: $.pivotUtilities.renderers['Custom chart'],
|
||||
rendererName: 'Custom chart',
|
||||
rendererOptions: {
|
||||
customChartComponent: {
|
||||
$mount: sinon.stub(),
|
||||
prepareCopy: sinon.stub().returns(URL.createObjectURL(new Blob()))
|
||||
}
|
||||
},
|
||||
vals: []
|
||||
})
|
||||
|
||||
expect(await wrapper.vm.prepareCopy()).to.be.a('string')
|
||||
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
|
||||
await wrapper.findComponent({ name: 'pivotUi' }).setValue({
|
||||
rows: ['item'],
|
||||
cols: ['year'],
|
||||
colOrder: 'value_a_to_z',
|
||||
@@ -265,7 +255,7 @@ describe('Pivot.vue', () => {
|
||||
attachTo: container
|
||||
})
|
||||
|
||||
const chartComponent = wrapper.vm.pivotOptions.rendererOptions.customChartComponent
|
||||
const chartComponent = wrapper.findComponent({ref: "customChart"}).vm
|
||||
sinon.stub(chartComponent, 'saveAsSvg')
|
||||
|
||||
await wrapper.vm.saveAsSvg()
|
||||
@@ -300,7 +290,7 @@ describe('Pivot.vue', () => {
|
||||
attachTo: container
|
||||
})
|
||||
|
||||
const chartComponent = wrapper.vm.pivotOptions.rendererOptions.customChartComponent
|
||||
const chartComponent = wrapper.findComponent({ref: "customChart"}).vm
|
||||
sinon.stub(chartComponent, 'saveAsHtml')
|
||||
|
||||
await wrapper.vm.saveAsHtml()
|
||||
@@ -335,7 +325,7 @@ describe('Pivot.vue', () => {
|
||||
attachTo: container
|
||||
})
|
||||
|
||||
const chartComponent = wrapper.vm.pivotOptions.rendererOptions.customChartComponent
|
||||
const chartComponent = wrapper.findComponent({ref: "customChart"}).vm
|
||||
sinon.stub(chartComponent, 'saveAsPng')
|
||||
|
||||
await wrapper.vm.saveAsPng()
|
||||
|
||||
@@ -4,18 +4,23 @@ import PivotSortBtn from '@/views/Main/Workspace/Tabs/Tab/DataView/Pivot/PivotUi
|
||||
|
||||
describe('PivotSortBtn.vue', () => {
|
||||
it('switches order', async () => {
|
||||
const wrapper = shallowMount(PivotSortBtn, { props: { value: 'key_a_to_z' } })
|
||||
const wrapper = shallowMount(PivotSortBtn, {
|
||||
props: {
|
||||
modelValue: 'key_a_to_z',
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
}
|
||||
})
|
||||
|
||||
expect(wrapper.vm.value).to.equal('key_a_to_z')
|
||||
expect(wrapper.props('modelValue')).to.equal('key_a_to_z')
|
||||
await wrapper.find('.pivot-sort-btn').trigger('click')
|
||||
expect(wrapper.emitted('input')[0]).to.eql(['value_a_to_z'])
|
||||
expect(wrapper.props('modelValue')).to.equal('value_a_to_z')
|
||||
|
||||
await wrapper.setProps({ value: 'value_a_to_z' })
|
||||
await wrapper.setValue('value_a_to_z')
|
||||
await wrapper.find('.pivot-sort-btn').trigger('click')
|
||||
expect(wrapper.emitted('input')[1]).to.eql(['value_z_to_a'])
|
||||
expect(wrapper.props('modelValue')).to.equal('value_z_to_a')
|
||||
|
||||
await wrapper.setProps({ value: 'value_z_to_a' })
|
||||
await wrapper.setValue('value_z_to_a')
|
||||
await wrapper.find('.pivot-sort-btn').trigger('click')
|
||||
expect(wrapper.emitted('input')[2]).to.eql(['key_a_to_z'])
|
||||
expect(wrapper.props('modelValue')).to.equal('key_a_to_z')
|
||||
})
|
||||
})
|
||||
|
||||
@@ -6,7 +6,8 @@ describe('PivotUi.vue', () => {
|
||||
it('returns value when settings changed', async () => {
|
||||
const wrapper = mount(PivotUi, {
|
||||
props: {
|
||||
keyNames: ['foo', 'bar']
|
||||
keyNames: ['foo', 'bar'],
|
||||
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e })
|
||||
}
|
||||
})
|
||||
|
||||
@@ -15,68 +16,74 @@ describe('PivotUi.vue', () => {
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(1)
|
||||
expect(wrapper.emitted().input[0][0].rows).to.eql([])
|
||||
expect(wrapper.emitted().input[0][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[0][0].colOrder).to.equal('key_a_to_z')
|
||||
expect(wrapper.emitted().input[0][0].rowOrder).to.equal('key_a_to_z')
|
||||
expect(wrapper.emitted().input[0][0].aggregatorName).to.equal('Count')
|
||||
expect(wrapper.emitted().input[0][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[0][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[0][0].vals).to.eql([])
|
||||
|
||||
let value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql([])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('key_a_to_z')
|
||||
expect(value.rowOrder).to.equal('key_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Count')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql([])
|
||||
|
||||
// choose rows
|
||||
await wrapper.findAll('.sqliteviz-select.rows .multiselect__element > span')[0]
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(2)
|
||||
expect(wrapper.emitted().input[1][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[1][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[1][0].colOrder).to.equal('key_a_to_z')
|
||||
expect(wrapper.emitted().input[1][0].rowOrder).to.equal('key_a_to_z')
|
||||
expect(wrapper.emitted().input[1][0].aggregatorName).to.equal('Count')
|
||||
expect(wrapper.emitted().input[1][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[1][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[1][0].vals).to.eql([])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('key_a_to_z')
|
||||
expect(value.rowOrder).to.equal('key_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Count')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql([])
|
||||
|
||||
// change column order
|
||||
await wrapper.find('.pivot-sort-btn.col').trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(3)
|
||||
expect(wrapper.emitted().input[2][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[2][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[2][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[2][0].rowOrder).to.equal('key_a_to_z')
|
||||
expect(wrapper.emitted().input[2][0].aggregatorName).to.equal('Count')
|
||||
expect(wrapper.emitted().input[2][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[2][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[2][0].vals).to.eql([])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('key_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Count')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql([])
|
||||
|
||||
// change row order
|
||||
await wrapper.find('.pivot-sort-btn.row').trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(4)
|
||||
expect(wrapper.emitted().input[3][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[3][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[3][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[3][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[3][0].aggregatorName).to.equal('Count')
|
||||
expect(wrapper.emitted().input[3][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[3][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[3][0].vals).to.eql([])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Count')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql([])
|
||||
|
||||
// change aggregator
|
||||
await wrapper.findAll('.sqliteviz-select.aggregator .multiselect__element > span')[12]
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(5)
|
||||
expect(wrapper.emitted().input[4][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[4][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[4][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[4][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[4][0].aggregatorName).to.equal('Sum over Sum')
|
||||
expect(wrapper.emitted().input[4][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[4][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[4][0].vals).to.eql(['', ''])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Sum over Sum')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql(['', ''])
|
||||
|
||||
// set first aggregator argument
|
||||
await wrapper
|
||||
@@ -85,14 +92,15 @@ describe('PivotUi.vue', () => {
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(6)
|
||||
expect(wrapper.emitted().input[5][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[5][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[5][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[5][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[5][0].aggregatorName).to.equal('Sum over Sum')
|
||||
expect(wrapper.emitted().input[5][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[5][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[5][0].vals).to.eql(['foo', ''])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Sum over Sum')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql(['foo', ''])
|
||||
|
||||
// set second aggregator argument
|
||||
await wrapper
|
||||
@@ -101,43 +109,42 @@ describe('PivotUi.vue', () => {
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(7)
|
||||
expect(wrapper.emitted().input[6][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[6][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[6][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[6][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[6][0].aggregatorName).to.equal('Sum over Sum')
|
||||
expect(wrapper.emitted().input[6][0].rendererName).to.equal('Table')
|
||||
expect(wrapper.emitted().input[6][0].rendererOptions).to.equal(undefined)
|
||||
expect(wrapper.emitted().input[6][0].vals).to.eql(['foo', 'bar'])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Sum over Sum')
|
||||
expect(value.rendererName).to.equal('Table')
|
||||
expect(value.rendererOptions).to.equal(undefined)
|
||||
expect(value.vals).to.eql(['foo', 'bar'])
|
||||
|
||||
// change renderer
|
||||
await wrapper.findAll('.sqliteviz-select.renderer .multiselect__element > span')[13]
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(8)
|
||||
expect(wrapper.emitted().input[7][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[7][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[7][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[7][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[7][0].aggregatorName).to.equal('Sum over Sum')
|
||||
expect(wrapper.emitted().input[7][0].rendererName).to.equal('Custom chart')
|
||||
expect(wrapper.emitted().input[7][0].rendererOptions.customChartComponent)
|
||||
.to.not.equal(undefined)
|
||||
expect(wrapper.emitted().input[7][0].vals).to.eql(['foo', 'bar'])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Sum over Sum')
|
||||
expect(value.rendererName).to.equal('Custom chart')
|
||||
expect(value.vals).to.eql(['foo', 'bar'])
|
||||
|
||||
// change aggregator again
|
||||
await wrapper.findAll('.sqliteviz-select.aggregator .multiselect__element > span')[3]
|
||||
.trigger('click')
|
||||
|
||||
expect(wrapper.emitted().update.length).to.equal(9)
|
||||
expect(wrapper.emitted().input[8][0].rows).to.eql(['bar'])
|
||||
expect(wrapper.emitted().input[8][0].cols).to.eql(['foo'])
|
||||
expect(wrapper.emitted().input[8][0].colOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[8][0].rowOrder).to.equal('value_a_to_z')
|
||||
expect(wrapper.emitted().input[8][0].aggregatorName).to.equal('Sum')
|
||||
expect(wrapper.emitted().input[8][0].rendererName).to.equal('Custom chart')
|
||||
expect(wrapper.emitted().input[8][0].rendererOptions.customChartComponent)
|
||||
.to.not.equal(undefined)
|
||||
expect(wrapper.emitted().input[8][0].vals).to.eql(['foo'])
|
||||
value = wrapper.props('modelValue')
|
||||
expect(value.rows).to.eql(['bar'])
|
||||
expect(value.cols).to.eql(['foo'])
|
||||
expect(value.colOrder).to.equal('value_a_to_z')
|
||||
expect(value.rowOrder).to.equal('value_a_to_z')
|
||||
expect(value.aggregatorName).to.equal('Sum')
|
||||
expect(value.rendererName).to.equal('Custom chart')
|
||||
expect(value.vals).to.eql(['foo'])
|
||||
})
|
||||
})
|
||||
|
||||
@@ -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()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,44 +1,53 @@
|
||||
import { expect } from 'chai'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import SqlEditor from '@/views/Main/Workspace/Tabs/Tab/SqlEditor'
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
describe('SqlEditor.vue', () => {
|
||||
it('Emits input event when a query is changed', async () => {
|
||||
it('Emits update:modelValue event when a query is changed', async () => {
|
||||
// mock store state
|
||||
const state = {
|
||||
db: {}
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
|
||||
const wrapper = mount(SqlEditor, { store })
|
||||
await wrapper.findComponent({ name: 'codemirror' }).vm.$emit('input', 'SELECT * FROM foo')
|
||||
expect(wrapper.emitted('input')[0]).to.eql(['SELECT * FROM foo'])
|
||||
const wrapper = mount(SqlEditor, {
|
||||
global: {
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
await wrapper.findComponent({ ref: 'cm' }).setValue('SELECT * FROM foo', 'value')
|
||||
expect(wrapper.emitted()['update:modelValue'][0]).to.eql(['SELECT * FROM foo'])
|
||||
})
|
||||
|
||||
it('Run is disabled if there is no db or no query or is getting result set', async () => {
|
||||
const state = {
|
||||
db: null
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
|
||||
const wrapper = mount(SqlEditor, { store, props: { isGettingResults: false } })
|
||||
await wrapper.findComponent({ name: 'codemirror' }).vm.$emit('input', 'SELECT * FROM foo')
|
||||
const runButton = wrapper.findComponent({ name: 'RunIcon' }).vm.$parent
|
||||
const wrapper = mount(SqlEditor, {
|
||||
global: { plugins: [store] },
|
||||
props: { isGettingResults: false }
|
||||
})
|
||||
await wrapper.findComponent({ ref: 'cm' }).setValue('SELECT * FROM foo', 'value')
|
||||
const runButton = wrapper.findComponent({ ref: 'runBtn' })
|
||||
|
||||
expect(runButton.disabled).to.equal(true)
|
||||
expect(runButton.props('disabled')).to.equal(true)
|
||||
|
||||
await wrapper.vm.$set(store.state, 'db', {})
|
||||
expect(runButton.disabled).to.equal(false)
|
||||
store.state.db = {}
|
||||
await nextTick()
|
||||
expect(runButton.props('disabled')).to.equal(false)
|
||||
|
||||
await wrapper.findComponent({ name: 'codemirror' }).vm.$emit('input', '')
|
||||
expect(runButton.disabled).to.equal(true)
|
||||
await wrapper.findComponent({ ref: 'cm' }).setValue('', 'value')
|
||||
expect(runButton.props('disabled')).to.equal(true)
|
||||
|
||||
await wrapper.findComponent({ name: 'codemirror' }).vm.$emit('input', 'SELECT * FROM foo')
|
||||
expect(runButton.disabled).to.equal(false)
|
||||
await wrapper.findComponent({ ref: 'cm' }).setValue('SELECT * FROM foo', 'value')
|
||||
expect(runButton.props('disabled')).to.equal(false)
|
||||
|
||||
await wrapper.setProps({ isGettingResults: true })
|
||||
expect(runButton.disabled).to.equal(true)
|
||||
expect(runButton.props('disabled')).to.equal(true)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -1,11 +1,20 @@
|
||||
import { expect } from 'chai'
|
||||
import sinon from 'sinon'
|
||||
import { shallowMount, mount, DOMWrapper } from '@vue/test-utils'
|
||||
import { shallowMount, mount } from '@vue/test-utils'
|
||||
import mutations from '@/store/mutations'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import Tabs from '@/views/Main/Workspace/Tabs'
|
||||
import eventBus from '@/lib/eventBus'
|
||||
|
||||
|
||||
describe('Tabs.vue', () => {
|
||||
let clock
|
||||
|
||||
beforeEach(() => {
|
||||
clock = sinon.useFakeTimers()
|
||||
sinon.spy(eventBus, '$emit')
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
sinon.restore()
|
||||
})
|
||||
@@ -15,18 +24,19 @@ describe('Tabs.vue', () => {
|
||||
const state = {
|
||||
tabs: []
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Tabs, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
// check start-guide visibility
|
||||
expect(wrapper.find('#start-guide').isVisible()).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Renders tabs', () => {
|
||||
@@ -38,13 +48,14 @@ describe('Tabs.vue', () => {
|
||||
],
|
||||
currentTabId: 2
|
||||
}
|
||||
const store = new Vuex.Store({ state })
|
||||
const store = createStore({ state })
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Tabs, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -63,6 +74,7 @@ describe('Tabs.vue', () => {
|
||||
expect(secondTab.text()).to.include('Untitled')
|
||||
expect(secondTab.find('.star').isVisible()).to.equal(true)
|
||||
expect(secondTab.classes()).to.include('tab-selected')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Selects the tab on click', async () => {
|
||||
@@ -75,13 +87,13 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Tabs, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -94,6 +106,7 @@ describe('Tabs.vue', () => {
|
||||
const secondTab = wrapper.findAll('.tab')[1]
|
||||
expect(secondTab.classes()).to.not.include('tab-selected')
|
||||
expect(state.currentTabId).to.equal(1)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it("Deletes the tab on close if it's saved", async () => {
|
||||
@@ -131,13 +144,13 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = mount(Tabs, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -152,6 +165,7 @@ describe('Tabs.vue', () => {
|
||||
expect(firstTab.text()).to.include('Untitled')
|
||||
expect(firstTab.find('.star').isVisible()).to.equal(true)
|
||||
expect(firstTab.classes()).to.include('tab-selected')
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it("Doesn't delete tab on close if user cancel closing", async () => {
|
||||
@@ -189,13 +203,16 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = mount(Tabs, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: {
|
||||
'router-link': true, teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -204,13 +221,14 @@ describe('Tabs.vue', () => {
|
||||
await secondTabCloseIcon.trigger('click')
|
||||
|
||||
// check that Close Tab dialog is visible
|
||||
const modal = wrapper.find('[data-modal="close-warn"]')
|
||||
const modal = wrapper.find('.dialog.vfm')
|
||||
expect(modal.exists()).to.equal(true)
|
||||
expect(modal.find('.dialog-header').text()).to.contain('Close tab')
|
||||
|
||||
// find Cancel in the dialog
|
||||
const cancelBtn = wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.find(button => button.text() === 'Cancel')
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === "Don't close")
|
||||
|
||||
// click Cancel in the dialog
|
||||
await cancelBtn.trigger('click')
|
||||
@@ -219,7 +237,9 @@ describe('Tabs.vue', () => {
|
||||
expect(wrapper.findAllComponents({ name: 'Tab' })).to.have.lengthOf(2)
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="close-warn"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Closes without saving', async () => {
|
||||
@@ -257,13 +277,16 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = mount(Tabs, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: {
|
||||
'router-link': true, teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -273,7 +296,7 @@ describe('Tabs.vue', () => {
|
||||
|
||||
// find 'Close without saving' in the dialog
|
||||
const closeBtn = wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Close without saving')
|
||||
|
||||
// click 'Close without saving' in the dialog
|
||||
@@ -287,11 +310,12 @@ describe('Tabs.vue', () => {
|
||||
expect(firstTab.classes()).to.include('tab-selected')
|
||||
|
||||
// check that 'saveInquiry' event was not emited
|
||||
const rootWrapper = new DOMWrapper(wrapper.vm.$root)
|
||||
expect(rootWrapper.emitted('saveInquiry')).to.equal(undefined)
|
||||
expect(eventBus.$emit.calledWith('saveInquiry')).to.equal(false)
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="close-warn"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Closes with saving', async () => {
|
||||
@@ -329,13 +353,16 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = mount(Tabs, {
|
||||
store,
|
||||
attachTo: document.body,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: {
|
||||
'router-link': true, teleport: true, transition: false
|
||||
},
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -345,14 +372,14 @@ describe('Tabs.vue', () => {
|
||||
|
||||
// find 'Save and close' in the dialog
|
||||
const closeBtn = wrapper
|
||||
.findAll('.dialog-buttons-container button').wrappers
|
||||
.findAll('.dialog-buttons-container button')
|
||||
.find(button => button.text() === 'Save and close')
|
||||
|
||||
// click 'Save and close' in the dialog
|
||||
await closeBtn.trigger('click')
|
||||
|
||||
// pretend like saving is completed - trigger 'inquirySaved' on $root
|
||||
await wrapper.vm.$root.$emit('inquirySaved')
|
||||
// pretend like saving is completed - trigger 'inquirySaved' on eventBus
|
||||
await eventBus.$emit('inquirySaved')
|
||||
|
||||
// check that tab is closed
|
||||
expect(wrapper.findAllComponents({ name: 'Tab' })).to.have.lengthOf(1)
|
||||
@@ -362,11 +389,12 @@ describe('Tabs.vue', () => {
|
||||
expect(firstTab.classes()).to.include('tab-selected')
|
||||
|
||||
// check that 'saveInquiry' event was emited
|
||||
const rootWrapper = new DOMWrapper(wrapper.vm.$root)
|
||||
expect(rootWrapper.emitted('saveInquiry')).to.have.lengthOf(1)
|
||||
expect(eventBus.$emit.calledWith('saveInquiry')).to.equal(true)
|
||||
|
||||
// check that the dialog is closed
|
||||
expect(wrapper.find('[data-modal="close-warn"]').exists()).to.equal(false)
|
||||
await clock.tick(100)
|
||||
expect(wrapper.find('.dialog.vfm').exists()).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('Prevents closing a tab of a browser if there is unsaved inquiry', () => {
|
||||
@@ -379,13 +407,13 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 2
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Tabs, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -394,6 +422,7 @@ describe('Tabs.vue', () => {
|
||||
wrapper.vm.leavingSqliteviz(event)
|
||||
|
||||
expect(event.preventDefault.calledOnce).to.equal(true)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it("Doesn't prevent closing a tab of a browser if there is unsaved inquiry", () => {
|
||||
@@ -405,13 +434,13 @@ describe('Tabs.vue', () => {
|
||||
currentTabId: 1
|
||||
}
|
||||
|
||||
const store = new Vuex.Store({ state, mutations })
|
||||
const store = createStore({ state, mutations })
|
||||
|
||||
// mount the component
|
||||
const wrapper = shallowMount(Tabs, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link']
|
||||
stubs: ['router-link'],
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -420,5 +449,6 @@ describe('Tabs.vue', () => {
|
||||
wrapper.vm.leavingSqliteviz(event)
|
||||
|
||||
expect(event.preventDefault.calledOnce).to.equal(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -2,7 +2,7 @@ import { expect } from 'chai'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import actions from '@/store/actions'
|
||||
import mutations from '@/store/mutations'
|
||||
import Vuex from 'vuex'
|
||||
import { createStore } from 'vuex'
|
||||
import Workspace from '@/views/Main/Workspace'
|
||||
|
||||
describe('Workspace.vue', () => {
|
||||
@@ -11,13 +11,13 @@ describe('Workspace.vue', () => {
|
||||
db: {},
|
||||
tabs: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, actions, mutations })
|
||||
const store = createStore({ state, actions, mutations })
|
||||
const $route = { path: '/workspace', query: {} }
|
||||
mount(Workspace, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link'],
|
||||
mocks: { $route }
|
||||
stubs: ['router-link', 'modal'],
|
||||
mocks: { $route },
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
@@ -34,13 +34,13 @@ describe('Workspace.vue', () => {
|
||||
db: {},
|
||||
tabs: []
|
||||
}
|
||||
const store = new Vuex.Store({ state, actions, mutations })
|
||||
const store = createStore({ state, actions, mutations })
|
||||
const $route = { path: '/workspace', query: { hide_schema: '1' } }
|
||||
const vm = mount(Workspace, {
|
||||
store,
|
||||
global: {
|
||||
stubs: ['router-link'],
|
||||
mocks: { $route }
|
||||
stubs: ['router-link', 'modal'],
|
||||
mocks: { $route },
|
||||
plugins: [store]
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@ import { viteStaticCopy } from 'vite-plugin-static-copy'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
base: '',
|
||||
base: './',
|
||||
plugins: [
|
||||
vue(),
|
||||
nodePolyfills({
|
||||
@@ -24,12 +24,12 @@ export default defineConfig({
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
},
|
||||
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
|
||||
},
|
||||
optimizeDeps: {
|
||||
include:['sql.js/dist/sql-wasm.js'],
|
||||
include:['sql.js'],
|
||||
esbuildOptions: {
|
||||
define: {
|
||||
global: 'globalThis'
|
||||
|
||||
@@ -3,6 +3,7 @@ const CopyPlugin = require('copy-webpack-plugin')
|
||||
const WorkboxPlugin = require('workbox-webpack-plugin')
|
||||
|
||||
module.exports = defineConfig({
|
||||
parallel: false,
|
||||
transpileDependencies: true,
|
||||
publicPath: '',
|
||||
// Workaround for https://github.com/vuejs/vue-cli/issues/5399 as described
|
||||
@@ -42,13 +43,6 @@ module.exports = defineConfig({
|
||||
}
|
||||
})
|
||||
|
||||
config.module
|
||||
.rule('worker')
|
||||
.test(/worker\.js$/)
|
||||
.use('worker-loader')
|
||||
.loader('worker-loader')
|
||||
.end()
|
||||
|
||||
config.module.rule('js').exclude.add(/worker\.js$/)
|
||||
|
||||
config
|
||||
|
||||
Reference in New Issue
Block a user