Set up authentication

Set environment variables for BrowserStack credentials:

# Set these values in your ~/.zprofile (zsh) or ~/.profile (bash)
export BROWSERSTACK_USERNAME=YOUR_BROWSERSTACK_USERNAME
export BROWSERSTACK_ACCESS_KEY=YOUR_BROWSERSTACK_ACCESSKEY

It is recommended that you store your credentials as environment variables and use those environment variables in your test script.

Connect CDP Endpoint

Connect to the CDP endpoint at BrowserStack as shown in the following example:

def run_session(playwright):
  clientPlaywrightVersion = str(subprocess.getoutput('playwright --version')).strip().split(" ")[1]
  desired_cap['client.playwrightVersion'] = clientPlaywrightVersion
  cdpUrl = 'wss://hub-ft.browserstack.com/playwright?caps=' + urllib.parse.quote(json.dumps(desired_cap))
  browser = playwright.chromium.connect(cdpUrl)
  page = browser.new_page()

Update your test cases to read BrowserStack credentials from environment variables. Update the selenium hub URL to the BrowserStack remote hub URL: wss://hub-ft.browserstack.com/playwright

Migrate your test cases

After you have set up authentication in your test scripts, add configurations like browser-OS combinations and desired test statuses. For initial migration, run your build using Chrome or Firefox to isolate issues and simplify debugging. After achieving stability, expand to cross-browser testing.

//Add the following options to your test script
 "environments": [
    {
        "os": "Windows",
        "name": "Test on Chrome latest on Windows",
        "browser": "chrome",
        "browser_version": latest
    },
 ]

Organize tests

Use the following capabilities for naming your tests and builds. This ensures effective debugging, test reporting, and build execution time analysis.

"capabilities": {
    "projectName": "Pytest Browserstack",
    "buildName": "browserstack-build-parallel",
  },

• Use a new buildName name every time you run your test cases. This ensures that sessions are logically grouped under a unique build name and helps you monitor the health of your test suite effectively.
  
  
• A build can only have a maximum of 1000 tests and post that a new build gets created with a -1 suffixed to the original build name.

Mark test as Passed or Failed

To mark whether your test has passed or failed on BrowserStack, use the JavaScript executor in your test script. You can mark a test as passed or failed based on your test assertions.

The arguments passed in the JavaScript method for setting the status and the corresponding reason of the test are status and reason:

• status accepts either passed or failed as the value.
• reason accepts a string value.

def mark_test_status(status, reason, page):
    page.evaluate("_ => {}",
                  "browserstack_executor: {\"action\": \"setSessionStatus\", \"arguments\": {\"status\":\"" + status + "\", \"reason\": \"" + reason + "\"}}");
def log_contextual_info(desc, loglevel, page):
    page.evaluate("_ => {}",
                  "browserstack_executor: {\"action\": \"annotate\", \"arguments\": {\"data\":\"" + desc + "\", \"level\": \"" + loglevel + "\"}}");

Set up debugging capabilities

1. Enable visual logs and automatic screenshot capture at every selenium command by setting the debug capability.
2. By default, Console Logs with log level errors are enabled. Utilize the consoleLogs capability to enable various log levels, including warnings, info, verbose, errors, and disable.

"capabilities": {
        "debug": "true",
        "consoleLogs": "info",
    },