perf: defer computing styles until opened (#9485) (#9487)

Co-authored-by: Sascha Ißbrücker <sissbruecker@vaadin.com>

Author: vaadin-bot

packages/popover/src/vaadin-popover-overlay-mixin.js

@@ -57,21 +57,6 @@ export const PopoverOverlayMixin = (superClass) =>
       return 'vaadin-popover';
     }
 
-    requestContentUpdate() {
-      super.requestContentUpdate();
-
-      // Copy custom properties from the owner
-      if (this.positionTarget && this.owner) {
-        const style = getComputedStyle(this.owner);
-        ['top', 'bottom', 'start', 'end'].forEach((prop) => {
-          this.style.setProperty(
-            `--${this._tagNamePrefix}-offset-${prop}`,
-            style.getPropertyValue(`--${this._tagNamePrefix}-offset-${prop}`),
-          );
-        });
-      }
-    }
-
     /**
      * @protected
      * @override
@@ -83,6 +68,15 @@ export const PopoverOverlayMixin = (superClass) =>
         return;
       }
 
+      // Copy custom properties from the owner
+      if (this.owner) {
+        const style = getComputedStyle(this.owner);
+        ['top', 'bottom', 'start', 'end'].forEach((prop) => {
+          const propertyName = `--${this._tagNamePrefix}-offset-${prop}`;
+          this.style.setProperty(propertyName, style.getPropertyValue(propertyName));
+        });
+      }
+
       this.removeAttribute('arrow-centered');
 
       // Center the overlay horizontally