Tabs are common UI patterns for organizing content. Learn how to extract tab information, identify active tabs, and navigate between them.

Basic Tab Extraction

from askui import VisionAgent, ResponseSchemaBase
from typing import List

class Tab(ResponseSchemaBase):
    name: List[str]
    active: bool

class TabBar(ResponseSchemaBase):
    tabs: List[Tab]

with VisionAgent() as agent:
    agent.tools.webbrowser.open_new("http://docs.askui.com")
    agent.wait(3)  # Wait for page to load

    result = agent.get("Can you extract me the tabs?", response_schema=TabBar)
    print(result.model_dump_json(indent=2))

Best Practices

  1. Handle Dynamic Tabs: Some applications add/remove tabs dynamically

    initial_tabs = agent.get("How many tabs are there?", response_schema=int)
    
    # After some action
    agent.click("Add new tab")
    
    new_tab_count = agent.get("How many tabs are there?", response_schema=int)
    assert new_tab_count == initial_tabs + 1
    
  2. Tab Loading States: Wait for tab content to load

    agent.click("Click on Data tab")
    
    # Wait for content
    content_loaded = False
    for _ in range(10):  # Timeout after 10 attempts
        content_loaded = agent.get(
            "Is the tab content fully loaded?", 
            response_schema=bool
        )
        if content_loaded:
            break
        agent.wait(1)
    
  3. Keyboard Navigation: Some tab interfaces support keyboard navigation

    # Use keyboard shortcuts for tab navigation
    agent.key("Ctrl+Tab")  # Next tab
    agent.key("Ctrl+Shift+Tab")  # Previous tab