diff --git a/src/views/Main/Workspace/Tabs/Tab/DataView/Chart/index.vue b/src/views/Main/Workspace/Tabs/Tab/DataView/Chart/index.vue
index 4f14893..fafc830 100644
--- a/src/views/Main/Workspace/Tabs/Tab/DataView/Chart/index.vue
+++ b/src/views/Main/Workspace/Tabs/Tab/DataView/Chart/index.vue
@@ -66,7 +66,9 @@ export default {
     dataSources () {
       // we need to update state.data in order to update the graph
       // https://github.com/plotly/react-chart-editor/issues/948
-      dereference(this.state.data, this.dataSources)
+      if (this.dataSources) {
+        dereference(this.state.data, this.dataSources)
+      }
     }
   },
   methods: {
diff --git a/tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Chart.spec.js b/tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Chart.spec.js
index 48f9aac..6ae5ecd 100644
--- a/tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Chart.spec.js
+++ b/tests/views/Main/Workspace/Tabs/Tab/DataView/Chart/Chart.spec.js
@@ -27,7 +27,7 @@ describe('Chart.vue', () => {
     expect(wrapper.emitted('update')).to.have.lengthOf(1)
   })
 
-  it('calls dereference when sqlResult is changed', async () => {
+  it('calls dereference when dataSources is changed', async () => {
     sinon.stub(dereference, 'default')
     const dataSources = {
       id: [1],
@@ -47,4 +47,20 @@ describe('Chart.vue', () => {
     await wrapper.setProps({ dataSources: newDataSources })
     expect(dereference.default.called).to.equal(true)
   })
+
+  it(`doesn't calls dereference when dataSources is null`, async () => {
+    sinon.stub(dereference, 'default')
+    const dataSources = {
+      id: [1],
+      name: ['foo']
+    }
+
+    // mount the component
+    const wrapper = shallowMount(Chart, {
+      propsData: { dataSources }
+    })
+
+    await wrapper.setProps({ dataSources: null })
+    expect(dereference.default.called).to.equal(false)
+  })
 })