Fix initial Skiko popup positioning

compose/ui/ui/src/desktopTest/kotlin/androidx/compose/ui/ComposeSceneInputTest.kt

@@ -66,6 +66,9 @@ class ComposeSceneInputTest {
             overlappedPopup.Content()
             independentPopup.Content()
         }
+        // The popup is composed after the parent is placed and publishes its anchor.
+        scene.render()
+        scene.render()
 
         scene.sendPointerEvent(PointerEventType.Enter, Offset(5f, 5f))
         background.events.assertReceivedNoEvents()
@@ -155,6 +158,9 @@ class ComposeSceneInputTest {
             overlappedPopup.Content()
             independentPopup.Content()
         }
+        // The popup is composed after the parent is placed and publishes its anchor.
+        scene.render()
+        scene.render()
 
         scene.sendPointerEvent(PointerEventType.Enter, Offset(5f, 5f))
         scene.sendPointerEvent(PointerEventType.Press, Offset(5f, 5f))

compose/ui/ui/src/desktopTest/kotlin/androidx/compose/ui/awt/ComposeDialogTest.kt

@@ -383,6 +383,11 @@ class ComposeDialogTest {
         }
 
         try {
+            // The popup is composed after its parent has been placed and published an anchor.
+            dialog.pack()
+            assertThat(dialog.size).isEqualTo(Dimension(100, 100) + dialog.insets)
+
+            dialog.renderImmediately()
             dialog.pack()
             val size = dialog.size
             assertThat(size).isEqualTo(Dimension(500, 500) + dialog.insets)
@@ -392,4 +397,4 @@ class ComposeDialogTest {
     }
 
     private class TestException : Exception()
-}
+}

compose/ui/ui/src/desktopTest/kotlin/androidx/compose/ui/awt/ComposePanelTest.kt

@@ -1045,6 +1045,11 @@ class ComposePanelTest {
         }
 
         try {
+            // The popup is composed after its parent has been placed and published an anchor.
+            frame.pack()
+            assertThat(frame.size).isEqualTo(Dimension(100, 100) + frame.insets)
+
+            composePanel.renderImmediately()
             frame.pack()
             val size = frame.size
             assertThat(size).isEqualTo(Dimension(500, 500) + frame.insets)
@@ -1078,4 +1083,4 @@ private fun LayoutManager(sizeFunction: Component.() -> Dimension?): LayoutManag
             }
         }
     }
-}
+}

compose/ui/ui/src/desktopTest/kotlin/androidx/compose/ui/awt/ComposeWindowTest.kt

