Get started with Saucie CLI and make easier cross browser testing

README.md

You probably know that to do JavaScript testing is good and one of hurdles to overcome is how to test our code on different browsers. There’re some tools availables for helping us on hurdling this overcome. One of them is a CLI (command line) named saucie developed by igorlima. This CLI is a library hosted on NPM which allows integrate your frontend JavaScript tests with SauceLabs platform. SauceLabs makes awesome cross browser testing, and saucie makes easier that cross browser testing by CLI.

A great interactive JS Test Runner, the testem library, uses saucie on its examples and has the following jasmine sample tests:

hello.js

function hello(name){
    return “hello “ + (name || ‘world’);
}

hello_spec.js

describe(‘hello’, function(){
    it(‘should say hello’, function(){
        expect(hello()).toBe(‘hello world’);
    });
    it(‘should say hello to person’, function(){
        expect(hello(‘Bob’)).toBe(‘hello Bob’);
    });
});

Run these tests cross platforms step by step, need only few command lines, as described below:

1. First of all create your SauceLabs account
2. Make sure Sauce credentials are set as environment variables:

• SAUCE_USERNAME - your SauceLabs username
• SAUCE_ACCESS_KEY - your SauceLabs API/Access key.

3. After that set up, follow the scripts below:

• npm install -g testem saucie
• git clone git@github.com:airportyh/testem.git
• cd testem/
• git checkout tags/v0.7.1
• cd examples/saucelabs/

4. Keep that first terminal opened, open a second terminal and follow the script below:

• cd testem/examples/saucelabs/
• testem --port 8080

6. Go back to the first terminal and type:

• saucie --browserNameSL="internet explorer" --versionSL="7.0" --platformSL="Windows XP"
• saucie --browserNameSL="iphone" --versionSL="8.1" --platformSL="OS X 10.10" --deviceNameSL="iPad Simulator" --deviceOrientationSL="portrait"
• saucie --browserNameSL="android" --versionSL="4.1" --platformSL="Linux" --deviceNameSL="Motorola Atrix HD Emulator" --deviceOrientationSL="portrait"

Note 1: All platforms are listed here. How to know values for browserNameSL, versionSL and platformSL params? Check it here.

Note 2: If you’d like to use the default configuration just type testem ci --port 8080 and be happy.

Note 3: type saucie --help to get a help.

Note 4: testem.yml is a configuration file where specifies which JS framework to use. In this case, we are using JasmineJS.

Do you feel comfortable to watch a video instead? Go ahead and watch it.

<iframe src="http://showterm.io/bd7400428650f13e43eb6" width="640" height="480"></iframe>

Did you see? Just typing few command lines and everything was tested cross browsers. Now let’s go to SauceLabs and check the result on many browsers, including the mobile ones such as iOS and Android:

• iOS test video
• IE7 test video
• Android test video

Saucie still growing up to integrate other platforms like BrowserStack. New features coming soon. And these days it got various improvements from johanneswuerbach. He made several changes to use saucie in ember-cli-sauce, which is now used by htmlbars, the rendering engine used by emberjs.

Feel free to file issue and send pull requests and let’s become saucie even better. Thanks!