@forter/chart - npm Package Compare versions

Comparing version 5.3.2 to 5.4.0

CHANGELOG.md

@@ -6,2 +6,14 @@ # Change Log
 
+# [5.4.0](https://github.com/forter/web-components/compare/@forter/chart@5.3.2...@forter/chart@5.4.0) (2021-08-31)
+
+
+### Features
+
+* **chart:** cd ([#749](https://github.com/forter/web-components/issues/749)) ([39bb57b](https://github.com/forter/web-components/commit/39bb57b))
+* **chart:** rerender chart only on config change ([#745](https://github.com/forter/web-components/issues/745)) ([5c5a2a1](https://github.com/forter/web-components/commit/5c5a2a1))
+
+
+
+
+
 ## [5.3.2](https://github.com/forter/web-components/compare/@forter/chart@5.3.1...@forter/chart@5.3.2) (2021-08-30)
@@ -8,0 +20,0 @@

FcChart.js

 import { defineProperty as _defineProperty } from './_virtual/_rollupPluginBabelHelpers.js';
 import { LitElement, html } from 'lit-element';
 import { Chart, registerables } from 'chart.js';
+import objectHash from 'object-hash';
 import annotationPlugin from 'chartjs-plugin-annotation';
@@ -57,2 +58,5 @@ import style from './fc-chart.css';
         value: 'line'
+      },
+      configHash: {
+        type: String
       }
@@ -68,2 +72,3 @@ };
     this.type = 'line';
+    this.configHash = null;
   }
@@ -81,8 +86,25 @@
 
+  hasConfigChanged(config) {
+    if (this.configHash) {
+      const newConfigHash = objectHash(config);
+
+      if (newConfigHash === this.configHash) {
+        return false;
+      }
+    }
+
+    this.configHash = objectHash(config);
+    return true;
+  }
+
   updated(_changedProperties) {
     super.updated(_changedProperties);
-    let {
+    const {
       config
     } = this;
-    config = config || {};
+
+    if (!this.hasConfigChanged(config)) {
+      return;
+    }
+
     let updatesSeries;
@@ -89,0 +111,0 @@

package.json

 {
   "name": "@forter/chart",
-  "version": "5.3.2",
+  "version": "5.4.0",
   "description": "chart from Forter Components",
@@ -56,5 +56,6 @@ "author": "Forter Developers",
     "chartjs-plugin-annotation": "1.0.2",
-    "lodash-es": "^4.17.21"
+    "lodash-es": "^4.17.21",
+    "object-hash": "2.2.0"
   },
-  "gitHead": "9d10efdc9bd6d025c839ab882f99b5d8de63c00b"
+  "gitHead": "c9228270ffdd6a4c16695d1dbc2671aef27318db"
 }

README.md

@@ -21,8 +21,9 @@ # fc-chart
 
-| Property         | Attribute  | Type      | Default |
-|------------------|------------|-----------|---------|
-| `config`         | `config`   | `{}`      | {}      |
-| `currentBuilder` |            | `any`     |         |
-| `disabled`       | `disabled` | `boolean` | false   |
-| `type`           | `type`     | `string`  | "line"  |
+| Property         | Attribute    | Type      | Default |
+|------------------|--------------|-----------|---------|
+| `config`         | `config`     | `{}`      | {}      |
+| `configHash`     | `configHash` | `string`  |         |
+| `currentBuilder` |              | `any`     |         |
+| `disabled`       | `disabled`   | `boolean` | false   |
+| `type`           | `type`       | `string`  | "line"  |
 
@@ -29,0 +30,0 @@ ## CSS Custom Properties

src/fc-chart.spec.js

@@ -12,2 +12,2 @@ import { assertWebComponentRender } from '@forter/test-helpers';
 
-describe(tagName, assertWebComponentRender(tagName, properties));
+describe(tagName, assertWebComponentRender(tagName, properties, { excludeProperties: ['configHash'] }));

src/FcChart.js

 import { LitElement, html } from 'lit-element';
 import { Chart, registerables } from 'chart.js';
+import objectHash from 'object-hash';
 import annotationPlugin from 'chartjs-plugin-annotation';
@@ -45,3 +46,4 @@ import style from './fc-chart.css';
       disabled: { type: Boolean, value: false },
-      type: { type: String, value: 'line' }
+      type: { type: String, value: 'line' },
+      configHash: { type: String }
     };
@@ -60,2 +62,3 @@ }
     this.type = 'line';
+    this.configHash = null;
   }
@@ -73,6 +76,19 @@
 
+  hasConfigChanged(config) {
+    if (this.configHash) {
+      const newConfigHash = objectHash(config);
+      if (newConfigHash === this.configHash) {
+        return false;
+      }
+    }
+    this.configHash = objectHash(config);
+    return true;
+  }
+
   updated(_changedProperties) {
     super.updated(_changedProperties);
-    let { config } = this;
-    config = config || {};
+    const { config } = this;
+    if (!this.hasConfigChanged(config)) {
+      return;
+    }
     let updatesSeries;
@@ -79,0 +95,0 @@ _changedProperties.forEach(value => {

web-components.json

@@ -20,2 +20,6 @@ {
           "type": "string"
+        },
+        {
+          "name": "configHash",
+          "type": "string"
         }
@@ -37,2 +41,6 @@ ],
         {
+          "name": "configHash",
+          "type": "string"
+        },
+        {
           "name": "currentBuilder",
@@ -39,0 +47,0 @@ "type": "any"

No alert changes

Improved metrics

Total package byte prevSize

95968

increased by2.49%

Lines of code

1842

increased by2.22%

Number of lines in readme file

34

increased by3.03%

Worsened metrics

Dependency count

6

increased by20%

Dependency changes

• + Addedobject-hash@2.2.0

• + Addedobject-hash@2.2.0(transitive)