#203 Add initial parameter navigation e2e tests

src/components/Header/CommitSelect.tsx

@@ -201,11 +201,7 @@ function CommitSelectContents() {
 /** Controls that affect the entire dashboard. */
 export default function CommitSelect() {
   return (
-    <Suspense
-      fallback={
-        <Skeleton data-testid="commit-select-loading" variant="rounded" height="4rem" />
-      }
-    >
+    <Suspense fallback={<Skeleton variant="rounded" height="4rem" />}>
       <CommitSelectContents />
     </Suspense>
   );

src/components/Header/Header.tsx

@@ -43,7 +43,7 @@ export default function Header() {
     <AppBar position="static" elevation={0}>
       <ThemeProvider theme={theme("dark")}>
         <Box sx={toolbarSx}>
-          <Suspense fallback={<Box data-testid="database-name-loading" />}>
+          <Suspense fallback={<Box />}>
             <DatabaseName />
           </Suspense>
           <Box sx={commitSelectContainerSx}>

src/components/ParamSection/ParamList.tsx

@@ -86,8 +86,8 @@ function ParamListItem({ path }: ParamListItemProps) {
 /** List of parameter data. */
 export default function ParamList() {
   return (
-    <Suspense fallback={<Box data-testid="parameter-list-loading" />}>
-      <List data-testid="parameter-list" disablePadding sx={rootListSx}>
+    <Suspense fallback={<Box />}>
+      <List disablePadding sx={rootListSx}>
         <ParamListItem path={[]} />
       </List>
     </Suspense>

tests/e2e/helpers.py

@@ -21,15 +21,15 @@
 _START_DATE = datetime(2023, 1, 1, tzinfo=timezone.utc).astimezone()
 
 
-class _CustomParam(Param):
+class CustomParam(Param):  # pylint: disable=missing-class-docstring
     int: int
     str: str
 
 
-class _CustomStruct(Struct):
+class CustomStruct(Struct):  # pylint: disable=missing-class-docstring
     int: int
     str: str
-    param: _CustomParam
+    param: CustomParam
 
 
 def get_date(commit_id: int) -> datetime:
@@ -42,6 +42,11 @@ def datetime_to_input_str(datetime_obj: datetime) -> str:
     return datetime_obj.astimezone().strftime("%Y-%m-%dT%H:%M")
 
 
+def datetime_to_display_str(datetime_obj: datetime) -> str:
+    """Format the datetime object in the format displayed in the app."""
+    return datetime_obj.astimezone().strftime("%m/%d/%y, %I:%M:%S %p")
+
+
 def clear(db: ParamDB[Any]) -> None:
     """Clear the database."""
     with db._Session.begin() as session:  # pylint: disable=no-member,protected-access
@@ -63,26 +68,27 @@ def commit(
 def reset(db: ParamDB[Any], num_commits: int = 3) -> None:
     """Clear the database and make some initial commits."""
     clear(db)
-    initial_data = ParamDict(
-        {
-            "commit_id": 1,
-            "int": 123,
-            "float": 1.2345,
-            "bool": True,
-            "str": "test",
-            "None": None,
-            "datetime": get_date(1),
-            "Quantity": 1.2345 * u.m,
-            "list": [123, "test"],
-            "dict": {"int": 123, "str": "test"},
-            "paramList": ParamList([123, "test"]),
-            "paramDict": ParamDict(int=123, str="test"),
-            "struct": _CustomStruct(
-                int=123, str="test", param=_CustomParam(int=123, str="test")
-            ),
-            "param": _CustomParam(int=123, str="test"),
-        }
-    )
+    with freeze_time(get_date(1)):
+        initial_data = ParamDict(
+            {
+                "commit_id": 1,
+                "int": 123,
+                "float": 1.2345,
+                "bool": True,
+                "str": "test",
+                "None": None,
+                "datetime": get_date(1),
+                "Quantity": 1.2345 * u.m,
+                "list": [123, "test"],
+                "dict": {"int": 123, "str": "test"},
+                "paramList": ParamList([123, "test"]),
+                "paramDict": ParamDict(int=123, str="test"),
+                "struct": CustomStruct(
+                    int=123, str="test", param=CustomParam(int=123, str="test")
+                ),
+                "param": CustomParam(int=123, str="test"),
+            }
+        )
     commit(db, "Initial commit", initial_data)
     for _ in range(2, num_commits + 1):
         commit(db)

tests/e2e/test_parameter_navigation.py

@@ -0,0 +1,41 @@
+"""Tests for parameter navigation."""
+
+import pytest
+from playwright.sync_api import Page, expect
+from tests.e2e.helpers import get_date, datetime_to_display_str
+
+DATE_DISPLAY_STR = datetime_to_display_str(get_date(1))
+
+
+@pytest.fixture(autouse=True)
+def setup(_reset_single_db: None, _visit_page: None) -> None:
+    """Automatically run before each test in this module."""
+
+
+@pytest.mark.parametrize(
+    "test_id,expected_text",
+    [
+        ("parameter-list-item-int", "int123"),
+        ("parameter-list-item-float", "float1.234"),  # Rounded
+        ("parameter-list-item-bool", "boolTrue"),
+        ("parameter-list-item-str", "strtest"),
+        ("parameter-list-item-None", "NoneNone"),
+        ("parameter-list-item-datetime", f"datetime{DATE_DISPLAY_STR}"),
+        ("parameter-list-item-Quantity", "Quantity1.234 m"),  # Rounded
+        ("parameter-list-item-list", "listlist"),
+        ("parameter-list-item-dict", "dictdict"),
+        ("parameter-list-item-paramList", "paramListParamList"),
+        ("parameter-list-item-paramDict", "paramDictParamDict"),
+        (
+            "parameter-list-item-struct",
+            f"structCustomStruct (Struct){DATE_DISPLAY_STR}",
+        ),
+        (
+            "parameter-list-item-param",
+            f"paramCustomParam (Param){DATE_DISPLAY_STR}",
+        ),
+    ],
+)
+def test_displays_param(page: Page, test_id: str, expected_text: str) -> None:
+    """Displays each type of parameter."""
+    expect(page.get_by_test_id(test_id)).to_have_text(expected_text)