Enhance testing framework and UI feedback

- Updated architecture documentation to include details on UI rendering checks and Playwright end-to-end tests.
- Revised testing documentation to specify Playwright for frontend E2E tests and added details on running tests.
- Implemented feedback mechanism in scenario form for successful creation notifications.
- Added feedback div in ScenarioForm.html for user notifications.
- Created new fixtures for Playwright tests to manage server and browser instances.
- Developed comprehensive E2E tests for consumption, costs, equipment, maintenance, production, and scenarios.
- Added smoke tests to verify UI page loading and form submissions.
- Enhanced unit tests for simulation and validation, including new tests for report generation and validation errors.
- Created new test files for router validation to ensure consistent error handling.
- Established a new test suite for UI routes to validate dashboard and reporting functionalities.
- Implemented validation tests to ensure proper handling of JSON payloads.

tests/e2e/test_costs.py

@@ -0,0 +1,58 @@
+from uuid import uuid4
+
+from playwright.sync_api import Page, expect
+
+
+def test_costs_form_loads(page: Page):
+    """Verify the costs form page loads correctly."""
+    page.goto("/ui/costs")
+    expect(page).to_have_title("CalMiner Costs")
+    expect(page.locator("h1")).to_have_text("Costs")
+
+
+def test_create_capex_and_opex_items(page: Page):
+    """Test creating new CAPEX and OPEX items through the UI."""
+    # First, create a scenario to associate the costs with.
+    page.goto("/ui/scenarios")
+    scenario_name = f"Cost Test Scenario {uuid4()}"
+    page.fill("input[name='name']", scenario_name)
+    page.click("button[type='submit']")
+    with page.expect_response("**/api/scenarios/"):
+        pass  # Wait for the scenario to be created
+
+    # Now, navigate to the costs page and add CAPEX and OPEX items.
+    page.goto("/ui/costs")
+
+    # Create a CAPEX item.
+    capex_desc = "Initial drilling equipment"
+    page.select_option("select[name='scenario_id']", label=scenario_name)
+    page.fill("input[name='description']", capex_desc)
+    page.fill("input[name='amount']", "150000")
+    page.click("#capex-form button[type='submit']")
+
+    with page.expect_response("**/api/costs/capex") as response_info:
+        pass
+    assert response_info.value.status == 200
+
+    # Create an OPEX item.
+    opex_desc = "Monthly fuel costs"
+    page.select_option("select[name='scenario_id']", label=scenario_name)
+    page.fill("input[name='description']", opex_desc)
+    page.fill("input[name='amount']", "25000")
+    page.click("#opex-form button[type='submit']")
+
+    with page.expect_response("**/api/costs/opex") as response_info:
+        pass
+    assert response_info.value.status == 200
+
+    # Verify the new items appear in their respective tables.
+    expect(page.locator(
+        f"#capex-table tr:has-text('{capex_desc}')")).to_be_visible()
+    expect(page.locator(
+        f"#opex-table tr:has-text('{opex_desc}')")).to_be_visible()
+
+    # Verify the feedback messages.
+    expect(page.locator("#capex-feedback")
+           ).to_have_text("Entry saved successfully.")
+    expect(page.locator("#opex-feedback")
+           ).to_have_text("Entry saved successfully.")