handle unicode characters

lib/tweets.js

@@ -1,9 +1,9 @@
 const { JSDOM } = require('jsdom');
-const { wrap } = require('./utils');
+const { wrap, getDisplaySize } = require('./utils');
 
 function renderRegularBox(content, width) {
   let box = content.reduce((agg, line) => {
-    agg += `| ${line.padEnd(width + 1, ' ')}|\n`;
+    agg += `| ${line}${' '.repeat((width - getDisplaySize(line)) + 1)}|\n`;
 
     return agg;
   }, `.${'-'.repeat(width + 2)}.\n`);
@@ -18,7 +18,7 @@ function renderContextBox(content, width) {
   let box = content.reduce((agg, line, index) => {
     const side = index === 0 ? " '-| " : '   | ';
 
-    agg += `${side}${line.padEnd(width + 1, ' ')}| \n`;
+    agg += `${side}${line}${' '.repeat((width - getDisplaySize(line)) + 1)}| \n`;
 
     return agg;
   }, ` | .${'-'.repeat(width + 2)}. \n`);

lib/utils.js

@@ -1,27 +1,38 @@
 const { execSync } = require('child_process');
+const wcwidth = require('wcwidth');
+
+function getDisplaySize(text) {
+  return text
+    .split('')
+    .reduce((count, char) => count + wcwidth(char), 0);
+}
 
 function wrap(text, maxLineLength) {
   const { length } = text;
 
-  if (length < maxLineLength) {
-    return text;
-  }
-
   let i = 0;
   let offset = 0;
   let lineLength = 0;
-  let lastSpace;
+  let lastSpace = 0;
   const output = [];
+  const sizeMap = [];
 
   while (i < length) {
+    sizeMap[i] = wcwidth(text[i]);
+
     if (text[i - 1] === ' ') {
       lastSpace = i;
     }
 
     if (text[i] === '\n') {
       lineLength = 0;
     } else if (lineLength >= maxLineLength) {
-      if (i - lastSpace < maxLineLength) {
+      let chunkSize = 0;
+      for (let k = lastSpace; k <= i; k++) {
+        chunkSize += sizeMap[k];
+      }
+
+      if (chunkSize < maxLineLength) {
         i = lastSpace;
       }
 
@@ -32,8 +43,8 @@ function wrap(text, maxLineLength) {
 
     output[i + offset] = text[i];
 
+    lineLength += sizeMap[i] > 0 ? sizeMap[i] : 1;
     ++i;
-    ++lineLength;
   }
 
   return output.join('').split('\n');
@@ -45,7 +56,7 @@ function colorize(code, string) {
 
 function center(width, text) {
   const padding =
-    ' '.repeat(Math.floor(width / 2) - Math.ceil(text.length / 2));
+    ' '.repeat(Math.floor(width / 2) - Math.ceil(getDisplaySize(text) / 2));
 
   return padding + text + padding;
 }
@@ -63,4 +74,5 @@ module.exports = {
   colorize,
   center,
   fetchFromTwitter,
+  getDisplaySize,
 };

package.json

@@ -13,7 +13,8 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "jsdom": "^11.5.1"
+    "jsdom": "^11.5.1",
+    "wcwidth": "^1.0.1"
   },
   "devDependencies": {
     "eslint": "^4.14.0",