How to run Protractor tests for a video conference web application

Some tricks you need to know

Automated tests of appear.in service running on Chrome and Firefox at the same time

When talking about test automation for web applications, we know (or at least we should know) that tests need to run in different browsers, such as Chrome, Firefox, or even on a mobile’s browser.

When talking specifically about test automation for video conference web applications, there is a bit more we need to know, such as how to simulate camera and microphone devices, since ideally our tests will be run via a CI system and a camera and mic will be unavailable.

Both Chrome and Firefox browsers provide us with the capability of having a fake media stream device and a way to disable the need for manually allowing the browser to access the camera and microphone devices, and this is what I want to show you in this blog post.

Protractor configuration for Chrome using a fake camera and mic

To simulate a fake media device on Chrome, add the following to your protractor.conf.js file:

capabilities: {"browserName": "chrome", "chromeOptions": {"args": ["--use-fake-ui-media-stream", "--use-fake-device-for-media-stream"]}}

  • "--use-fake-device-for-media-stream" will make use of a fake device for the media stream to replace actual camera and microphone
  • "--use-fake-ui-for-media-stream" will bypass the media stream infobar by selecting the default device for media streams

Protractor configuration for Firefox using a fake camera and mic

To simulate a fake media device on Firefox, add the following to your protractor.conf.js file:

capabilities: {"browserName": "firefox", "marionette": true, "moz:firefoxOptions": {"prefs": {"media.navigator.streams.fake": true, "media.navigator.permission.disabled": true}}}

  • Marionette is the new driver that is shipped/included with Firefox. This driver has its own protocol which is not directly compatible with the Selenium/WebDriver protocol. For running tests on Firefox using the latest versions of Protractor you will need to set "marionette": true
  • "media.navigator.streams.fake": true will make use of a fake device for the media stream to replace actual camera and microphone
  • "media.navigator.permission.disabled": true will bypass the media stream infobar by selecting the default device for media streams

That’s it! By adding these capabilities to your Protractor configuration file you can run automated tests during continuous integration on servers without the need of a real camera and microphone.

I hope this post was helpful. Good tests!