jsdom · Mar 5, 2019 · Mar 5, 2019
Showing with 30 additions and 3 deletions.

+17 −3 lib/jsdom/living/nodes/HTMLElement-impl.js

+1 −0 package.json

+12 −0 yarn.lock
diff --git a/lib/jsdom/living/nodes/HTMLElement-impl.js b/lib/jsdom/living/nodes/HTMLElement-impl.js
@@ -8,6 +8,7 @@ const HTMLAndSVGElementSharedImpl = require("./HTMLAndSVGElementShared-impl").im
 const { firstChildWithLocalName } = require("../helpers/traversal");
 const { isDisabled } = require("../helpers/form-controls");
 const { fireAnEvent } = require("../helpers/events");
+const pixelWidth = require('string-pixel-width');
 
 class HTMLElementImpl extends ElementImpl {
   constructor(args, privateData) {
@@ -31,6 +32,19 @@ class HTMLElementImpl extends ElementImpl {
     }
   }
 
+  _measureText() {
+    const font = this._style.getPropertyValue("font").split(" ");
+    let fontSize = parseInt(font[1]);
+    fontSize = isNaN(fontSize) ? 10 : fontSize;
+    const text = this.textContent;
+
+    if(text && text.length > 0) {
+      return { width: pixelWidth(text, { font: font[0], size: fontSize}), height: fontSize + 4 };
+    }
+
+    return { width: 0, height: fontSize };
+  }
+
   click() {
     // https://html.spec.whatwg.org/multipage/interaction.html#dom-click
     // https://html.spec.whatwg.org/multipage/interaction.html#run-synthetic-click-activation-steps
@@ -109,19 +123,19 @@ class HTMLElementImpl extends ElementImpl {
   }
 
   get offsetTop() {
-    return 0;
+    return this._measureText().height;
   }
 
   get offsetLeft() {
     return 0;
   }
 
   get offsetWidth() {
-    return 0;
+    return this._measureText().width;
   }
 
   get offsetHeight() {
-    return 0;
+    return this._measureText().height;
   }
 }
 

diff --git a/package.json b/package.json
@@ -35,6 +35,7 @@
     "request": "^2.88.0",
     "request-promise-native": "^1.0.5",
     "saxes": "^3.1.5",
+    "string-pixel-width": "^1.9.0",
     "symbol-tree": "^3.2.2",
     "tough-cookie": "^2.5.0",
     "w3c-hr-time": "^1.0.1",

diff --git a/yarn.lock b/yarn.lock
@@ -2864,6 +2864,11 @@ lodash.create@3.1.1:
     lodash._basecreate "^3.0.0"
     lodash._isiterateecall "^3.0.0"
 
+lodash.deburr@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/lodash.deburr/-/lodash.deburr-4.1.0.tgz#ddb1bbb3ef07458c0177ba07de14422cb033ff9b"
+  integrity sha1-3bG7s+8HRYwBd7oH3hRCLLAz/5s=
+
 lodash.isarguments@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
@@ -4395,6 +4400,13 @@ stream-splicer@^2.0.0:
     inherits "^2.0.1"
     readable-stream "^2.0.2"
 
+string-pixel-width@^1.9.0:
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/string-pixel-width/-/string-pixel-width-1.9.0.tgz#c913e482f2ca8c35bd21a59770ef1afcd911152f"
+  integrity sha512-PIT/uoWm50av0DtWXsNz7de4Our1xvMxZHiMi2CAK06dN8QJizdKlIOwSdhcRxVK30UvC3COv4/Dv5p9+oiwfA==
+  dependencies:
+    lodash.deburr "^4.1.0"
+
 string-width@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3"