Pivot implementation and redesign (#69)

- Pivot support implementation 
- Rename queries into inquiries
- Rename editor into workspace
- Change result set format
- New JSON format for inquiries
- Redesign panels

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Chart.spec.js

@@ -0,0 +1,50 @@
+import { expect } from 'chai'
+import sinon from 'sinon'
+import { mount, shallowMount } from '@vue/test-utils'
+import Chart from '@/views/Main/Workspace/Tabs/Tab/DataView/Chart'
+import chartHelper from '@/views/Main/Workspace/Tabs/Tab/DataView/Chart/chartHelper'
+import * as dereference from 'react-chart-editor/lib/lib/dereference'
+
+describe('Chart.vue', () => {
+  afterEach(() => {
+    sinon.restore()
+  })
+
+  it('getOptionsForSave called with proper arguments', () => {
+    // mount the component
+    const wrapper = shallowMount(Chart)
+    const vm = wrapper.vm
+    const stub = sinon.stub(chartHelper, 'getOptionsForSave').returns('result')
+    const chartData = vm.getOptionsForSave()
+    expect(stub.calledOnceWith(vm.state, vm.dataSources)).to.equal(true)
+    expect(chartData).to.equal('result')
+  })
+
+  it('emits update when plotly updates', async () => {
+    // mount the component
+    const wrapper = mount(Chart)
+    wrapper.findComponent({ ref: 'plotlyEditor' }).vm.$emit('onUpdate')
+    expect(wrapper.emitted('update')).to.have.lengthOf(1)
+  })
+
+  it('calls dereference when sqlResult is changed', async () => {
+    sinon.stub(dereference, 'default')
+    const dataSources = {
+      id: [1],
+      name: ['foo']
+    }
+
+    // mount the component
+    const wrapper = shallowMount(Chart, {
+      propsData: { dataSources }
+    })
+
+    const newDataSources = {
+      id: [2],
+      name: ['bar']
+    }
+
+    await wrapper.setProps({ dataSources: newDataSources })
+    expect(dereference.default.called).to.equal(true)
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/DataView.spec.js

@@ -0,0 +1,32 @@
+import { expect } from 'chai'
+import { mount, createWrapper } from '@vue/test-utils'
+import DataView from '@/views/Main/Workspace/Tabs/Tab/DataView'
+import sinon from 'sinon'
+
+describe('DataView.vue', () => {
+  it('emits update on mode changing', async () => {
+    const wrapper = mount(DataView)
+
+    const pivotBtn = createWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
+    await pivotBtn.trigger('click')
+
+    expect(wrapper.emitted('update')).to.have.lengthOf(1)
+  })
+
+  it('method getOptionsForSave call the same method of the current view component', async () => {
+    const wrapper = mount(DataView)
+
+    const chart = wrapper.findComponent({ name: 'Chart' }).vm
+    sinon.stub(chart, 'getOptionsForSave').returns({ here_are: 'chart_settings' })
+
+    expect(wrapper.vm.getOptionsForSave()).to.eql({ here_are: 'chart_settings' })
+
+    const pivotBtn = createWrapper(wrapper.findComponent({ name: 'pivotIcon' }).vm.$parent)
+    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' })
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Pivot/Pivot.spec.js

@@ -0,0 +1,214 @@
+import { expect } from 'chai'
+import { mount } from '@vue/test-utils'
+import Pivot from '@/views/Main/Workspace/Tabs/Tab/DataView/Pivot'
+import $ from 'jquery'
+
+describe('Pivot.vue', () => {
+  it('renders pivot table', () => {
+    const wrapper = mount(Pivot, {
+      propsData: {
+        dataSources: {
+          item: ['foo', 'bar', 'bar', 'bar'],
+          year: [2021, 2021, 2020, 2020]
+        },
+        initOptions: {
+          rows: ['item'],
+          cols: ['year'],
+          colOrder: 'key_a_to_z',
+          rowOrder: 'key_a_to_z',
+          aggregatorName: 'Count',
+          vals: [],
+          rendererName: 'Table'
+        }
+      }
+    })
+    const colLabels = wrapper.findAll('.pivot-output thead th.pvtColLabel')
+    expect(colLabels.at(0).text()).to.equal('2020')
+    expect(colLabels.at(1).text()).to.equal('2021')
+    const rows = wrapper.findAll('.pivot-output tbody tr')
+    // row0: bar - 2 - 1
+    expect(rows.at(0).find('th').text()).to.equal('bar')
+    expect(rows.at(0).find('td.col0').text()).to.equal('2')
+    expect(rows.at(0).find('td.col1').text()).to.equal('1')
+    expect(rows.at(0).find('td.rowTotal').text()).to.equal('3')
+
+    // row1: foo -  - 2
+    expect(rows.at(1).find('th').text()).to.equal('foo')
+    expect(rows.at(1).find('td.col0').text()).to.equal('')
+    expect(rows.at(1).find('td.col1').text()).to.equal('1')
+    expect(rows.at(1).find('td.rowTotal').text()).to.equal('1')
+  })
+
+  it('updates when dataSource changes', async () => {
+    const wrapper = mount(Pivot, {
+      propsData: {
+        dataSources: {
+          item: ['foo', 'bar', 'bar', 'bar'],
+          year: [2021, 2021, 2020, 2020]
+        },
+        initOptions: {
+          rows: ['item'],
+          cols: ['year'],
+          colOrder: 'key_a_to_z',
+          rowOrder: 'key_a_to_z',
+          aggregatorName: 'Count',
+          vals: [],
+          rendererName: 'Table'
+        }
+      }
+    })
+
+    await wrapper.setProps({
+      dataSources: {
+        item: ['foo', 'bar', 'bar', 'bar', 'foo', 'baz'],
+        year: [2021, 2021, 2020, 2020, 2021, 2020]
+      }
+    })
+
+    const colLabels = wrapper.findAll('.pivot-output thead th.pvtColLabel')
+    expect(colLabels.at(0).text()).to.equal('2020')
+    expect(colLabels.at(1).text()).to.equal('2021')
+    const rows = wrapper.findAll('.pivot-output tbody tr')
+    // row0: bar - 2 - 1
+    expect(rows.at(0).find('th').text()).to.equal('bar')
+    expect(rows.at(0).find('td.col0').text()).to.equal('2')
+    expect(rows.at(0).find('td.col1').text()).to.equal('1')
+    expect(rows.at(0).find('td.rowTotal').text()).to.equal('3')
+
+    // row1: baz - 1 -
+    expect(rows.at(1).find('th').text()).to.equal('baz')
+    expect(rows.at(1).find('td.col0').text()).to.equal('1')
+    expect(rows.at(1).find('td.col1').text()).to.equal('')
+    expect(rows.at(1).find('td.rowTotal').text()).to.equal('1')
+
+    // row2: foo -  - 2
+    expect(rows.at(2).find('th').text()).to.equal('foo')
+    expect(rows.at(2).find('td.col0').text()).to.equal('')
+    expect(rows.at(2).find('td.col1').text()).to.equal('2')
+    expect(rows.at(2).find('td.rowTotal').text()).to.equal('2')
+  })
+
+  it('updates when pivot settings changes', async () => {
+    const wrapper = mount(Pivot, {
+      propsData: {
+        dataSources: {
+          item: ['foo', 'bar', 'bar', 'bar'],
+          year: [2021, 2021, 2020, 2020]
+        },
+        initOptions: {
+          rows: ['item'],
+          cols: ['year'],
+          colOrder: 'key_a_to_z',
+          rowOrder: 'key_a_to_z',
+          aggregatorName: 'Count',
+          vals: [],
+          rendererName: 'Table'
+        }
+      }
+    })
+
+    await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
+      rows: ['year'],
+      cols: ['item'],
+      colOrder: 'key_a_to_z',
+      rowOrder: 'key_a_to_z',
+      aggregator: $.pivotUtilities.aggregators.Count(),
+      aggregatorName: 'Count',
+      renderer: $.pivotUtilities.renderers.Table,
+      rendererName: 'Table',
+      rendererOptions: undefined,
+      vals: []
+    })
+
+    const colLabels = wrapper.findAll('.pivot-output thead th.pvtColLabel')
+    expect(colLabels.at(0).text()).to.equal('bar')
+    expect(colLabels.at(1).text()).to.equal('foo')
+    const rows = wrapper.findAll('.pivot-output tbody tr')
+    // row0: 2020 - 2 -
+    expect(rows.at(0).find('th').text()).to.equal('2020')
+    expect(rows.at(0).find('td.col0').text()).to.equal('2')
+    expect(rows.at(0).find('td.col1').text()).to.equal('')
+    expect(rows.at(0).find('td.rowTotal').text()).to.equal('2')
+
+    // row1: 2021 - 1 - 1
+    expect(rows.at(1).find('th').text()).to.equal('2021')
+    expect(rows.at(1).find('td.col0').text()).to.equal('1')
+    expect(rows.at(1).find('td.col1').text()).to.equal('1')
+    expect(rows.at(1).find('td.rowTotal').text()).to.equal('2')
+  })
+
+  it('returns options for save', async () => {
+    const wrapper = mount(Pivot, {
+      propsData: {
+        dataSources: {
+          item: ['foo', 'bar', 'bar', 'bar'],
+          year: [2021, 2021, 2020, 2020]
+        },
+        initOptions: {
+          rows: ['item'],
+          cols: ['year'],
+          colOrder: 'key_a_to_z',
+          rowOrder: 'key_a_to_z',
+          aggregatorName: 'Count',
+          vals: [],
+          rendererName: 'Table'
+        }
+      }
+    })
+
+    await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
+      rows: ['year'],
+      cols: ['item'],
+      colOrder: 'value_a_to_z',
+      rowOrder: 'value_z_to_a',
+      aggregator: $.pivotUtilities.aggregators.Count(),
+      aggregatorName: 'Count',
+      renderer: $.pivotUtilities.renderers.Table,
+      rendererName: 'Table',
+      rendererOptions: undefined,
+      vals: []
+    })
+
+    let optionsForSave = wrapper.vm.getOptionsForSave()
+
+    expect(optionsForSave.rows).to.eql(['year'])
+    expect(optionsForSave.cols).to.eql(['item'])
+    expect(optionsForSave.colOrder).to.equal('value_a_to_z')
+    expect(optionsForSave.rowOrder).to.equal('value_z_to_a')
+    expect(optionsForSave.aggregatorName).to.equal('Count')
+    expect(optionsForSave.rendererName).to.equal('Table')
+    expect(optionsForSave.rendererOptions).to.equal(undefined)
+    expect(optionsForSave.vals).to.eql([])
+
+    await wrapper.findComponent({ name: 'pivotUi' }).vm.$emit('input', {
+      rows: ['item'],
+      cols: ['year'],
+      colOrder: 'value_a_to_z',
+      rowOrder: 'value_z_to_a',
+      aggregator: $.pivotUtilities.aggregators.Count(),
+      aggregatorName: 'Count',
+      renderer: $.pivotUtilities.renderers['Custom chart'],
+      rendererName: 'Custom chart',
+      rendererOptions: {
+        customChartComponent: {
+          getOptionsForSave () {
+            return { here_are: 'custom chart settings' }
+          }
+        }
+      },
+      vals: []
+    })
+
+    optionsForSave = wrapper.vm.getOptionsForSave()
+    expect(optionsForSave.rows).to.eql(['item'])
+    expect(optionsForSave.cols).to.eql(['year'])
+    expect(optionsForSave.colOrder).to.equal('value_a_to_z')
+    expect(optionsForSave.rowOrder).to.equal('value_z_to_a')
+    expect(optionsForSave.aggregatorName).to.equal('Count')
+    expect(optionsForSave.rendererName).to.equal('Custom chart')
+    expect(optionsForSave.rendererOptions).to.eql({
+      customChartOptions: { here_are: 'custom chart settings' }
+    })
+    expect(optionsForSave.vals).to.eql([])
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Pivot/PivotUi/PivotSortBtn.spec.js

@@ -0,0 +1,21 @@
+import { expect } from 'chai'
+import { shallowMount } from '@vue/test-utils'
+import PivotSortBtn from '@/views/Main/Workspace/Tabs/Tab/DataView/Pivot/PivotUi/PivotSortBtn'
+
+describe('PivotSortBtn.vue', () => {
+  it('switches order', async () => {
+    const wrapper = shallowMount(PivotSortBtn, { propsData: { value: 'key_a_to_z' } })
+
+    expect(wrapper.vm.value).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'])
+
+    await wrapper.setProps({ value: 'value_a_to_z' })
+    await wrapper.find('.pivot-sort-btn').trigger('click')
+    expect(wrapper.emitted('input')[1]).to.eql(['value_z_to_a'])
+
+    await wrapper.setProps({ value: 'value_z_to_a' })
+    await wrapper.find('.pivot-sort-btn').trigger('click')
+    expect(wrapper.emitted('input')[2]).to.eql(['key_a_to_z'])
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Pivot/PivotUi/PivotUi.spec.js

@@ -0,0 +1,143 @@
+import { expect } from 'chai'
+import { mount } from '@vue/test-utils'
+import PivotUi from '@/views/Main/Workspace/Tabs/Tab/DataView/Pivot/PivotUi'
+
+describe('PivotUi.vue', () => {
+  it('returns value when settings changed', async () => {
+    const wrapper = mount(PivotUi, {
+      propsData: {
+        keyNames: ['foo', 'bar']
+      }
+    })
+
+    // choose columns
+    await wrapper.findAll('.sqliteviz-select.cols .multiselect__element > span').at(0)
+      .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([])
+
+    // choose rows
+    await wrapper.findAll('.sqliteviz-select.rows .multiselect__element > span').at(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([])
+
+    // 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([])
+
+    // 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([])
+
+    // change aggregator
+    await wrapper.findAll('.sqliteviz-select.aggregator .multiselect__element > span').at(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(['', ''])
+
+    // set first aggregator argument
+    await wrapper
+      .findAll('.sqliteviz-select.aggr-arg').at(0)
+      .findAll('.multiselect__element > span').at(0)
+      .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', ''])
+
+    // set second aggregator argument
+    await wrapper
+      .findAll('.sqliteviz-select.aggr-arg').at(1)
+      .findAll('.multiselect__element > span').at(1)
+      .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'])
+
+    // change renderer
+    await wrapper.findAll('.sqliteviz-select.renderer .multiselect__element > span').at(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'])
+
+    // change aggregator again
+    await wrapper.findAll('.sqliteviz-select.aggregator .multiselect__element > span').at(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'])
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Pivot/PivotUi/pivotHelper.spec.js

@@ -0,0 +1,56 @@
+import { expect } from 'chai'
+import { _getDataSources } from '@/views/Main/Workspace/Tabs/Tab/DataView/Pivot/PivotUi/pivotHelper'
+
+describe('pivotHelper.js', () => {
+  it('_getDataSources returns data sources', () => {
+    /*
+      +---+---+---------+---------+
+      |   | x |    5    |    10   |
+      |   +---+----+----+----+----+
+      |   | z |  2 |  3 |  1 |  6 |
+      +---+---+    |    |    |    |
+      | y |   |    |    |    |    |
+      +---+---+----+----+----+----+
+      |   3   |  5 |  6 |  4 |  9 |
+      +-------+----+----+----+----+
+      |   6   |  8 |  9 |  7 | 12 |
+      +-------+----+----+----+----+
+      |   9   | 11 | 12 | 10 | 15 |
+      +-------+----+----+----+----+
+    */
+    const pivotData = {
+      rowAttrs: ['y'],
+      colAttrs: ['x', 'z'],
+      getRowKeys () {
+        return [[3], [6], [9]]
+      },
+      getColKeys () {
+        return [
+          [5, 2],
+          [5, 3],
+          [10, 1],
+          [10, 6]
+        ]
+      },
+      getAggregator (row, col) {
+        return {
+          value () {
+            return +row + +col[1]
+          }
+        }
+      }
+    }
+
+    expect(_getDataSources(pivotData)).to.eql({
+      'Column keys': ['5-2', '5-3', '10-1', '10-6'],
+      'Row keys': ['3', '6', '9'],
+      'x-z:5-2': [5, 8, 11],
+      'x-z:5-3': [6, 9, 12],
+      'x-z:10-1': [4, 7, 10],
+      'x-z:10-6': [9, 12, 15],
+      'y:3': [5, 6, 4, 9],
+      'y:6': [8, 9, 7, 12],
+      'y:9': [11, 12, 10, 15]
+    })
+  })
+})

tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/chartHelper.spec.js

@@ -0,0 +1,56 @@
+import { expect } from 'chai'
+import sinon from 'sinon'
+import * as chartHelper from '@/views/Main/Workspace/Tabs/Tab/DataView/Chart/chartHelper'
+import * as dereference from 'react-chart-editor/lib/lib/dereference'
+
+describe('chartHelper.js', () => {
+  afterEach(() => {
+    sinon.restore()
+  })
+
+  it('getOptionsFromDataSources', () => {
+    const dataSources = {
+      id: [1, 2],
+      name: ['foo', 'bar']
+    }
+
+    const ds = chartHelper.getOptionsFromDataSources(dataSources)
+    expect(ds).to.eql([
+      { value: 'id', label: 'id' },
+      { value: 'name', label: 'name' }
+    ])
+  })
+
+  it('getOptionsForSave', () => {
+    const state = {
+      data: {
+        foo: {},
+        bar: {}
+      },
+      layout: {},
+      frames: {}
+    }
+    const dataSources = {
+      id: [1, 2],
+      name: ['foo', 'bar']
+    }
+    sinon.stub(dereference, 'default')
+    sinon.spy(JSON, 'parse')
+
+    const ds = chartHelper.getOptionsForSave(state, dataSources)
+
+    expect(dereference.default.calledOnce).to.equal(true)
+
+    const args = dereference.default.firstCall.args
+    expect(args[0]).to.eql({
+      foo: {},
+      bar: {}
+    })
+    expect(args[1]).to.eql({
+      id: [],
+      name: []
+    })
+
+    expect(ds).to.equal(JSON.parse.returnValues[0])
+  })
+})