Overview

Browser Code Execution allows you to run custom JavaScript code directly in the browser context. This is useful for advanced interactions, custom validations, or accessing browser APIs that aren’t covered by standard steps.

Usage

Provide the JavaScript code you want to execute in the browser:

step input: "document.querySelector('h1').textContent"

Common Use Cases

Getting Element Properties

// Get the current page title
document.title

// Check if an element is visible
window.getComputedStyle(document.querySelector('.modal')).display !== 'none'

// Get the value of a custom attribute
document.querySelector('[data-testid="price"]').dataset.value

Browser API Access

// Get current URL
window.location.href

// Access local storage
localStorage.getItem('userToken')

// Get viewport dimensions
JSON.stringify({width: window.innerWidth, height: window.innerHeight})

Custom Calculations

// Calculate total from multiple elements
Array.from(document.querySelectorAll('.price')).reduce((sum, el) => 
  sum + parseFloat(el.textContent.replace('$', '')), 0
)

Return Values

The step returns the result of the JavaScript execution:

  • Success: Returns the actual result of the code execution
  • Error: Returns syntax or runtime error details

Best Practices

  1. Keep it Simple: Use for cases where standard steps aren’t sufficient
  2. Handle Errors: Consider that elements might not exist
  3. Return Values: Ensure your code returns meaningful data
  4. Test First: Verify your JavaScript works in the browser console