misc fixes in order to get reconnect test to work

Author: rmorshea

src/idom/server/_asgi.py

@@ -22,15 +22,7 @@ async def check_if_started():
             await asyncio.sleep(0.2)
         started.set()
 
-    coros = [server.serve(), check_if_started()]
-    _, pending = await asyncio.wait(
-        list(map(asyncio.create_task, coros)), return_when=FIRST_EXCEPTION
-    )
-
-    for task in pending:
-        task.cancel()
-
     try:
-        await asyncio.gather(*list(pending))
-    except CancelledError:
-        pass
+        await asyncio.gather(server.serve(), check_if_started())
+    finally:
+        await asyncio.wait_for(server.shutdown(), timeout=3)

src/idom/testing.py

@@ -136,7 +136,7 @@ def __init__(
             self.server = server
         if driver is not None:
             if isinstance(driver, Page):
-                self._page = driver
+                self.page = driver
             else:
                 self._browser = driver
         self._next_view_id = 0
@@ -145,29 +145,27 @@ async def show(
         self,
         component: RootComponentConstructor,
         query: dict[str, Any] | None = None,
-    ) -> Page:
+    ) -> None:
         self._next_view_id += 1
         view_id = f"display-{self._next_view_id}"
         self.server.mount(lambda: html.div({"id": view_id}, component()))
 
-        await self._page.goto(self.server.url(query=query))
-        await self._page.wait_for_selector(f"#{view_id}", state="attached")
-
-        return self._page
+        await self.page.goto(self.server.url(query=query))
+        await self.page.wait_for_selector(f"#{view_id}", state="attached")
 
-    async def __aenter__(self: _Self) -> _Self:
+    async def __aenter__(self) -> DisplayFixture:
         es = self._exit_stack = AsyncExitStack()
 
-        if not hasattr(self, "_page"):
+        if not hasattr(self, "page"):
             if not hasattr(self, "_browser"):
                 pw = await es.enter_async_context(async_playwright())
                 browser = await pw.chromium.launch()
             else:
                 browser = self._browser
-            self._page = await browser.new_page()
+            self.page = await browser.new_page()
 
         if not hasattr(self, "server"):
-            self.server = ServerFixture(**self._server_options)
+            self.server = ServerFixture()
             await es.enter_async_context(self.server)
 
         return self
@@ -196,7 +194,7 @@ class ServerFixture:
 
     _records: list[logging.LogRecord]
     _server_future: asyncio.Task[Any]
