Selenium/Explanation/Stack

From MediaWiki.org
< Selenium‎ | Explanation(Redirected from Selenium/Stack)
Jump to navigation Jump to search

This page explains stack from Selenium/Node.js/Simple page. This tutorial will assume that you are running tests from your machine, targeting beta cluster. Code from this page is available at mediawiki-selenium-nodejs repository. For more examples see Selenium/Node.js#examples.

Examples will:

  • open browser
  • go to main page
  • check that Log in link is present
  • close browser

WebdriverIO[edit]

Reasons for selecting WebdriverIO:

Stack[edit]

For more information about the stack see Selenium/Stack.

Language JavaScript/Node.js
Browser Chrome
Selenium/WebDriver WebdriverIO (web, API, package)
Testing framework N/A
Assertion library N/A
Page object N/A

Advantages[edit]

  • Minimal stack.

Disadvantages[edit]

  • No assertions.
  • No testing framework (setup, teardown, reporting...).
  • No page object pattern.

Code[edit]

webdriverio.js

var webdriverio = require( 'webdriverio' ),
	options = { desiredCapabilities: { browserName: 'chrome' } },
	client = webdriverio.remote( options );

client
	.init()
	.url( 'https://en.wikipedia.beta.wmflabs.org/wiki/Main_Page' )
	.isVisible( 'li#pt-login a' ).then( function( visible ) {
		console.log( 'Log in link visible: ' + visible );
	} )
	.end();

Output[edit]

Start Chromedriver in one terminal tab or window and run the tests in another one.

$ chromedriver --url-base=/wd/hub --port=4444

Everything is fine.

$ node webdriverio.js
Log in link visible: true

There is a problem.

$ node webdriverio.js
Log in link visible: false

Mocha[edit]

Stack[edit]

Language JavaScript/Node.js
Browser Chrome
Selenium/WebDriver WebdriverIO (web, API, package)
Testing framework Mocha
Assertion library N/A
Page object N/A

Advantages[edit]

  • Testing framework (setup, teardown, reporting...).

Disadvantages[edit]

  • No assertions.
  • No page object pattern.

Code[edit]

mocha.js

describe( 'Main page', function () {
	it( 'should have "Log in" link', function () {
		browser.url( '/Main_Page' );
		console.log( 'Log in link visible: ' + browser.isVisible( 'li#pt-login a' ) );  // eslint-disable-line no-console
	} );
} );

Output[edit]

Start Chromedriver in one terminal tab or window and run the tests in another one.

$ chromedriver --url-base=/wd/hub --port=4444

Everything is fine.

$ ./node_modules/.bin/wdio --spec webdriverio/stack/mocha.js 
Log in link visible: true1 passing (3.00s)

There is a problem.

$ ./node_modules/.bin/wdio --spec webdriverio/stack/mocha.js 
Log in link visible: false1 passing (3.00s)

Assert[edit]

Stack[edit]

Language JavaScript/Node.js
Browser Chrome
Selenium/WebDriver WebdriverIO (web, API, package)
Testing framework Mocha
Assertion library Assert (ships with Node.js)
Page object N/A

Advantages[edit]

  • Testing framework (setup, teardown, reporting...).
  • Assertions.

Disadvantages[edit]

  • No page object pattern.

Code[edit]

assert.js

const assert = require( 'assert' );
describe( 'Main page', function () {
	it( 'should have "Log in" link', function () {
		browser.url( '/Main_Page' );
		assert( browser.isVisible( 'li#pt-login a' ) );
	} );
} );

Output[edit]

Start Chromedriver in one terminal tab or window and run the tests in another one.

$ chromedriver --url-base=/wd/hub --port=4444

Everything is fine.

$ ./node_modules/.bin/wdio --spec webdriverio/stack/assert.js 
․
1 passing (3.10s)

There is a problem.

$ ./node_modules/.bin/wdio --spec webdriverio/stack/assert.js 

F

0 passing (3.10s)
1 failing

1) Main page should have "Log in" link:
false == true
running chrome
AssertionError: false == true
...

Page object[edit]

Stack[edit]

Language JavaScript/Node.js
Browser Chrome
Selenium/WebDriver WebdriverIO (web, API, package)
Testing framework Mocha
Assertion library Assert (ships with Node.js)
Page object WebdriverIO Page Object Pattern

Advantages[edit]

  • Testing framework (setup, teardown, reporting...).
  • Assertions.
  • Page object pattern.

Disadvantages[edit]

  • Several new tools to learn.

Code[edit]

wdio.conf.js

exports.config = {
	baseUrl: 'https://en.wikipedia.beta.wmflabs.org/wiki'
};

pageobjects/page.js

class Page {
	constructor() {
		this.title = 'My Page';
	}
	open( path ) {
		browser.url( '/' + path );
	}
}
module.exports = Page;

pageobjects/main.page.js

const Page = require( './page' );

class MainPage extends Page {

	get login() { return browser.element( 'li#pt-login a' ); }

	open() {
		super.open( 'Main_Page' );
	}

}
module.exports = new MainPage();

specs/main_page.js

const assert = require( 'assert' ),
	MainPage = require( '../pageobjects/main.page' );

describe( 'Main Page', function () {
	it( 'should have "Log in" link', function () {
		MainPage.open();
		assert( MainPage.login.isVisible() );
	} );
} );

Output[edit]

Start Chromedriver in one terminal tab or window and run the tests in another one.

$ chromedriver --url-base=/wd/hub --port=4444

Everything is fine.

$ ./node_modules/.bin/wdio wdio.conf.js 
․
1 passing (4.50s)

There is a problem.

$ ./node_modules/.bin/wdio wdio.conf.js 

F

0 passing (3.10s)
1 failing

1) Main Page should have "Log in" link:
false == true
running chrome
AssertionError: false == true
...