Acceptance Testing in HTML Client. Getting Started

    The test suite for HTML5 client is currently under active development. The following instructions will help you install all the necessary tools and libraries to run the exiting specs and start writing your own tests.

    Run Selenium Server

    Assuming that you installed HTML5 client already, you should have all npm packages including webdriver-manager installed at this stage. We use webdriver-manager tool to keep track of the latest Selenium Server and Chrome / Firefox WebDrivers.

    From the bigbluebutton/bigbluebutton-html5 run:

    $ ./node_modules/.bin/webdriver-manager update

    This command will download the latest versions of the WebDrivers and Selenium.

    Along with the Selenium and WebDrivers, you need to install the browsers itself.

    How to install Chrome:

    $ wget -q -O - | sudo apt-key add -
    $ sudo sh -c 'echo "deb [arch=amd64] stable main" >> /etc/apt/sources.list.d/google-chrome.list'
    $ sudo apt-get update
    $ sudo apt-get install google-chrome-stable

    How to install Firefox:

    $ sudo apt-get install firefox

    There are 3 browsers currently used in the test specs (multiremote mode): Chrome Stable/Mobile, Firefox Stable.

    In order to run headless browser, we will use Xvfb display server:

    $ sudo apt-get install xvfb

    At this point, you can run the Selenium server (from under bigbluebutton/bigbluebutton-html5):

    $ xvfb-run ./node_modules/.bin/webdriver-manager start

    If you get an error Xvfb failed to start, run it with an -a option (Xvfb will use another display if the current one is already in use):

    $ xvfb-run -a ./node_modules/.bin/webdriver-manager start

    Congratulations! You have Selenium server up and running. It is ready to handle your test cases. Now, keep the xvfb-run process running and continue in a new terminal session.

    Run the test specs

    We use WebdriverIO interface to write the acceptance test cases. In order to execute the existing tests, you need to use wdio test runner. By default, it will look into any *.spec.js file inside the /home/firstuser/dev/bigbluebutton/bigbluebutton-html5/tests/webdriverio/specs directory. You can change the location of the test specs by modifying the wdio config file: wdio.conf.js (inside the webdriverio directory).

    Before proceeding any further, make sure HTML5 client is up and running. Node.js installation is also required:

    $ sudo apt-get install nodejs-legacy

    You can run all of the existing test specs with a single npm command:

    $ cd /home/firstuser/dev/bigbluebutton/bigbluebutton-html5
    $ npm test

    Test suites

    To make it easier to run a single specific set of tests, we group the specs into test suits. All the suits are defined in wdio.conf.js.

    To run a single test suite, you need to pass its name to the npm script:

    $ npm test -- --suite login

    If you want to run a single spec (test file), --spec option can be used:

    $ npm test -- --spec ./tests/webdriverio/specs/login.spec.js

    Visual Regression

    Our test suite includes visual regression specs that can be execute separately with npm run test-visual-regression (desktop + mobile) or npm run test-visual-regression-desktop (desktop only). It will take screenshots of various views and components of the client, save them inside the /screenshots folder and put the failed cases into /screenshots/diff. The pictures will be put into subfolders sorted by browser name and screen resolution. By default, we use desktop Firefox, desktop Chrome and mobile Chrome (via mobile emulation). The screenshots are taken in 960x1200 and 1920x1200 resolutions.

    The pictures inside /screenshots/reference are reference images the test runner uses to detect potential visual regressions. If there’s a big UI change in the client, the images can be regenerated any time using npm run generate-refs-visual-regression or npm run generate-refs-visual-regression-desktop.