PRACTICE

Tabs Navigation

Switch between tabs using mouse or keyboard (Left/Right/Home/End). Persist selection in URL hash and localStorage.

Automation hooks: #tabs-page[data-active-tab-id], panels have data-active, selected tab stored in location.hash and localStorage key demo_active_tab.

Tab 1 Content

You are viewing Tab 1. Use this tab to practice assertions on visible content.

Tab 2 Content

You are viewing Tab 2. Switching tabs should update the active panel.

Tab 3 Content

You are viewing Tab 3. Try keyboard navigation: Left/Right arrows.

Active tab: Tab 1

Automation tips:

• Click tab-2 and assert panel-2 becomes visible while panel-1 is hidden.
• Use keyboard: ArrowRight/ArrowLeft/Home/End.
• Selection stored in location.hash (e.g. #tab-2) and localStorage key demo_active_tab.