DOM Element Width before Appended to DOM

Question

I\'m sure the answer is no, but is it possible to determine the width of an element before it is appended to the DOM?

Once it\'s appended, I know I

Answer 1

/**
 * Get bounding client rect for an element (not exists at current DOM tree)
 * @param {!HTMLElement} el
 * @return {!Promise}
 */
function getElementRect(el) {
  return new Promise(resolve => {
    const element = el.cloneNode(true);
    element.style.visibility = "hidden";
    element.style.position = "absolute";
    document.body.appendChild(element);

    resolve(element.getBoundingClientRect());
    element.remove();
  });
}

const div = /** @type {!HTMLElement} */ (document.createElement("div"));
div.innerHTML = "
Hello

";

// Execute
(async () => {
  const rect = await getElementRect(div);
  console.log(rect.width);
})();

DEMO