@@ -400,6 +400,11 @@ class ComposeWindowTest {
         }
 
         try {
+            // The popup is composed after its parent has been placed and published an anchor.
+            window.pack()
+            assertThat(window.size).isEqualTo(Dimension(100, 100) + window.insets)
+
+            window.renderImmediately()
             window.pack()
             val size = window.size
             assertThat(size).isEqualTo(Dimension(500, 500) + window.insets)

compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/window/Popup.skiko.kt

@@ -23,6 +23,7 @@ import androidx.compose.runtime.InternalComposeApi
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.currentCompositeKeyHashCode
+import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
@@ -471,10 +472,10 @@ private fun PopupLayout(
     content: @Composable () -> Unit
 ) {
     // Use a MutableState directly to avoid recomposing when the value changes
-    val parentBoundsInWindow: MutableState<IntRect> = remember { mutableStateOf(IntRect.Zero) }
+    // Use nullable as a marker to wait until the popup scene has a real parent anchor before
+    // composing its content.
+    val parentBoundsInWindow: MutableState<IntRect?> = remember { mutableStateOf(null) }
     EmptyLayout(Modifier.onPlaced { childCoordinates ->
-        // This will be called before the popup measure policy is actually asked to calculate
-        // the popup's position, so it will never see the initial value of IntRect.Zero
         childCoordinates.parentCoordinates?.let {
             // Nodes which read layout coordinates (including, e.g., positionInWindow) in
             // layout/placement get invalidated when these coordinates change
@@ -492,6 +493,11 @@ private fun PopupLayout(
     layer.setKeyEventListener(onPreviewKeyEvent, onKeyEvent)
     layer.setOutsidePointerEventListener(onOutsidePointerEvent)
     layer.Content {
+        val canCalculatePosition by remember {
+            derivedStateOf { parentBoundsInWindow.value != null }
+        }
+        if (!canCalculatePosition) return@Content
+
         val platformInsets = properties.platformInsets
         val containerSize = LocalWindowInfo.current.containerSize
         val layoutDirection = LocalLayoutDirection.current
@@ -541,7 +547,7 @@ private fun rememberPopupMeasurePolicy(
     containerSize: IntSize,
     platformInsets: PlatformInsets,
     layoutDirection: LayoutDirection,
-    parentBoundsInWindow: MutableState<IntRect>
+    parentBoundsInWindow: MutableState<IntRect?>
 ) = remember(
     layer,
     popupPositionProvider,
@@ -556,6 +562,7 @@ private fun rememberPopupMeasurePolicy(
         usePlatformDefaultWidth = properties.usePlatformDefaultWidth
     ) { contentSize ->
         val parentRectInWindow = parentBoundsInWindow.value
+            ?: return@ComposeSceneLayerMeasurePolicy IntOffset.Zero
         val positionWithInsets =
             positionWithInsets(platformInsets, containerSize) { sizeWithoutInsets ->
                 // Position provider works in coordinates without insets.

compose/ui/ui/src/skikoTest/kotlin/androidx/compose/ui/window/PopupTest.kt

@@ -837,7 +837,9 @@ class PopupTest : SkikoComposeTestBase() {
     }
 
     @Test
-    fun popupShownAtCorrectCoordinatesImmediately() = runSkikoComposeUiTest {
+    fun popupShownAtCorrectCoordinatesImmediatelyInSameScene() = runSkikoComposeUiTest {
+        // CanvasLayersComposeScene measures popup layers in the same scene as their parent, so
+        // the parent's onPlaced callback is observable when the popup is first laid out.
         val positionProvider = object : PopupPositionProvider {
             override fun calculatePosition(
                 anchorBounds: IntRect,

compose/ui/ui/src/uikitInstrumentedTest/kotlin/androidx/compose/ui/layers/LayersRenderingTest.kt

@@ -18,13 +18,14 @@ package androidx.compose.ui.layers
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.background
-import androidx.compose.ui.draw.drawBehind
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.onPlaced
 import androidx.compose.ui.test.captureScreenshot
 import androidx.compose.ui.test.runUIKitInstrumentedTest
 import androidx.compose.ui.test.utils.forEachPixel
@@ -33,56 +34,53 @@ import androidx.compose.ui.window.PopupProperties
 import kotlin.test.Test
 import kotlin.test.assertEquals
 import kotlin.test.assertNotNull
-import platform.UIKit.UIImage
-import platform.darwin.dispatch_async
-import platform.darwin.dispatch_get_main_queue
 
 class LayersRenderingTest {
     @Test
-    fun testLayerContentOnFirstRender() = runUIKitInstrumentedTest {
+    fun testLayerContentAfterParentAnchorIsAvailable() = runUIKitInstrumentedTest {
         var showRed by mutableStateOf(false)
         var showGreen by mutableStateOf(false)
-        var onRender = {}
-        var frameImage: UIImage? = null
-
-        fun prepareForCaptureNextFrame() {
-            frameImage = null
-            onRender = {
-                dispatch_async(dispatch_get_main_queue()) {
-                    frameImage = captureScreenshot()
-                }
-                onRender = {}
-            }
-        }
+        var popupContentPlaced by mutableStateOf(false)
 
         setContent {
-            Box(Modifier.fillMaxSize().background(Color.Blue).drawBehind {
-                onRender()
-            })
+            Box(Modifier.fillMaxSize().background(Color.Blue))
             if (showRed) {
                 Popup(
                     onDismissRequest = {},
                     properties = PopupProperties(usePlatformInsets = false)
                 ) {
-                    Box(Modifier.fillMaxSize().background(Color.Red))
+                    DisposableEffect(Unit) {
+                        onDispose { popupContentPlaced = false }
+                    }
+                    Box(
+                        Modifier
+                            .fillMaxSize()
+                            .background(Color.Red)
+                            .onPlaced { popupContentPlaced = true }
+                    )
                 }
             }
             if (showGreen) {
                 Popup(
                     onDismissRequest = {},
                     properties = PopupProperties(usePlatformInsets = false)
                 ) {
-                    Box(Modifier.fillMaxSize().background(Color.Green))
+                    DisposableEffect(Unit) {
+                        onDispose { popupContentPlaced = false }
+                    }
+                    Box(
+                        Modifier
+                            .fillMaxSize()
+                            .background(Color.Green)
+                            .onPlaced { popupContentPlaced = true }
+                    )
                 }
             }
         }
 
-        fun assertNextFrameColor(expectedColor: Color) {
-            prepareForCaptureNextFrame()
+        fun assertFrameColor(expectedColor: Color) {
             waitForIdle()
-
-            assertNotNull(frameImage)
-            frameImage!!.forEachPixel(step = 4) { _, _, actualColor ->
+            assertNotNull(captureScreenshot()).forEachPixel(step = 4) { _, _, actualColor ->
                 assertEquals(
                     expectedColor,
                     actualColor,
@@ -91,16 +89,33 @@ class LayersRenderingTest {
             }
         }
 
+        fun awaitPopupContentPlacement() {
+            waitUntil("Popup content should be placed") { popupContentPlaced }
+            waitForIdle()
+        }
+
+        fun awaitPopupContentDisposal() {
+            waitUntil("Popup content should be disposed") { !popupContentPlaced }
+            waitForIdle()
+        }
+
+        // IosComposeSceneLayer owns a separate ComposeScene. Its first layout is not ordered
+        // after the parent scene's onPlaced callback, so this test only asserts the result once
+        // UIKit has processed both scenes, rather than requiring the popup in a particular frame.
         showRed = true
-        assertNextFrameColor(Color.Red)
+        awaitPopupContentPlacement()
+        assertFrameColor(Color.Red)
 
         showRed = false
-        assertNextFrameColor(Color.Blue)
+        awaitPopupContentDisposal()
+        assertFrameColor(Color.Blue)
 
         showGreen = true
-        assertNextFrameColor(Color.Green)
+        awaitPopupContentPlacement()
+        assertFrameColor(Color.Green)
 
         showGreen = false
-        assertNextFrameColor(Color.Blue)
+        awaitPopupContentDisposal()
+        assertFrameColor(Color.Blue)
     }
 }