-    _exit_stack = ExitStack()
+    _exit_stack = AsyncExitStack()
 
     def __init__(
         self,
@@ -205,7 +203,6 @@ def __init__(
         app: Any | None = None,
         implementation: ServerImplementation[Any] = default_server,
     ) -> None:
-        self.server_implementation = implementation
         self.host = host
         self.port = port or find_available_port(host, allow_reuse_waiting_ports=False)
         self.mount, self._root_component = hotswap()
@@ -216,7 +213,9 @@ def __init__(
                     "If an application instance its corresponding "
                     "server implementation must be provided too."
                 )
+
         self._app = app
+        self._server_implementation = implementation
 
     @property
     def log_records(self) -> List[logging.LogRecord]:
@@ -270,21 +269,28 @@ def list_logged_exceptions(
                     found.append(error)
         return found
 
-    async def __aenter__(self: _Self) -> _Self:
-        self._exit_stack = ExitStack()
+    async def __aenter__(self) -> ServerFixture:
+        self._exit_stack = AsyncExitStack()
         self._records = self._exit_stack.enter_context(capture_idom_logs())
 
-        app = self._app or self.server_implementation.create_development_app()
-        self.server_implementation.configure(app, self._root_component)
+        app = self._app or self._server_implementation.create_development_app()
+        self._server_implementation.configure(app, self._root_component)
 
         started = asyncio.Event()
-        self._server_future = asyncio.ensure_future(
-            self.server_implementation.serve_development_app(
+        server_future = asyncio.create_task(
+            self._server_implementation.serve_development_app(
                 app, self.host, self.port, started
             )
         )
 
-        self._exit_stack.callback(self._server_future.cancel)
+        async def stop_server():
+            server_future.cancel()
+            try:
+                await asyncio.wait_for(server_future, timeout=3)
+            except asyncio.CancelledError:
+                pass
+
+        self._exit_stack.push_async_callback(stop_server)
 
         try:
             await asyncio.wait_for(started.wait(), timeout=3)
@@ -301,15 +307,10 @@ async def __aexit__(
         exc_value: Optional[BaseException],
         traceback: Optional[TracebackType],
     ) -> None:
-        self._exit_stack.close()
+        await self._exit_stack.aclose()
 
         self.mount(None)  # reset the view
 
-        try:
-            await asyncio.wait_for(self._server_future, timeout=3)
-        except asyncio.CancelledError:
-            pass
-
         logged_errors = self.list_logged_exceptions(del_log_records=False)
         if logged_errors:  # pragma: no cover
             raise LogAssertionError("Unexpected logged exception") from logged_errors[0]

tests/test_client.py

@@ -1,32 +1,40 @@
 import asyncio
 import time
+from contextlib import AsyncExitStack
 from pathlib import Path
 
+from playwright.async_api import Browser
+
 import idom
-from idom.testing import ServerFixture
+from idom.testing import DisplayFixture, ServerFixture
 
 
 JS_DIR = Path(__file__).parent / "js"
 
 
-async def test_automatic_reconnect(create_driver):
-    # we need to wait longer here because the automatic reconnect is not instance
-    driver = create_driver(implicit_wait_timeout=10, page_load_timeout=10)
+async def test_automatic_reconnect(browser: Browser):
+    page = await browser.new_page()
+
+    # we need to wait longer here because the automatic reconnect is not instant
+    page.set_default_timeout(10000)
 
     @idom.component
     def OldComponent():
         return idom.html.p({"id": "old-component"}, "old")
 
-    mount_point = ServerFixture()
+    async with AsyncExitStack() as exit_stack:
+        server = await exit_stack.enter_async_context(ServerFixture(port=8000))
+        display = await exit_stack.enter_async_context(
+            DisplayFixture(server, driver=page)
+        )
+
+        await display.show(OldComponent)
 
-    async with mount_point:
-        mount_point.mount(OldComponent)
-        driver.get(mount_point.url())
         # ensure the element is displayed before stopping the server
-        driver.find_element("id", "old-component")
+        await page.wait_for_selector("#old-component")
 
     # the server is disconnected but the last view state is still shown
-    driver.find_element("id", "old-component")
+    await page.wait_for_selector("#old-component")
 
     set_state = idom.Ref(None)
 
@@ -35,16 +43,21 @@ def NewComponent():
         state, set_state.current = idom.hooks.use_state(0)
         return idom.html.p({"id": f"new-component-{state}"}, f"new-{state}")
 
-    with mount_point:
-        mount_point.mount(NewComponent)
+    async with AsyncExitStack() as exit_stack:
+        server = await exit_stack.enter_async_context(ServerFixture(port=8000))
+        display = await exit_stack.enter_async_context(
+            DisplayFixture(server, driver=page)
+        )
+
+        await display.show(NewComponent)
 
         # Note the lack of a page refresh before looking up this new component. The
         # client should attempt to reconnect and display the new view automatically.
-        driver.find_element("id", "new-component-0")
+        await page.wait_for_selector("#new-component-0")
 
         # check that we can resume normal operation
         set_state.current(1)
-        driver.find_element("id", "new-component-1")
+        await page.wait_for_selector("#new-component-1")
 
 
 def test_style_can_be_changed(display, driver, driver_wait):

tests/test_html.py

@@ -39,9 +39,9 @@ def HasScript():
             }"""
         )
 
-    page = await display.show(Root)
+    await display.show(Root)
 
-    mount_state = await page.wait_for_selector("#mount-state", state="attached")
+    mount_state = await display.page.wait_for_selector("#mount-state", state="attached")
     poll_mount_state = poll(mount_state.get_attribute, "data-value")
 
     await poll_mount_state.until_equals("true")
@@ -74,12 +74,14 @@ def HasScript():
             ),
         )
 
-    page = await display.show(HasScript)
+    await display.show(HasScript)
 
-    mount_count = await page.wait_for_selector("#mount-count", state="attached")
+    mount_count = await display.page.wait_for_selector("#mount-count", state="attached")
     poll_mount_count = poll(mount_count.get_attribute, "data-value")
 
-    unmount_count = await page.wait_for_selector("#unmount-count", state="attached")
+    unmount_count = await display.page.wait_for_selector(
+        "#unmount-count", state="attached"
+    )
     poll_unmount_count = poll(unmount_count.get_attribute, "data-value")
 
     await poll_mount_count.until_equals("1")
@@ -114,7 +116,7 @@ def HasScript():
                 ),
             )
 
-    page = await display.show(HasScript)
+    await display.show(HasScript)
 
     for i in range(1, 4):
         script_file = config.IDOM_WEB_MODULES_DIR.current / file_name_template.format(
@@ -129,7 +131,7 @@ def HasScript():
 
         incr_src_id.current()
 
-        run_count = await page.wait_for_selector("#run-count", state="attached")
+        run_count = await display.page.wait_for_selector("#run-count", state="attached")
         poll_run_count = poll(run_count.get_attribute, "data-value")
         await poll_run_count.until_equals("1")
 

tests/test_sample.py

@@ -3,6 +3,7 @@
 
 
 async def test_sample_app(display: DisplayFixture):
-    page = await display.show(App)
-    h1 = await page.wait_for_selector("h1")
+    await display.show(App)
+
+    h1 = await display.page.wait_for_selector("h1")
     assert (await h1.text_content()) == "Sample Application"

tests/test_web/test_module.py

@@ -40,19 +40,19 @@ def ShowCurrentComponent():
         )
         return current_component
 
-    page = await display.show(ShowCurrentComponent)
+    await display.show(ShowCurrentComponent)
 
-    await page.wait_for_selector("#some-component", state="attached")
+    await display.page.wait_for_selector("#some-component", state="attached")
 
     set_current_component.current(
         idom.html.h1({"id": "some-other-component"}, "some other component")
     )
 
     # the new component has been displayed
-    await page.wait_for_selector("#some-other-component", state="attached")
+    await display.page.wait_for_selector("#some-other-component", state="attached")
 
     # the unmount callback for the old component was called
-    await page.wait_for_selector("#unmount-flag", state="attached")
+    await display.page.wait_for_selector("#unmount-flag", state="attached")
 
 
 async def test_module_from_url(browser):
@@ -76,8 +76,9 @@ def ShowSimpleButton():
 
     async with ServerFixture(app=app, implementation=sanic_implementation) as server:
         async with DisplayFixture(server, browser) as display:
-            page = await display.show(ShowSimpleButton)
-            await page.wait_for_selector("#my-button")
+            await display.show(ShowSimpleButton)
+
+            await display.page.wait_for_selector("#my-button")
 
 
 def test_module_from_template_where_template_does_not_exist():
@@ -88,8 +89,9 @@ def test_module_from_template_where_template_does_not_exist():
 async def test_module_from_template(display: DisplayFixture):
     victory = idom.web.module_from_template("react", "[email protected]")
     VictoryBar = idom.web.export(victory, "VictoryBar")
-    page = await display.show(VictoryBar)
-    await page.wait_for_selector(".VictoryContainer")
+    await display.show(VictoryBar)
+
+    await display.page.wait_for_selector(".VictoryContainer")
 
 
 async def test_module_from_file(display: DisplayFixture):
@@ -108,9 +110,9 @@ def ShowSimpleButton():
             {"id": "my-button", "onClick": lambda event: is_clicked.set_current(True)}
         )
 
-    page = await display.show(ShowSimpleButton)
+    await display.show(ShowSimpleButton)
 
-    button = await page.wait_for_selector("#my-button")
+    button = await display.page.wait_for_selector("#my-button")
     await button.click()
     poll(lambda: is_clicked.current).until_is(True)
 
@@ -198,13 +200,13 @@ async def test_module_exports_multiple_components(display: DisplayFixture):
         ["Header1", "Header2"],
     )
 
-    page = await display.show(lambda: Header1({"id": "my-h1"}, "My Header 1"))
+    await display.show(lambda: Header1({"id": "my-h1"}, "My Header 1"))
 
-    await page.wait_for_selector("#my-h1", state="attached")
+    await display.page.wait_for_selector("#my-h1", state="attached")
 
-    page = await display.show(lambda: Header2({"id": "my-h2"}, "My Header 2"))
+    await display.show(lambda: Header2({"id": "my-h2"}, "My Header 2"))
 
-    await page.wait_for_selector("#my-h2", state="attached")
+    await display.page.wait_for_selector("#my-h2", state="attached")
 
 
 async def test_imported_components_can_render_children(display: DisplayFixture):
@@ -213,15 +215,15 @@ async def test_imported_components_can_render_children(display: DisplayFixture):
     )
     Parent, Child = idom.web.export(module, ["Parent", "Child"])
 
-    page = await display.show(
+    await display.show(
         lambda: Parent(
             Child({"index": 1}),
             Child({"index": 2}),
             Child({"index": 3}),
         )
     )
 
-    parent = await page.wait_for_selector("#the-parent", state="attached")
+    parent = await display.page.wait_for_selector("#the-parent", state="attached")
     children = await parent.query_selector_all("li")
 
     assert len(children) == 3