Shopping Admin Browser Automation Agent Skill

Shopping Admin Browser Automation Skill

This skill is based on Playwright MCP tools, providing automation capabilities for Magento Admin panel.

Core Concepts

In admin panel automation, we distinguish two types of operations:

• Skill: Meaningful combinations of multiple tool calls, encapsulated as independent Python scripts
• Basic Tools: Single function calls used for atomic operations.

I. Skills

1. Admin Login

Use Cases:

• Login to Magento Admin panel at the start of admin tasks
• Authenticate with admin credentials

Prerequisites:

• Get ref values for form fields

Usage:

# Usage:
#   python admin_login.py <admin_url> <username> <password> <username_ref> <password_ref> <signin_ref>
# Example:
python admin_login.py http://localhost:7780/admin admin admin1234 e15 e20 e23

2. Create Customer

Use Cases:

• Create a new customer after clicking "Add New Customer" button
• Add customers to specific customer groups

Usage:

# Usage:
#   python create_customer.py <first_name> <last_name> <email> <group> <group_ref> <fname_ref> <lname_ref> <email_ref> <save_btn_ref>
# Example:
python create_customer.py "Isabella" "Romano" "[email protected]" "Premium Europe" e92 e112 e124 e136 e61

II. Basic Tools (When to Use Single Functions)

Below are the basic tool functions and their use cases. These are atomic operations for flexible combination.

Note: Code should be written without line breaks.

How to Run

# Standard format (browser persists across calls)
python run_browser_ops.py -c "await browser.navigate('http://localhost:7780/admin')"

Navigation Tools

navigate(url: str)

Use Cases:

• Open admin panel URL
• Navigate to specific admin pages

Example:

python run_browser_ops.py -c "await browser.navigate('http://localhost:7780/admin')"

navigate_back()

Use Cases:

• Go back to previous page
• Return to list page after viewing details

Example:

python run_browser_ops.py -c "await browser.navigate_back()"

Interaction Tools

click(ref: str, element: Optional[str] = None)

Use Cases (very broad):

• Click navigation menu items (Customers, Marketing, Reports, etc.)
• Click submenu links (All Customers, Customer Groups, Search Terms, etc.)
• Click action buttons (Add New, Save, Search, Reset Filter)
• Click table rows for details

Example:

# Click Customers menu
python run_browser_ops.py -c "await browser.click(ref='e17', element='Customers menu')"

# Click All Customers link
python run_browser_ops.py -c "await browser.click(ref='e182', element='All Customers link')"

type_text(ref: str, text: str, element: Optional[str] = None)

Use Cases:

• Enter text in form fields
• Fill filter inputs
• Enter search terms

Example:

# Enter username
python run_browser_ops.py -c "await browser.type_text(ref='e15', text='admin', element='Username textbox')"

# Enter filter value
python run_browser_ops.py -c "await browser.type_text(ref='e109', text='tank', element='Search Query filter input')"

select_option(ref: str, element_desc: str, value: str)

Use Cases:

• Select dropdown values (Customer Group, Status filter, Store View)
• Select options in forms

Example:

# Select customer group
python run_browser_ops.py -c "await browser.select_option(ref='e92', element_desc='Group select', value='Premium Europe')"

# Select status filter
python run_browser_ops.py -c "await browser.select_option(ref='e124', element_desc='Status filter combobox', value='Subscribed')"

press_key(key: str)

Use Cases:

• Submit forms (press Enter)
• Close dialogs (press Escape)

Example:

python run_browser_ops.py -c "await browser.press_key('Enter')"

Page State Tools

snapshot()

Use Cases (very important):

• When unsure about current page state
• Need to view complete page content to decide next action
• Verify if operation was successful
• Find ref references for specific elements

Example:

python run_browser_ops.py -c "await browser.snapshot()"

Best Practices:

• Use snapshot before and after critical operations to confirm state
• Use snapshot after navigation to find element refs
• Use snapshot to verify data in tables and grids

Tab Management

list_tabs()

Use Cases:

• View all currently open tabs
• Get tab ID

tab_new(url: Optional[str] = None)

Use Cases:

• Open admin section in new tab
• Compare data across multiple pages

Example:

python run_browser_ops.py -c "await browser.tab_new(url='http://localhost:7780/admin/customer/index/')"

III. Best Practice Recommendations

Make Good Use of snapshot()

Use snapshot() in the following situations:

• Just entered a new page, unsure about page structure
• After executing an operation, need to verify results
• Need to find ref references for elements
• Unsure about current state of filters or grids

Usage Principles

• Start with admin_login.py: Most admin tasks require authentication first
• Use snapshot() liberally: Admin pages have complex structures, verify state
• Use basic tools for dynamic refs: Element refs may change, use snapshot to find current refs