Features
Start a free trial

Mobile Playwright Testing

Playwright offers experimental support for Android automation.

TestingBot provides a grid of remote Android devices and emulators. You can use Playwright scripts to automate Chrome for Android browsers and Android WebViews.

Copy code
npm i playwright-core
Copy code
const { _android } = require('playwright-core');

(async () => {
  const tbCapabilities = {
    browserName: 'chrome',
    platformName: 'Android',
    deviceName: 'Pixel 8',
    browserVersion: '14.0',
    key: process.env.TB_KEY,
    secret: process.env.TB_SECRET
  }
  const wsEndpoint = `wss://cloud.testingbot.com/playwright?capabilities=${encodeURIComponent(JSON.stringify(tbCapabilities))}`
  const device = await _android.connect(wsEndpoint)
  const context = await device.launchBrowser()
  const [ page ] = context.pages()
  await page.goto('https://testingbot.com')

  const resp = await page.evaluate(_ => {}, `testingbot_executor: ${JSON.stringify({action: 'setSessionStatus',arguments: {passed: true }})}`);
  await page.close()
  await context.close()
  await device.close()
})();

The example above will connect to a remote Pixel 8 device running Android 14. It will open the Chrome browser and navigate to TestingBot's homepage.

After running this test, a video together with logs will be available in the TestingBot member area.

Specify Android Device

You can specify a specific Android device with the deviceName and version capabilities.
These capabilities can target either Android emulators, or physical Android devices.

1. Select a Device Type
2. Select a Device Name
Copy code

We offer special parameters which you can use to allocate a device:

Regex Input Result
"Pixel.*" This will allocate any available Pixel device (phone)
"*" This will allocate a random available Android device
"Samsung [20-21]" This will allocate either an Samsung 20 or 21

Some Examples:

Copy code
// find any Samsung Galaxy, except 23
const tbCapabilities = {
    browserName: 'chrome',
    platformName: 'Android',
    deviceName: '^(Galaxy.*)(?!23)$',
}
// find any device which name starts with Pixel
const tbCapabilities = {
    browserName: 'chrome',
    platformName: 'Android',
    deviceName: 'Pixel.*',
}

Testing WebViews

Playwright can connect and automate Android WebViews. Please see the example below, where we use device.webView({ pkg: 'org.chromium.webview_shell' }).

Copy code
const { _android } = require('playwright-core');

(async () => {
  const tbCapabilities = {
    browserName: 'chrome',
    platformName: 'Android',
    deviceName: 'Pixel 8',
    browserVersion: '14.0',
    key: process.env.TB_KEY,
    secret: process.env.TB_SECRET
  }
  const wsEndpoint = `wss://cloud.testingbot.com/playwright?capabilities=${encodeURIComponent(JSON.stringify(tbCapabilities))}`
  const device = await _android.connect(wsEndpoint)
  const context = await device.launchBrowser()
  const [ page ] = context.pages()
  // Launch an application with WebView.
  await device.shell('am force-stop org.chromium.webview_shell');
  await device.shell('am start org.chromium.webview_shell/.WebViewBrowserActivity');
  // Get the WebView.
  const webview = await device.webView({ pkg: 'org.chromium.webview_shell' });

  // Fill the URL box.
  await device.fill({
    res: 'org.chromium.webview_shell:id/url_field',
  }, 'testingbot.com');
  await device.press({
    res: 'org.chromium.webview_shell:id/url_field',
  }, 'Enter');

  const page = await webview.page();
  await page.waitForNavigation({ url: /.*testingbot.*/ });
  console.log(await page.title());
  await page.close()
  await context.close()
  await device.close()
})();

Playwright Emulation

Playwright allows you to emulate specific devices, such as mobile phones or tablets. This is similar in functionality to other Devtools, where the viewport size is changed, together with the user-agent and other settings.

You can specify your own custom device configurations, where you can override the viewport size.

Create a file called playwright.config.js with the following contents:

Copy code
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  projects: [
    {
      name: 'chromium',
      use: {
        ...devices['Desktop Chrome'],
        viewport: { width: 1280, height: 720 }
      }
    },
    {
      name: 'Mobile Safari',
      use: {
        ...devices['iPhone 15']
      }
    }
  ]
});

You will also need to create a testingbot.config.js file, which will contain code to connect to the TestingBot Playwright server:

Copy code
export function getConnectWsEndpoint(userCapabilities) {
    const defaultCapabilities = {
        'tb:options': {
            key: process.env.TB_KEY,
            secret: process.env.TB_SECRET
        }
    }
    const capabilities = { ...defaultCapabilities, ...userCapabilities }
    const connectUrl = `wss://cloud.testingbot.com/playwright?capabilities=${encodeURIComponent(JSON.stringify(capabilities))}`
    return connectUrl
}

You can now include a sample Playwright test and run it on the TestingBot cloud.