Upload and play audio files

Introduction

Browserstack Automate enables you to upload audio files on remote Android devices and test various use cases, such as testing web apps that require access to microphone and audio output, linking the microphone to your web app, testing the microphone recording feature, etc.

In this guide, you will learn how to:

• Supported OS and devices
• Upload your audio files
• Set the Audio Injection capability
• Add Audio Injection logic

Supported OS and devices

Upload your audio files

Prior to starting the test execution, upload the audio files using media REST APIs.

curl -u "username:accesskey" -X POST "https://api-cloud.browserstack.com/automate/upload-media" -F "file=@/path/to/app/file/test.mp3"

The REST API returns a response media_url for each successful file upload.

{
    "media_url": "media://<hashedid>"
}

Set the Audio Injection capability

Use the capability values enableAudioInjection for W3C protocol and browserstack.enableAudioInjection for JSON wire protocol in your test scripts.

Example:

DesiredCapabilities capabilities = new DesiredCapabilities();
HashMap<String, Object> browserstackOptions = new HashMap<String, Object>();
// Ensure to use Android version 11 or above. Not passing an invalid version (below Android 11 or non-Android OS) drops the session.
browserstackOptions.put("osVersion", "12.0"); 
browserstackOptions.put("deviceName", "Samsung Galaxy S22");
browserstackOptions.put("enableAudioInjection", "true");
capabilities.setCapability("bstack:options", browserstackOptions);

var capabilities = {
	'bstack:options' : { 
			// Ensure to use Android version 11 or above. Not passing an invalid version (below Android 11 or non-Android OS) drops the session.
			"osVersion" : "12.0",
			"deviceName" : "Samsung Galaxy S22"
			"enableAudioInjection" : "true"
		}
}

Dictionary<string, object> browserstackOptions = new Dictionary<string, object>();
browserstackOptions.Add("enableAudioInjection", "true");
// Ensure to use Android version 11 or above. Not passing an invalid version (below Android 11 or non-Android OS) drops the session.
browserstackOptions.Add("osVersion", "12.0");
browserstackOptions.Add("deviceName", "Samsung Galaxy S22");
capabilities.AddAdditionalOption("bstack:options", browserstackOptions);

desired_cap = {
	'bstack:options' : {
		# Ensure to use Android version 11 or above. Not passing an invalid version (below Android 11 or non-Android OS) drops the session.
		"osVersion" : "12.0",
		"deviceName" : "Samsung Galaxy S22",
		"enableAudioInjection" : "true",
	},
}

capabilities = {
	'bstack:options' => {
		# Ensure to use Android version 11 or above. Not passing an invalid version (below Android 11 or non-Android OS) drops the session.
		"osVersion" => "12.0",
		"deviceName" => "Samsung Galaxy S22",
		"enableAudioInjection" => "true",
	},
}

DesiredCapabilities desiredCapabilities = new DesiredCapabilities();
desiredCapabilities.setCapability("browserstack.enableAudioInjection","true");
// Ensure to use Android version 11 or above. Passing an invalid version (below Android 11 or non-Android OS) drops the session.
caps.setCapability("os_version", "12.0");
caps.setCapability("device", "Samsung Galaxy S22");

var capabilities = {
	"browserstack.enableAudioInjection" : "true"
	// Ensure to use Android version 11 or above. Passing an invalid version (below Android 11 or non-Android OS) drops the session.
	"os_version" : "12.0",
	"device" : "Samsung Galaxy S22",
}

ChromeOptions capability = new ChromeOptions();
capability.AddAdditionalCapability("browserstack.enableAudioInjection", "true");
// Ensure to use Android version 11 or above. Passing an invalid version (below Android 11 or non-Android OS) drops the session.
capability.AddAdditionalCapability("os_version", "12.0");
capability.AddAdditionalCapability("device", "Samsung Galaxy S22");

desired_cap = {
	"browserstack.enableAudioInjection" = "true",
	# Ensure to use Android version 11 or above. Passing an invalid version (below Android 11 or non-Android OS) drops the session.
	"os_version" : "12.0",
	"device" : "Samsung Galaxy S22",
}

caps = Selenium::WebDriver::Remote::Capabilities.new
caps["browserstack.enableAudioInjection"] = "true"
# Ensure to use Android version 11 or above. Passing an invalid version (below Android 11 or non-Android OS) drops the session.
caps["os_version"] = "12.0"
caps["device"] = "Samsung Galaxy S22"

Add audio injection logic

The uploaded audio file is played on the remote device using custom JavaScript executors. Your test script must be modified to add these custom executors along with the logic to click the UI element that in the webapp that triggers the microphone and plays the audio in a specified order.

Ensure that the following order is maintained in your script:

1. Add the inject audio executor statement
2. Add framework logic to click a UI element
3. Add the start audio executor statement
4. Add the implicit wait to play complete audio
5. Add the stop audio executor statement

Inject audio

Specify the audio file to play during the test using the following custom executor. Set the audioUrl argument with the media_url you received on successful upload of the audio file.

driver.execute_script('browserstack_executor: {\"action\":\"injectAudio\", \"arguments\": {\"audioUrl\" : \"media://<hashedid>\"}}')

Add framework command to click UI element

Your script must include the logic to handle any permission-related popups that might be encountered. Check out Handle pop-ups, permissions, and notifications for more information.

Start audio

After you click the UI element, the device starts listening for input. Use the startAudio action to play the audio.

driver.execute_script('browserstack_executor: {\"action\":\"startAudio\"}')

Add the implicit wait to play complete audio

Ensure that you add the logic to add implicit waits in your script such that the stopAudio action occurs only after the complete audio is played.

Stop audio

Use the stopAudio action to stop the audio.

driver.execute_script("browserstack_executor: {\"action\":\"stopAudio\"}")