test(web): fix 6 settings-panel e2e strict-locator failures (Issue #2)

The panel works live; the tests' locators were wrong. Each provider row renders
ALL THREE auth-kind control divs (api_key / bedrock_bearer / local_keyless),
x-show-hidden but present in the DOM, and every row has its own .key-ok /
.key-error status spans. So:
- unscoped input[type=password] / "Test & save" matched a visible control AND a
  hidden one -> strict-mode violation;
- page.wait_for_selector(".provider-row .key-ok") matched all 3 rows and waited
  on the first (openai's), which never becomes visible -> timeout.

Fix (selectors only, panel untouched, per handoff):
- scope inputs/buttons with :visible;
- assert "no VISIBLE password input" for Ollama (hidden ones legitimately exist);
- wait on the acted-on row's own .key-ok/.key-error via row.locator(...).wait_for.

All 8 settings-panel e2e tests pass (was 6 failed / 2 passed).

Author: taylaand

packages/studyloop/tests/test_web_settings_panel_e2e.py

@@ -180,25 +180,31 @@ def test_api_key_row_shows_password_input(self, page: Page) -> None:
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "OpenAI")
-        assert row.locator("input[type='password']").is_visible()
-        assert row.locator("button:has-text('Test & save')").is_visible()
+        # Every provider row renders all three auth-kind control divs (x-show
+        # hides the inactive ones but they stay in the DOM), so an unscoped
+        # input[type=password] matches the api_key AND the hidden bedrock_bearer
+        # input. Scope to the visible control to avoid the strict-mode collision.
+        assert row.locator("input[type='password']:visible").is_visible()
+        assert row.locator("button:visible:has-text('Test & save')").is_visible()
 
     def test_bedrock_row_shows_bearer_input_and_hint(self, page: Page) -> None:
         _route_providers(page)
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "AWS Bedrock")
-        assert row.locator("input[type='password']").is_visible()
+        assert row.locator("input[type='password']:visible").is_visible()
         assert "AWS_BEARER_TOKEN_BEDROCK" in row.inner_text()
 
     def test_ollama_row_shows_url_input_not_password(self, page: Page) -> None:
         _route_providers(page)
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "Ollama (local)")
-        assert row.locator("input[type='text']").is_visible()
-        assert row.locator("input[type='password']").count() == 0
-        assert row.locator("button:has-text('Test connection')").is_visible()
+        assert row.locator("input[type='text']:visible").is_visible()
+        # Hidden api_key/bedrock password inputs still exist in the DOM (x-show);
+        # assert no VISIBLE password input rather than none in the DOM.
+        assert row.locator("input[type='password']:visible").count() == 0
+        assert row.locator("button:visible:has-text('Test connection')").is_visible()
 
 
 class TestSaveKeyFlow:
@@ -216,11 +222,11 @@ def handle_post(route):
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "OpenAI")
-        row.locator("input[type='password']").fill("sk-test-123")
-        row.locator("button:has-text('Test & save')").click()
-        page.wait_for_function(
-            "() => !!document.querySelector('.provider-row .key-ok')", timeout=3000
-        )
+        row.locator("input[type='password']:visible").fill("sk-test-123")
+        row.locator("button:visible:has-text('Test & save')").click()
+        # Wait for THIS row's success marker to become visible (every row has a
+        # .key-ok element; only the acted-on row's is shown via x-show).
+        row.locator(".key-ok").wait_for(state="visible", timeout=3000)
         assert posted["body"] == {"provider": "openai", "key": "sk-test-123"}
 
 
@@ -238,8 +244,8 @@ def test_ollama_test_success_shows_ok(self, page: Page) -> None:
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "Ollama (local)")
-        row.locator("button:has-text('Test connection')").click()
-        page.wait_for_selector(".provider-row .key-ok", state="visible", timeout=3000)
+        row.locator("button:visible:has-text('Test connection')").click()
+        row.locator(".key-ok").wait_for(state="visible", timeout=5000)
         assert "3 cards" in row.inner_text()
 
     def test_ollama_test_failure_shows_error(self, page: Page) -> None:
@@ -255,6 +261,6 @@ def test_ollama_test_failure_shows_error(self, page: Page) -> None:
         _goto_settings(page)
         _wait_rows(page)
         row = _row(page, "Ollama (local)")
-        row.locator("button:has-text('Test connection')").click()
-        page.wait_for_selector(".provider-row .key-error", state="visible", timeout=3000)
+        row.locator("button:visible:has-text('Test connection')").click()
+        row.locator(".key-error").wait_for(state="visible", timeout=5000)
         assert "unreachable" in row.inner_text()