---
title: "Persist a detail tab through its URL state"
description: "Verify selecting a detail tab updates the documented route state and that reloading or returning through history restores the same content panel."
canonical_url: "https://vostride.com/agent-library/navigation-routing/tab-query-persistence.md"
md_url: "https://vostride.com/agent-library/navigation-routing/tab-query-persistence.md"
content_kind: "recipe"
topic: "navigation-routing"
---

# Persist a detail tab through its URL state

Verify selecting a detail tab updates the documented route state and that reloading or returning through history restores the same content panel.

## Risk

Tab highlighting can disagree with the actual panel or disappear after reload when route state is incomplete. Use panels with distinct prepared content to verify the selected state semantically.

## Fixtures

- A test project detail has Overview, Activity, and Members tabs with different fixture-only markers.
- The product contract encodes the selected tab in a query parameter and honors it on direct loading.
- The Activity panel includes event QA route activity, and Members includes user QA route member.

## Steps

1. Open the project detail and verify Overview is initially selected with its fixture summary.
2. Choose Activity and verify its tab is selected, QA route activity appears, and the route query reflects the product-defined activity value.
3. Reload and verify Activity remains selected with the same event visible.
4. Choose Members and verify QA route member appears while the Activity panel is no longer active.
5. Use browser Back and verify both the route state and rendered panel return to Activity, then directly reopen the recorded Activity URL and verify it again.

## Expected results

- The selected tab, route parameter, and visible panel content agree after each transition.
- Reloading and direct opening honor the documented selected-tab state.
- History navigation restores the preceding tab without leaving two active content panels.

## False-pass traps

- A selected tab underline alone cannot prove the correct content panel rendered.
- A query parameter visible in the URL can be ignored by the application after reload.

## Cleanup

- Delete the test project or its fixture activity and member association.

## Use with agent-qa

Adapt this test design to your application's acceptance criteria and configured target using the [recipe execution guide](/agent-library/software-factory/turn-a-recipe-into-an-agent-qa-test.md). External fixture setup and non-UI checks require your own supported hooks or test tooling. Validate the authored test, execute it, and inspect the completed evidence; this recipe is not a recorded test result.

## References

- [agent-qa test](/docs/agent-qa/configuration/test.md)
- [agent-qa first test](/docs/agent-qa/guides/first-test.md)
- [agent-qa web testing](/docs/agent-qa/guides/web-testing.md)

- [Navigation and routing QA recipes](/agent-library/navigation-routing.md)
- [Software factory QA library](/agent-library.md)