Fix flaky test_component_view_to_iframe_* tests

view_to_iframe renders the iframe with loading="lazy", so the browser only fetches the iframe's document once it is scrolled close to the viewport. These iframes sit well below the fold of the home page and the shared browser page is (usually) already sitting on /, so navigate_to_page performs no navigation and the page is never scrolled. Left alone, the browser can defer the iframe's document fetch long enough that the test's 30 second wait_for times out (observed intermittently on slow CI runners, e.g. test_component_view_to_iframe_sync_func on windows-latest).

Scrolling the container into view is the browser's documented trigger for a lazy load, so the document is fetched immediately and the test is not at the mercy of the browser's load-timing heuristics. A small shared helper applies this to each of the iframe component tests.

Co-authored-by: User <user@example.com>

Author: User

tests/test_app/tests/test_components.py

@@ -182,38 +182,61 @@ def test_component_view_to_component_args(self):
     def test_component_view_to_component_kwargs(self):
         self._click_btn_and_check_success("view_to_component_kwargs")
 
+    def _scroll_iframe_into_view(self, container_id: str) -> None:
+        """
+        Scroll a `view_to_iframe` container into the browser viewport.
+
+        `view_to_iframe` renders the iframe with `loading="lazy"`, so the
+        browser only fetches the iframe's document once it is scrolled close to
+        the viewport. These iframes sit well below the fold of the home page and
+        the shared browser page is (usually) already sitting on "/", so
+        `navigate_to_page` performs no navigation and the page is never scrolled.
+        Left alone, the browser can defer the iframe's document fetch long enough
+        that the test's 30 second `wait_for` times out (observed on slow CI
+        runners). Scrolling the container into view is the browser's documented
+        trigger for a lazy load, so the document is fetched immediately and the
+        test is not at the mercy of the browser's load-timing heuristics.
+        """
+        self.page.locator(f"#{container_id}").scroll_into_view_if_needed()
+
     @navigate_to_page("/")
     def test_component_view_to_iframe_sync_func(self):
+        self._scroll_iframe_into_view("view_to_iframe_sync_func")
         self.page.frame_locator("#view_to_iframe_sync_func > iframe").locator(
             "#view_to_iframe_sync_func[data-success=true]"
         ).wait_for()
 
     @navigate_to_page("/")
     def test_component_view_to_iframe_async_func(self):
+        self._scroll_iframe_into_view("view_to_iframe_async_func")
         self.page.frame_locator("#view_to_iframe_async_func > iframe").locator(
             "#view_to_iframe_async_func[data-success=true]"
         ).wait_for()
 
     @navigate_to_page("/")
     def test_component_view_to_iframe_sync_class(self):
+        self._scroll_iframe_into_view("view_to_iframe_sync_class")
         self.page.frame_locator("#view_to_iframe_sync_class > iframe").locator(
             "#ViewToIframeSyncClass[data-success=true]"
         ).wait_for()
 
     @navigate_to_page("/")
     def test_component_view_to_iframe_async_class(self):
+        self._scroll_iframe_into_view("view_to_iframe_async_class")
         self.page.frame_locator("#view_to_iframe_async_class > iframe").locator(
             "#ViewToIframeAsyncClass[data-success=true]"
         ).wait_for()
 
     @navigate_to_page("/")
     def test_component_view_to_iframe_template_view_class(self):
+        self._scroll_iframe_into_view("view_to_iframe_template_view_class")
         self.page.frame_locator("#view_to_iframe_template_view_class > iframe").locator(
             "#ViewToIframeTemplateViewClass[data-success=true]"
         ).wait_for()
 
     @navigate_to_page("/")
     def test_component_view_to_iframe_args(self):
+        self._scroll_iframe_into_view("view_to_iframe_args")
         self.page.frame_locator("#view_to_iframe_args > iframe").locator(
             "#view_to_iframe_args[data-success=Success]"
         ).wait_for()