mirror of
https://github.com/KevinMidboe/vue-chartjs.git
synced 2025-10-29 18:00:20 +00:00
Compare commits
26 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
3e77f40043 | ||
|
|
158f29d5c9 | ||
|
|
b1ca492b33 | ||
|
|
88cc75c614 | ||
|
|
cba152c7f8 | ||
|
|
b2f0a5ba03 | ||
|
|
b76236cf9b | ||
|
|
2a1377c01d | ||
|
|
c3f10a51f5 | ||
|
|
7ffefe4454 | ||
|
|
ca95e0f146 | ||
|
|
988d8f13b4 | ||
|
|
52c1c50206 | ||
|
|
482048b746 | ||
|
|
bb21a40506 | ||
|
|
e4ba9ea5a3 | ||
|
|
fee32b57df | ||
|
|
c0b854bd83 | ||
|
|
14413e438d | ||
|
|
7ddc385edb | ||
|
|
a62a108318 | ||
|
|
a1633c0d19 | ||
|
|
5ec1f31a4b | ||
|
|
ced81a58cc | ||
|
|
193b5cac33 | ||
|
|
dde366c154 |
29
CHANGELOG.md
29
CHANGELOG.md
@@ -1,8 +1,35 @@
|
||||
# Change Log
|
||||
|
||||
## [v2.3.1](https://github.com/apertureless/vue-chartjs/tree/v2.3.1) (2016-12-20)
|
||||
[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.3.0...v2.3.1)
|
||||
|
||||
**Fixed bugs:**
|
||||
|
||||
- Issues after using gulp-- production [\#19](https://github.com/apertureless/vue-chartjs/issues/19)
|
||||
|
||||
**Closed issues:**
|
||||
|
||||
- Error in rendering [\#21](https://github.com/apertureless/vue-chartjs/issues/21)
|
||||
|
||||
**Merged pull requests:**
|
||||
|
||||
- ✅ Add tests for chart instance destroying [\#24](https://github.com/apertureless/vue-chartjs/pull/24) ([apertureless](https://github.com/apertureless))
|
||||
- Feature/runtimebuild \#22 [\#23](https://github.com/apertureless/vue-chartjs/pull/23) ([apertureless](https://github.com/apertureless))
|
||||
|
||||
## [v2.3.0](https://github.com/apertureless/vue-chartjs/tree/v2.3.0) (2016-12-17)
|
||||
[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.2.1...v2.3.0)
|
||||
|
||||
**Closed issues:**
|
||||
|
||||
- Uncaught TypeError: \_c is not a function [\#20](https://github.com/apertureless/vue-chartjs/issues/20)
|
||||
|
||||
## [v2.2.1](https://github.com/apertureless/vue-chartjs/tree/v2.2.1) (2016-12-07)
|
||||
[Full Changelog](https://github.com/apertureless/vue-chartjs/compare/v2.2.0...v2.2.1)
|
||||
|
||||
**Fixed bugs:**
|
||||
|
||||
- Uncaught TypeError: Cannot read property 'draw' of null [\#15](https://github.com/apertureless/vue-chartjs/issues/15)
|
||||
|
||||
**Merged pull requests:**
|
||||
|
||||
- Update README.md [\#16](https://github.com/apertureless/vue-chartjs/pull/16) ([Ag47](https://github.com/Ag47))
|
||||
@@ -73,4 +100,4 @@
|
||||
## [1.0.2](https://github.com/apertureless/vue-chartjs/tree/1.0.2) (2016-07-27)
|
||||
|
||||
|
||||
\* *This Change Log was automatically generated by [github_changelog_generator](https://github.com/skywinder/Github-Changelog-Generator)*
|
||||
\* *This Change Log was automatically generated by [github_changelog_generator](https://github.com/skywinder/Github-Changelog-Generator)*
|
||||
@@ -1,8 +1,12 @@
|
||||
# Vue-ChartJs
|
||||
|
||||
[](https://badge.fury.io/js/vue-chartjs)  [](https://codecov.io/gh/apertureless/vue-chartjs) [](https://travis-ci.org/apertureless/vue-chartjs)
|
||||
[](https://badge.fury.io/js/vue-chartjs)  [](https://codecov.io/gh/apertureless/vue-chartjs) [](https://travis-ci.org/apertureless/vue-chartjs) [](http://packagequality.com/#?package=vue-chartjs) [](https://github.com/apertureless/vue-chartjs/blob/master/LICENSE.txt)
|
||||
|
||||
Is a vue.js wrapper for chart.js. You can easily create your chart components. [See in action](https://apertureless.github.io/vue-chartjs/)
|
||||
Is a vue.js wrapper for chart.js. You can easily create your chart components.
|
||||
|
||||
## Demo
|
||||
|
||||
[Demo](https://apertureless.github.io/vue-chartjs/)
|
||||
|
||||
### Compatibility
|
||||
|
||||
|
||||
@@ -16,7 +16,6 @@ module.exports = {
|
||||
extensions: ['', '.js', '.vue'],
|
||||
fallback: [path.join(__dirname, '../node_modules')],
|
||||
alias: {
|
||||
'vue': 'vue/dist/vue.common.js',
|
||||
'src': path.resolve(__dirname, '../src'),
|
||||
'mixins': path.resolve(__dirname, '../src/mixins'),
|
||||
'BaseCharts': path.resolve(__dirname, '../src/BaseCharts')
|
||||
|
||||
78
build/webpack.release.js
Normal file
78
build/webpack.release.js
Normal file
@@ -0,0 +1,78 @@
|
||||
var vue = require('vue-loader')
|
||||
var path = require('path')
|
||||
var webpack = require("webpack")
|
||||
var ExtractTextPlugin = require("extract-text-webpack-plugin")
|
||||
var projectRoot = path.resolve(__dirname, '../')
|
||||
var cssLoader = ExtractTextPlugin.extract('style-loader', 'css-loader')
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
'vue-chartjs': './src/index.js'
|
||||
},
|
||||
output: {
|
||||
filename: './dist/[name].js',
|
||||
library: 'VueChartJs',
|
||||
libraryTarget: 'umd'
|
||||
},
|
||||
module: {
|
||||
preLoaders: [
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'eslint',
|
||||
include: projectRoot,
|
||||
exclude: /node_modules/
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
loader: 'eslint',
|
||||
include: projectRoot,
|
||||
exclude: /node_modules/
|
||||
}
|
||||
],
|
||||
loaders: [
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue'
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
loader: 'babel'
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
loader: cssLoader
|
||||
},
|
||||
{
|
||||
test: /\.s[a|c]ss$/,
|
||||
loader: ExtractTextPlugin.extract('style-loader','css-loader!sass-loader')
|
||||
}
|
||||
]
|
||||
},
|
||||
eslint: {
|
||||
formatter: require('eslint-friendly-formatter')
|
||||
},
|
||||
babel: {
|
||||
presets: ['es2015'],
|
||||
plugins: ['transform-runtime']
|
||||
}
|
||||
}
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
|
||||
delete module.exports.devtool
|
||||
module.exports.plugins = [
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: '"production"'
|
||||
}
|
||||
}),
|
||||
new webpack.optimize.UglifyJsPlugin({
|
||||
compress: {
|
||||
warnings: false
|
||||
}
|
||||
}),
|
||||
new webpack.optimize.OccurenceOrderPlugin()
|
||||
// new ExtractTextPlugin('build.css')
|
||||
]
|
||||
}
|
||||
42391
dist/vue-chartjs.js
vendored
42391
dist/vue-chartjs.js
vendored
File diff suppressed because one or more lines are too long
2
dist/vue-chartjs.js.map
vendored
2
dist/vue-chartjs.js.map
vendored
File diff suppressed because one or more lines are too long
11
package.json
11
package.json
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "vue-chartjs",
|
||||
"version": "2.2.1",
|
||||
"description": "Vue wrapper for chart.js",
|
||||
"version": "2.3.3",
|
||||
"description": "vue.js wrapper for chart.js",
|
||||
"author": "Jakub Juszczak <jakub@nextindex.de>",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -22,12 +22,12 @@
|
||||
"e2e": "node test/e2e/runner.js",
|
||||
"test": "npm run unit",
|
||||
"lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs",
|
||||
"prepublish": "node build/build.js"
|
||||
"release": "webpack --progress --hide-modules --config ./build/webpack.release.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"babel-runtime": "^6.11.6",
|
||||
"chart.js": "^2.4.0",
|
||||
"vue": "^2.1.6"
|
||||
"vue": "^2.1.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.10.4",
|
||||
@@ -67,7 +67,7 @@
|
||||
"karma-sourcemap-loader": "^0.3.7",
|
||||
"karma-spec-reporter": "0.0.26",
|
||||
"karma-webpack": "^1.7.0",
|
||||
"lodash": "^4.16.3",
|
||||
"lodash": "^4.17.4",
|
||||
"lolex": "^1.4.0",
|
||||
"mocha": "^3.1.0",
|
||||
"nightwatch": "^0.9.8",
|
||||
@@ -82,6 +82,7 @@
|
||||
"vue-html-loader": "^1.2.3",
|
||||
"vue-loader": "^10.0.2",
|
||||
"vue-style-loader": "^1.0.0",
|
||||
"vue-template-compiler": "^2.1.10",
|
||||
"webpack": "^1.13.2",
|
||||
"webpack-dev-middleware": "^1.4.0",
|
||||
"webpack-hot-middleware": "^2.6.0",
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
@@ -51,7 +63,6 @@ export default Vue.extend({
|
||||
methods: {
|
||||
renderChart (data, options, type) {
|
||||
let chartOptions = mergeOptions(this.defaultOptions, options)
|
||||
|
||||
this._chart = new Chart(
|
||||
this.$refs.canvas.getContext('2d'), {
|
||||
type: type || 'bar',
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -3,11 +3,23 @@ import Chart from 'chart.js'
|
||||
import { mergeOptions } from '../helpers/options'
|
||||
|
||||
export default Vue.extend({
|
||||
template: `
|
||||
<div>
|
||||
<canvas :id="chartId" :width="width" :height="height" ref="canvas"></canvas>
|
||||
</div>
|
||||
`,
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
'div',
|
||||
[
|
||||
createElement(
|
||||
'canvas', {
|
||||
attrs: {
|
||||
id: this.chartId,
|
||||
width: this.width,
|
||||
height: this.height
|
||||
},
|
||||
ref: 'canvas'
|
||||
}
|
||||
)
|
||||
]
|
||||
)
|
||||
},
|
||||
|
||||
props: {
|
||||
chartId: {
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('BarChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<bar-chart></bar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BarChart
|
||||
)
|
||||
},
|
||||
components: { BarChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,39 @@ describe('BarChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<bar-chart chartId="barchartprop"></bar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BarChart, {
|
||||
props: {
|
||||
chartId: 'barchartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { BarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#barchartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BarChart
|
||||
)
|
||||
},
|
||||
components: { BarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('BubbleChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<bubble-chart></bubble-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BubbleChart
|
||||
)
|
||||
},
|
||||
components: { BubbleChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,39 @@ describe('BubbleChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<bubble-chart chartId="bubblechartprop"></bubble-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BubbleChart, {
|
||||
props: {
|
||||
chartId: 'bubblechartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { BubbleChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#bubblechartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
BubbleChart
|
||||
)
|
||||
},
|
||||
components: { BubbleChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('DoughnutChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<doughnut-chart></doughnut-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
DoughnutChart
|
||||
)
|
||||
},
|
||||
components: { DoughnutChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,39 @@ describe('DoughnutChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<doughnut-chart chartId="doughnutchartprop"></doughnut-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
DoughnutChart, {
|
||||
props: {
|
||||
chartId: 'doughnutchartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { DoughnutChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#doughnutchartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
DoughnutChart
|
||||
)
|
||||
},
|
||||
components: { DoughnutChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('LineChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<line-chart></line-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
LineChart
|
||||
)
|
||||
},
|
||||
components: { LineChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,39 @@ describe('LineChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<line-chart chartId="linechartprop"></line-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
LineChart, {
|
||||
props: {
|
||||
chartId: 'linechartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { LineChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#linechartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
LineChart
|
||||
)
|
||||
},
|
||||
components: { LineChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('PieChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<pie-chart></pie-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PieChart
|
||||
)
|
||||
},
|
||||
components: { PieChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,38 @@ describe('PieChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<pie-chart chartId="piechartprop"></pie-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PieChart, {
|
||||
props: {
|
||||
chartId: 'piechartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { PieChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#piechartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PieChart
|
||||
)
|
||||
},
|
||||
components: { PieChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('PolarChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<polar-chart></polar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PolarChart
|
||||
)
|
||||
},
|
||||
components: { PolarChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,39 @@ describe('PolarChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<polar-chart chartId="polarchartprop"></polar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PolarChart, {
|
||||
props: {
|
||||
chartId: 'polarchartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { PolarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#polarchartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
PolarChart
|
||||
)
|
||||
},
|
||||
components: { PolarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@@ -10,7 +10,11 @@ describe('RadarChart', () => {
|
||||
|
||||
it('should render a canvas', () => {
|
||||
const vm = new Vue({
|
||||
template: '<radar-chart></radar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
RadarChart
|
||||
)
|
||||
},
|
||||
components: { RadarChart }
|
||||
}).$mount(el)
|
||||
|
||||
@@ -22,10 +26,38 @@ describe('RadarChart', () => {
|
||||
|
||||
it('should change id based on prop', () => {
|
||||
const vm = new Vue({
|
||||
template: '<radar-chart chartId="rodarchartprop"></radar-chart>',
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
RadarChart, {
|
||||
props: {
|
||||
chartId: 'rodarchartprop'
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
components: { RadarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$el.querySelector('#rodarchartprop')).not.to.be.an('undefined')
|
||||
})
|
||||
it('should destroy chart instance', (done) => {
|
||||
const vm = new Vue({
|
||||
render: function (createElement) {
|
||||
return createElement(
|
||||
RadarChart
|
||||
)
|
||||
},
|
||||
components: { RadarChart }
|
||||
}).$mount(el)
|
||||
|
||||
expect(vm.$children[0]._chart.chart.ctx).not.to.be.null
|
||||
|
||||
vm.$destroy()
|
||||
|
||||
vm.$nextTick(() => {
|
||||
vm.$forceUpdate()
|
||||
expect(vm.$children[0]._chart.chart.ctx).to.be.null
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
25
yarn.lock
25
yarn.lock
@@ -1535,6 +1535,10 @@ dateformat@^1.0.6:
|
||||
get-stdin "^4.0.1"
|
||||
meow "^3.3.0"
|
||||
|
||||
de-indent@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
|
||||
|
||||
debug@0.7.4:
|
||||
version "0.7.4"
|
||||
resolved "https://registry.yarnpkg.com/debug/-/debug-0.7.4.tgz#06e1ea8082c2cb14e39806e22e2f6f757f92af39"
|
||||
@@ -2527,7 +2531,7 @@ hawk@~3.1.3:
|
||||
hoek "2.x.x"
|
||||
sntp "1.x.x"
|
||||
|
||||
he@1.1.x:
|
||||
he@1.1.x, he@^1.1.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/he/-/he-1.1.0.tgz#29319d49beec13a9b1f3c4f9b2a6dde4859bb2a7"
|
||||
|
||||
@@ -3378,10 +3382,14 @@ lodash@^3.8.0:
|
||||
version "3.10.1"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
|
||||
|
||||
lodash@^4.0.0, lodash@^4.0.1, lodash@^4.16.3, lodash@^4.16.4, lodash@^4.17.2, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0:
|
||||
lodash@^4.0.0, lodash@^4.0.1, lodash@^4.16.4, lodash@^4.17.2, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.5.0:
|
||||
version "4.17.2"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.2.tgz#34a3055babe04ce42467b607d700072c7ff6bf42"
|
||||
|
||||
lodash@^4.17.4:
|
||||
version "4.17.4"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
|
||||
|
||||
log-symbols@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-1.0.2.tgz#376ff7b58ea3086a0f09facc74617eca501e1a18"
|
||||
@@ -5501,13 +5509,20 @@ vue-style-loader@^1.0.0:
|
||||
dependencies:
|
||||
loader-utils "^0.2.7"
|
||||
|
||||
vue-template-compiler@^2.1.10:
|
||||
version "2.1.10"
|
||||
resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.1.10.tgz#cb89643adc395e97435585522e43d0a9b1913257"
|
||||
dependencies:
|
||||
de-indent "^1.0.2"
|
||||
he "^1.1.0"
|
||||
|
||||
vue-template-es2015-compiler@^1.2.2:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.4.0.tgz#7b88853ca4bf8d84ae54ab9e56771de271e60198"
|
||||
|
||||
vue@^2.1.6:
|
||||
version "2.1.6"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-2.1.6.tgz#2fc0024c07479ac6bc7d34a2cd5ef9ca5e90b143"
|
||||
vue@^2.1.10:
|
||||
version "2.1.10"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-2.1.10.tgz#c9235ca48c7925137be5807832ac4e3ac180427b"
|
||||
|
||||
watchpack@^0.2.1:
|
||||
version "0.2.9"
|
||||
|
||||
Reference in New Issue
Block a user