fix(popover): popover positions correctly on all frameworks (#26306)

Resolves #25337

packages/react/src/components/createInlineOverlayComponent.tsx

@@ -55,6 +55,17 @@ export const createInlineOverlayComponent = <PropType, ElementType>(
     componentDidMount() {
       this.componentDidUpdate(this.props);
 
+      /**
+       * Mount the inner component when the
+       * overlay is about to open.
+       *
+       * For ion-popover, this is when `ionMount` is emitted.
+       * For other overlays, this is when `willPresent` is emitted.
+       */
+      this.ref.current?.addEventListener('ionMount', () => {
+        this.setState({ isOpen: true });
+      });
+
       /**
        * Mount the inner component
        * when overlay is about to open.

packages/react/test-app/src/pages/overlay-components/PopoverComponent.tsx

@@ -83,4 +83,4 @@ const PopoverComponent: React.FC = () => {
   );
 };
 
-export default PopoverComponent;
+export default PopoverComponent;

packages/vue/src/vue-component-lib/overlays.ts

@@ -139,6 +139,7 @@ export const defineOverlayContainer = <Props extends object>(name: string, defin
       const elementRef = ref();
 
       onMounted(() => {
+        elementRef.value.addEventListener('ion-mount', () => isOpen.value = true);
         elementRef.value.addEventListener('will-present', () => isOpen.value = true);
         elementRef.value.addEventListener('did-dismiss', () => isOpen.value = false);
       });