feat: check if text is ellipsised before attaching tooltip

src/directives/vTooltip.ts

@@ -46,8 +46,21 @@ function hideTooltip() {
   tooltip.style.visibility = "hidden";
 }
 
-export default {
+function getFullWidth(el: HTMLElement) {
-  mounted(el: HTMLElement, binding) {
+  // display el as inline-block to get the correct width
+  el.style.display = "inline-block";
+  el.style.visibility = "hidden";
+  document.getElementsByTagName("body")[0].appendChild(el);
+  const width = el.offsetWidth;
+  el.remove();
+
+  return width;
+}
+
+export default (el: HTMLElement) => {
+  const fullWidth = getFullWidth(el.cloneNode(true) as HTMLElement);
+  if (fullWidth <= el.offsetWidth) return;
+
   if (!tooltip) {
     tooltip = getTooltip();
   }
@@ -76,11 +89,13 @@ export default {
       hideTooltip();
     });
   });
-  },
+};
-  beforeUnmount(el: HTMLElement) {
-    hideTooltip();
 
-    el.removeEventListener("mouseover", () => {});
+// } as Directive;
-    el.removeEventListener("mouseout", () => {});
+
-  },
+// beforeUnmount(el: HTMLElement) {
-} as Directive;
+//   // hideTooltip();
+
+//   el.removeEventListener("mouseover", () => {});
+//   el.removeEventListener("mouseout", () => {});
+// },