VSCode-Latte

VSCode-Latte is a comprehensive testing productivity extension designed specifically for the web-tests project, providing an integrated testing workflow and enhanced development experience.

✨ Features

🚀 Test Execution

• Quick Run & Debug: Execute test cases directly from tree view or CodeLens
• Tree View Explorer: Browse and manage test cases with intuitive file structure
• Environment Switching: Seamlessly switch between different testing environments
• Customizable Args: Configure test execution arguments (screenshots, retry count, chrome extension, etc.)

🎨 Log Enhancement

• Colorized Logs: Auto-highlight terminal output with customizable patterns (error, warning, success, step, assert, etc.)
• Output Channel: View logs in VSCode's native Output panel (View → Output → Latte)
• Log Navigation: Jump to specific log lines from error messages
• Pattern Matching: Extract account information and test results with regex

🔗 TestIt Integration

• Branch Selection: Switch between TestIt test case branches
• Quick Creation: Create new test cases from templates
• Pseudo Test Set: Generate test data sets for testdata.json files

📊 Jira Integration

• Upload Logs: Attach test logs to Jira issues with one click
• Account Results: View and manage generated test accounts
• Auto-Delete Control: Disable automatic account deletion when needed

💻 Development Tools

• Status Bar Info: Display current environment and TestIt branch in status bar
• Context Menus: Quick access to commands from Explorer and Editor
• Configuration Management: Centralized settings for test execution and log colorization

Smart Inference

• Smart Hover: Hover over methods to display method signatures and definition locations
• Jump to Definition: Cmd+Click to jump to method definitions in test-framework/@testring
• Auto Recognition: Automatically recognizes call patterns like account.PAS.readVoiceStateBasedRule, SW.click(), etc.
• Fast Caching: Caches lookup results to improve performance
• Refresh Cache: Press Cmd+Shift+P, then select Smart Inference: Refresh test-framework Paths

📦 Installation

1. Download the latest .vsix file from releases
2. In VSCode: Extensions → ⋯ → Install from VSIX
3. Reload VSCode to activate

⚙️ Configuration

Key settings available in VSCode Settings (search "Latte"):

Extension Activation (Automatic)

The extension automatically activates when it detects a web-tests project in your workspace.

Detection Criteria:

• Primary: Workspace contains .latte/config.json file
• Secondary: Workspace contains both .testringrc.js AND configs/ directory

Scanning Behavior:

• Scans up to 3 directory levels deep
• Automatically excludes common directories (node_modules, .git, dist, etc.)
• Times out after 10 seconds if detection takes too long

Manual Retry: If activation doesn't work, use command Latte: Retry Workspace Detection

Test Execution

{
  "latte.base.path": "",              // web-tests root path (default: workspace root)
  "latte.environment": "default",      // Current test environment
  "latte.testit.branchName": "Master", // TestIt branch name
  "latte.runner.showTreeView": true,   // Show test cases in tree view
  "latte.runner.args": [               // Test execution arguments
    "--config", ".testringrc.js",
    "--screenshots", "disable",
    "--retry-count", "0"
  ]
}

🎨 Log Colorization

Customize log highlighting patterns in settings:

{
  "latte.colorize": {
    "error": {
      "pattern": "(\\[error|ERROR\\]|Error:.*)",
      "ansiCodes": "\\x1b[31m"  // Red
    },
    "success": {
      "pattern": "(success|Test passed)",
      "ansiCodes": "\\x1b[32m"  // Green
    }
    // ... more patterns
  }
}

📝 Usage

Running Tests

1. Open a web-tests project
2. Select environment using the toolbar icon or command palette
3. Navigate to test files in the "LATTE RUNNER" tree view
4. Click ▶️ Run or 🐞 Debug icon next to test cases

Creating Test Cases

1. Right-click in Explorer
2. Select "Testit: Create Test Case"
3. Follow the prompts to generate test structure

Viewing Logs

• Terminal: Colorized output in integrated terminal
• Output Panel: View → Output → Select "Latte"
• Account Results: Check "Latte Account Result" panel for generated accounts

🔍 Troubleshooting

Extension Not Activating?

1. Check workspace type: Verify your project contains .latte/config.json or both .testringrc.js + configs/ directory
2. View logs: Open Output panel (View → Output → "Latte") to see activation details
3. Reload window: Use Developer: Reload Window after making changes

No Latte Commands Visible?

• Extension only shows commands in web-tests projects
• This is intentional to avoid cluttering non-testing workspaces
• Verify detection criteria above

Nested Projects (Monorepo)?

• Extension scans up to 3 levels deep automatically
• Large nested structures are handled efficiently
• Check logs to see scanning progress (View → Output → "Latte")

⚠️ Important Notes

For zsh users: If you use colorful zsh themes (e.g., "agnoster"), add this to your .zshrc:

if [[ "$PWD" == *web-tests* && "$TERM_PROGRAM" == "vscode" ]]; then
  ZSH_THEME=""
else
  ZSH_THEME="agnoster"
fi

This prevents theme color codes from interfering with Latte's log colorization.

🔧 Commands

Access via Command Palette (Ctrl+Shift+P / Cmd+Shift+P):

• Latte: Select Environment - Choose test environment
• Latte: Select Test Case Branch - Switch TestIt branch
• Testit: Create Test Case - Generate new test case
• Testit: Pseudo Test Set - Create test data sets
• Latte: Upload to Jira - Upload test results to Jira

📄 License

MIT License

🔄 Recent Updates

See CHANGELOG.md for detailed version history.