1 files changed, 25 insertions, 0 deletions
diff --git a/app/assets/javascripts/lib/utils/css_utils.js b/app/assets/javascripts/lib/utils/css_utils.js
index e4f68dd1b6c..87cc69bad61 100644
--- a/app/assets/javascripts/lib/utils/css_utils.js
+++ b/app/assets/javascripts/lib/utils/css_utils.js
@@ -23,3 +23,28 @@ export function loadCSSFile(path) {
 export function getCssVariable(variable) {
   return getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
 }
+
+/**
+ * Return the measured width and height of a temporary element with the given
+ * CSS classes.
+ *
+ * Multiple classes can be given by separating them with spaces.
+ *
+ * Since this forces a layout calculation, do not call this frequently or in
+ * loops.
+ *
+ * Finally, this assumes the styles for the given classes are loaded.
+ *
+ * @param {string} className CSS class(es) to apply to a temporary element and
+ *     measure.
+ * @returns {{ width: number, height: number }} Measured width and height in
+ *     CSS pixels.
+ */
+export function getCssClassDimensions(className) {
+  const el = document.createElement('div');
+  el.className = className;
+  document.body.appendChild(el);
+  const { width, height } = el.getBoundingClientRect();
+  el.remove();
+  return { width, height };
+}