Support & information center

Twilio Video React App is an open source application provided by Twilio as a reference to those developing video based application. The code is maintained on github (here).

If you are using this as a starting point, then the script below is a great way to introduce testing automation to the Twilio Video React framework you are using.

Preparation

Deploy the Twilio application as explained on the github page of the project.

Out of the box, you should get something like this in terms of user experience:

Using the test script

In testRTC, create a new test script:

1. Copy the code from the bottom of this article to your test script (or use the existing sample in your account)
2. Decide the number of probes you want to use
   1. 2 Concurrent probes will be good starting point
   2. Set the Session size to the number of concurrent probes for this sample
3. Replace the Service URL of the script with the URL where your Twilio Video React App server is installed

Test execution

Run the script. It does everything for you.

If you want, you can join the same room from your browser once you see the URL in the progress messages of the test.

Test script code

var agentName = process.env.RTC_AGENT_NAME;
var agentSession = Number(process.env.RTC_SESSION_IDX);
var agentSessionName = process.env.RTC_SESSION_NAME;
var agentNumber = process.env.RTC_AGENT_NUM;

var sec = 1000;
var roomUrl = process.env.RTC_SERVICE_URL;

client
    .pause(agentNumber * 500);

client
    .rtcInfo("testRTC agent start - agent: %s room: %s", agentName, roomUrl)
    .url(roomUrl)
    .waitForElementVisible('#input-user-name', 120 * sec)
    .pause(300) //wait for page render 
    .setValue('#input-user-name', agentName.replace(/-/g, ''))
    .pause(300)
    .setValue('#input-room-name', agentSessionName.replace(/-/g, ''))
    .click(".MuiButtonBase-root.MuiButton-root")
    .pause(5000)

    .useXpath()
    .waitForElementVisible("//*[text()='Join Now']", 120 * sec)
    .pause(300)
    .click("//*[text()='Join Now']")
    .rtcProgress("In  " + roomUrl)

    // Give some time to collect media stats
    .pause(60 * sec)
    .rtcScreenshot('mid-call')
    .pause(60 * sec);Code language: JavaScript (javascript)