Fix #49

ShinyChang · Jun 11, 2017 · 795f439 · 795f439
1 parent 4c8e42b
commit 795f439
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -41,6 +41,7 @@ var TextTruncate = require('react-text-truncate'); // CommonJS or UMD
     Please polyfill `requestAnimationFrame` before you called `<TextTruncated />`
 
 ## Changelog
+* 0.10.2 Fix truncated wrong when font property changed
 * 0.10.1 Fix unknown prop `element`
 * 0.10.0 Allow pass `element` to specify root element type
 * 0.9.3 Fix SSR window not found (removed raf polyfill)

diff --git a/lib/index.js b/lib/index.js
@@ -107,6 +107,9 @@
         }
         _this.rafId = window.requestAnimationFrame(_this.update.bind(_this));
       }, _this.update = function () {
+        var style = window.getComputedStyle(_this.scope);
+        var font = [style['font-weight'], style['font-style'], style['font-size'], style['font-family']].join(' ');
+        _this.canvas.font = font;
         _this.forceUpdate();
       }, _temp), _possibleConstructorReturn(_this, _ret);
     }

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-text-truncate",
-  "version": "0.10.1",
+  "version": "0.10.2",
   "description": "Truncate text for React.js",
   "main": "lib/index.js",
   "scripts": {

diff --git a/src/TextTruncate.js b/src/TextTruncate.js
@@ -51,6 +51,14 @@ export default class TextTruncate extends Component {
   };
 
   update = () => {
+    const style = window.getComputedStyle(this.scope);
+    const font = [
+      style['font-weight'],
+      style['font-style'],
+      style['font-size'],
+      style['font-family']
+    ].join(' ');
+    this.canvas.font = font;
     this.forceUpdate();
   };