tests(navs): Add PageNavbar and NavsetHidden tests and controllers

CHANGELOG.md

@@ -7,6 +7,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [UNRELEASED]
 
+### Breaking changes
+
+* `.expect_inverse()` for Navset controllers in `shiny.playwright.controllers` now requires a `bool` value. To keep behavior the same, use `.expect_inverse(False)`. (#1668)
+
+* `.expect_layout()` for Navset controllers in `shiny.playwright.controllers` is now renamed to `.expect_fluid()` and requires a `bool` value. To keep behavior the same, use `.expect_fluid(True)` (#1668)
+
+### New features
+
+### Other changes
+
+* Added `PageNavbar` class to the list of `shiny.playwright.controllers` for testing `ui.page_navbar()`. (#1668)
+
 ### Bug fixes
 
 * Fixed a bug with `Chat()` sometimes silently dropping errors. (#1672)

shiny/playwright/controller/__init__.py

@@ -61,6 +61,7 @@
     NavsetPillList,
     NavsetTab,
     NavsetUnderline,
+    PageNavbar,
 )
 from ._output import (
     OutputCode,
@@ -121,4 +122,5 @@
     "NavsetUnderline",
     "DownloadButton",
     "DownloadLink",
+    "PageNavbar",
 ]

shiny/playwright/controller/_navs.py

@@ -7,8 +7,13 @@
 from typing_extensions import Literal
 
 from .._types import PatternOrStr, Timeout
+from ..expect import (
+    expect_not_to_have_class,
+    expect_to_have_class,
+    expect_to_have_style,
+)
+from ..expect._internal import expect_attribute_to_have_value
 from ..expect._internal import expect_class_to_have_value as _expect_class_to_have_value
-from ..expect._internal import expect_style_to_have_value as _expect_style_to_have_value
 from ._base import (
     InitLocator,
     UiWithContainer,
@@ -424,18 +429,20 @@ def __init__(self, page: Page, id: str) -> None:
             loc="> li.nav-item",
         )
 
-    def expect_well(self, has_well: bool, *, timeout: Timeout = None) -> None:
+    # TODO-karan test this method
+    def expect_well(self, value: bool, *, timeout: Timeout = None) -> None:
         """
         Expects the navset pill list to have a well.
 
         Parameters
         ----------
-        has_well
-            `True` if the navset pill list is expected to have a well, `False` otherwise.
+        value
+            `True` if the navset pill list is expected to be constructed with a well,
+            `False` otherwise.
         timeout
             The maximum time to wait for the expectation to pass. Defaults to `None`.
         """
-        if has_well:
+        if value:
             playwright_expect(self.loc_container.locator("..")).to_have_class("well")
         else:
             playwright_expect(self.loc_container.locator("..")).not_to_have_class(
@@ -563,12 +570,12 @@ def __init__(self, page: Page, id: str) -> None:
         )
 
 
-class NavsetBar(
+class _NavsetBarBase(
     _ExpectNavsetSidebarM,
     _ExpectNavsetTitleM,
     _NavsetBase,
 ):
-    """Controller for :func:`shiny.ui.navset_bar`."""
+    """Mixin class for common expectations of nav bars."""
 
     def __init__(self, page: Page, id: str) -> None:
         """
@@ -631,20 +638,30 @@ def expect_position(
                 re.compile(rf"{position}"), timeout=timeout
             )
 
-    def expect_inverse(self, *, timeout: Timeout = None) -> None:
+    def expect_inverse(
+        self,
+        value: bool,
+        *,
+        timeout: Timeout = None,
+    ) -> None:
         """
         Expects the navset bar to be light text color if inverse is True
 
         Parameters
         ----------
+        value
+            `True` if the navset bar is expected to have inverse text color, `False` otherwise.
         timeout
             The maximum time to wait for the expectation to pass. Defaults to `None`.
         """
-        playwright_expect(self._loc_navbar).to_have_class(
-            re.compile("navbar-inverse"), timeout=timeout
+        _expect_class_to_have_value(
+            self._loc_navbar,
+            "navbar-inverse",
+            has_class=value,
+            timeout=timeout,
         )
 
-    def expect_bg(self, bg: str, *, timeout: Timeout = None) -> None:
+    def expect_bg(self, bg: PatternOrStr, *, timeout: Timeout = None) -> None:
         """
         Expects the navset bar to have the specified background color.
 
@@ -655,11 +672,14 @@ def expect_bg(self, bg: str, *, timeout: Timeout = None) -> None:
         timeout
             The maximum time to wait for the expectation to pass. Defaults to `None`.
         """
-        _expect_style_to_have_value(
-            self._loc_navbar, "background-color", f"{bg} !important", timeout=timeout
+        expect_to_have_style(
+            self._loc_navbar,
+            "background-color",
+            f"{bg} !important",
+            timeout=timeout,
         )
 
-    def expect_gap(self, gap: str, *, timeout: Timeout = None) -> None:
+    def expect_gap(self, gap: PatternOrStr, *, timeout: Timeout = None) -> None:
         """
         Expects the navset bar to have the specified gap.
 
@@ -670,28 +690,117 @@ def expect_gap(self, gap: str, *, timeout: Timeout = None) -> None:
         timeout
             The maximum time to wait for the expectation to pass. Defaults to `None`.
         """
-        _expect_style_to_have_value(
-            self.get_loc_active_content(), "gap", gap, timeout=timeout
+        expect_to_have_style(
+            self.get_loc_active_content(),
+            "gap",
+            gap,
+            timeout=timeout,
         )
 
-    def expect_layout(
-        self, layout: Literal["fluid", "fixed"] = "fluid", *, timeout: Timeout = None
+    def expect_fluid(
+        self,
+        value: bool,
+        *,
+        timeout: Timeout = None,
     ) -> None:
         """
-        Expects the navset bar to have the specified layout.
+        Expects the navset bar to have a fluid or fixed layout.
 
         Parameters
         ----------
-        layout
-            The expected layout.
+        value
+            `True` if the layout is `fluid` or `False` if it is `fixed`.
         timeout
             The maximum time to wait for the expectation to pass. Defaults to `None`.
         """
-        if layout == "fluid":
-            playwright_expect(
-                self.loc_container.locator("..").locator("..")
-            ).to_have_class(re.compile("container-fluid"), timeout=timeout)
+        if value:
+            expect_to_have_class(
+                self._loc_navbar.locator("> div"),
+                "container-fluid",
+                timeout=timeout,
+            )
         else:
-            playwright_expect(self.loc_container.locator("..")).to_have_class(
-                re.compile("container"), timeout=timeout
+            expect_to_have_class(
+                self._loc_navbar.locator("> div"),
+                "container",
+                timeout=timeout,
             )
+
+
+class NavsetBar(_NavsetBarBase):
+    """Controller for :func:`shiny.ui.navset_bar`."""
+
+
+class PageNavbar(_NavsetBarBase):
+    """Controller for :func:`shiny.ui.page_navbar`."""
+
+    def expect_fillable(self, *, timeout: Timeout = None) -> None:
+        """
+        Expects the main content area to be considered a fillable (i.e., flexbox) container
+
+        Parameters
+        ----------
+        timeout
+            The maximum time to wait for the expectation to pass. Defaults to `None`.
+        """
+        expect_to_have_class(
+            self.get_loc_active_content(), "html-fill-container", timeout=timeout
+        )
+
+    def expect_fillable_mobile(self, value: bool, *, timeout: Timeout = None) -> None:
+        """
+        Expects the main content area to be considered a fillable (i.e., flexbox) container on mobile
+
+        Parameters
+        ----------
+        value
+            `True` if the main content area is expected to be fillable on mobile, `False` otherwise.
+        timeout
+            The maximum time to wait for the expectation to pass. Defaults to `None`.
+        """
+        # This is important since fillable_mobile needs fillable property to be True
+        expect_to_have_class(
+            self.page.locator("body"), "bslib-page-fill", timeout=timeout
+        )
+
+        if value:
+            expect_not_to_have_class(
+                self.page.locator("body"), "bslib-flow-mobile", timeout=timeout
+            )
+        else:
+            expect_to_have_class(
+                self.page.locator("body"), "bslib-flow-mobile", timeout=timeout
+            )
+
+    def expect_window_title(
+        self, title: PatternOrStr, *, timeout: Timeout = None
+    ) -> None:
+        """
+        Expects the window title to have the specified text.
+
+        Parameters
+        ----------
+        title
+            The expected window title.
+        timeout
+            The maximum time to wait for the expectation to pass. Defaults to `None`.
+        """
+        playwright_expect(self.page).to_have_title(title, timeout=timeout)
+
+    def expect_lang(self, lang: PatternOrStr, *, timeout: Timeout = None) -> None:
+        """
+        Expects the HTML tag to have the specified language.
+
+        Parameters
+        ----------
+        lang
+            The expected language.
+        timeout
+            The maximum time to wait for the expectation to pass. Defaults to `None`.
+        """
+        expect_attribute_to_have_value(
+            self.page.locator("html"),
+            "lang",
+            lang,
+            timeout=timeout,
+        )

shiny/playwright/expect/_internal.py

@@ -93,3 +93,41 @@ def expect_class_to_have_value(
         expect_to_have_class(loc, class_, timeout=timeout)
     else:
         expect_not_to_have_class(loc, class_, timeout=timeout)
+
+
+def _expect_nav_to_have_header_footer(
+    parent_loc: Locator,
+    header_id: str,
+    footer_id: str,
+    *,
+    timeout: Timeout = None,
+) -> None:
+    """
+    Expect the DOM structure for a header and footer to be preserved.
+
+    Parameters
+    ----------
+    parent_loc
+        The parent locator to check.
+    header_id
+        The ID of the header element.
+    footer_id
+        The ID of the footer element.
+    timeout
+        The maximum time to wait for the header and footer to appear.
+    """
+    # assert the DOM structure for page_navbar with header and footer is preserved
+    class_attr = parent_loc.get_attribute("class")
+    if class_attr and "card" in class_attr:
+        complicated_parent_loc = parent_loc.locator(
+            "xpath=.",
+            has=parent_loc.locator("..").locator(
+                f".card-body:has(#{header_id}) + .card-body:has(.tab-content) + .card-body #{footer_id}"
+            ),
+        )
+    else:
+        complicated_parent_loc = parent_loc.locator(
+            "xpath=.",
+            has=parent_loc.locator(f"#{header_id} + .tab-content + #{footer_id}"),
+        ).locator("..")
+    playwright_expect(complicated_parent_loc).to_have_count(1, timeout=timeout)

tests/playwright/shiny/components/nav/app.py

@@ -8,11 +8,6 @@
 from shiny.types import NavSetArg
 from shiny.ui import Sidebar
 
-# TODO-karan; Make test that uses sidebar / no sidebar (where possible)
-# TODO-karan; Make test that has/does not have a header & footer (where possible)
-# TODO-karan; Test for title value (where possible)
-# TODO-karan; Make test that has placement = "above" / "below" (where possible); Test in combination of with/without sidebar
-
 
 def nav_controls(prefix: str) -> List[NavSetArg]:
     return [

tests/playwright/shiny/components/nav/navset_bar_kitchensink/test_navset_bar.py

@@ -45,13 +45,13 @@ def test_navset_bar_kitchensink(page: Page, local_app: ShinyAppProc) -> None:
         "Panel A content"
     )
     navset_bar_with_sidebar_collapsible_bg_inverse.expect_position("sticky-top")
-    navset_bar_with_sidebar_collapsible_bg_inverse.expect_inverse()
+    navset_bar_with_sidebar_collapsible_bg_inverse.expect_inverse(value=True)
     navset_bar_with_sidebar_collapsible_bg_inverse.expect_bg("DodgerBlue")
     navset_bar_with_sidebar_collapsible_bg_inverse.expect_sidebar(True)
-    navset_bar_with_sidebar_collapsible_bg_inverse.expect_layout("fluid")
+    navset_bar_with_sidebar_collapsible_bg_inverse.expect_fluid(True)
 
     navset_tab.set("fixed")
     navset_bar_collapsible_underline_fixed_gap._expect_content_text("Panel A content")
     navset_bar_collapsible_underline_fixed_gap.expect_value("A")
     navset_bar_collapsible_underline_fixed_gap.expect_gap("50px")
-    navset_bar_collapsible_underline_fixed_gap.expect_layout("fixed")
+    navset_bar_collapsible_underline_fixed_gap.expect_fluid(False)

tests/playwright/shiny/components/nav/navset_hidden_kitchensink/app.py

@@ -0,0 +1,40 @@
+from shiny import reactive
+from shiny.express import input, ui
+
+ui.input_radio_buttons("controller1", "Controller1", ["1", "2", "3"], selected="2")
+
+with ui.navset_hidden(
+    id="hidden_tabs1",
+    header=ui.tags.div("Navset_hidden_header", id="navset_hidden_header1"),
+    footer=ui.tags.div("Navset_hidden_footer", id="navset_hidden_footer1"),
+    selected="panel2",
+):
+    with ui.nav_panel(None, value="panel1"):
+        "Panel 1 content"
+    with ui.nav_panel(None, value="panel2"):
+        "Panel 2 content"
+    with ui.nav_panel(None, value="panel3"):
+        "Panel 3 content"
+
+ui.markdown("-----")
+ui.input_radio_buttons("controller2", "Controller2", ["4", "5", "6"])
+
+with ui.navset_hidden(id="hidden_tabs2"):
+    with ui.nav_panel(None, value="panel4"):
+        "Panel 4 content"
+    with ui.nav_panel(None, value="panel5"):
+        "Panel 5 content"
+    with ui.nav_panel(None, value="panel6"):
+        "Panel 6 content"
+
+
+@reactive.effect
+@reactive.event(input.controller1)
+def _():
+    ui.update_navs("hidden_tabs1", selected="panel" + str(input.controller1()))
+
+
+@reactive.effect
+@reactive.event(input.controller2)
+def _():
+    ui.update_navs("hidden_tabs2", selected="panel" + str(input.controller2()))