goodeggs / chai-webdriver Goto Github PK

Build more expressive integration tests with webdriver sugar for chai.js

License: MIT License

HTML 14.91% CoffeeScript 85.09%

chai-webdriver's Introduction

chai-webdriver

Provides selenium-webdriver sugar for the Chai assertion library. Allows you to create expressive integration tests:

expect('.frequency-field').dom.to.contain.text('One time')
expect('.toggle-pane').dom.to.not.be.visible()

What sorts of assertions can we make?

All assertions start with a Sizzle-compatible css selector, for example:

expect('.list')
expect('div > h1')
expect('a[href=http://google.com]')

Then we add the dom flag, like so:

expect(selector).dom

Finally, we can add our assertion to the chain.

expect(selector).dom.to.have.text('string') - Test the text value of the dom against supplied string. Exact matches only.
expect(selector).dom.to.contain.text('string') - Test the text value of the dom against supplied string. Partial matches allowed.
expect(selector).dom.to.match(/regex/) - Test the text value of the dom against the regular expression.
expect(selector).dom.to.have.text(/regex/) - Test the text value of the dom against the regular expression. (Same as match above).
expect(selector).dom.to.be.visible() - Check whether or not the element is being rendered
expect(selector).dom.to.be.disabled() - Check whether or not the form element is disabled
expect(selector).dom.to.have.count(number) - Test how many elements exist in the dom with the supplied selector
expect(selector).dom.to.have.style('property', 'value') - Test the CSS style of the element. Exact matches only, unfortunately, for now.
expect(selector).dom.to.have.value('string') - Test the value of a form field against supplied string.
expect(selector).dom.to.have.htmlClass('warning') - Tests that the element has warning as one of its class attributes.
expect(selector).dom.to.have.attribute('attribute', 'value') - Test an element's attribute against value as an exact match. By omitting value test simply checks for existance of attribute.
expect(selector).dom.to.have.attribute('attribute', /regex/) - Test an element's attribute against a regular expresssion.

You can also always add a not in there to negate the assertion:

expect(selector).dom.not.to.have.style('property', 'value')

Asynchronous flow

Note that all these assertions are presumed to be asynchronous (using selenium-webdriver's promise chain). They can all take callbacks, or be chained with promises. For example:

expect(selector).dom.to.have.text('string', function(){...})
expect(selector).dom.to.have.text('string').then(function(){...})

Setup

Setup is pretty easy. Just:

// Start with a webdriver instance:
var sw = require('selenium-webdriver');
var driver = new sw.Builder()
  .withCapabilities(sw.Capabilities.chrome())
  .build()

// And then...
var chai = require('chai');
var chaiWebdriver = require('chai-webdriver');
chai.use(chaiWebdriver(driver));

// And you're good to go!
driver.get('http://github.com');
chai.expect('#site-container h1.heading').dom.to.not.contain.text("I'm a kitty!");

Contributing

so easy.

npm install           # download the necessary development dependencies
npm run-script build  # compile coffee-script into javascript
npm test              # build and run the specs

License

MIT.

chai-webdriver's People

Contributors

Stargazers

Watchers

chai-webdriver's Issues

Original match no longer works as expected

The chainable match does not work as it did before including this library.

It would be nice to have the original match when not asserting on .dom elements and the new match when asserting on .dom elements.

Make compatible with Chai v2.0

Chai has recently upgraded to version 2.0. This means that if a user installs chai without specifying a version and then attempts to install chai-webdriver, they will receive an error saying that the package chai does not satisfy its siblings' peerDependencies requirements.

Support new chai version

When calling npm install i get the warn
npm WARN [email protected] requires a peer of chai@>= 1 < 4 but none was installed.

We use
"chai": "4.1.2"
and
"chai-webdriver": "1.2.0"

Can you please support chai version 4.1.2.

Thanks

Not working with chai 3.x

Noticed that the peer dep was off from the latest version, forked and bumped the peer dep version, and ran the tests to make sure it still worked ok. Tests are stalling out indefinitely and not running 😢

Support selenium-webdriver elements directly

How 'bout a syntax that detects selenium webdriver elements and plays nice with should style?

function element (selector) {
  driver.findElement selenium.By.css(selector)
}

element('#foo').should.have.text('warning')
expect(element('#foo')).to.have.text('warning')

or for crazy jQuery-like fun:

var $ = element

$('#foo').should.have.text('warning')
expect($('#foo')).to.have.text('warning')

Matching the API of chai-jquery exactly.

Documentation error

The current docs:

// Start with a webdriver instance:
var sw = require('selenium-webdriver');
var driver = new sw.Builder()
  .withCapabilities(sw.Capabilities.chrome())
  .build()

// And then...
var chai = require('chai');
var chaiWebdriver = require('chai-webdriver');
chai.use chaiWebdriver(driver);

// And you're good to go!
driver.get('http://github.com');

chai.expect('#site-container h1.heading').dom.to.not.contain.text("I'm a kitty!");

What is chai.use chaiWebdriver(driver); ? Should it be:
chai.use(chaiWebdriver(driver));

Sizzle isn't re-injected after a redirect

Sizzle isn't re-injected after a redirect (eg a login form). This should be handled better than a simple driver.get override.

Why I'm unable to test on phantomjs..

throws me an error if i try to assert on an element id.

http://stackoverflow.com/q/24556738/2958224

what could be the cause?

Set Up Guide?

When following the setup guide, I get this from the sample:

λ node tests\chai.js
C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:2634
        throw error;
        ^

TypeError: checkSizzleExists(...).then(...).then(...).thenCatch is not a function
    at finder (C:\Users\User\AppData\Roaming\npm\node_modules\chai-webdriver\node_modules\webdriver-sizzle\lib\webdriver_sizzle.js:60:10)
    at call (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\webdriver.js:1066:28)
    at C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\webdriver.js:907:19
    at ManagedPromise.invokeCallback_ (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:1384:14)
    at TaskQueue.execute_ (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:3092:14)
    at TaskQueue.executeNext_ (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:3075:27)
    at asyncRun (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:2982:25)
    at C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\promise.js:676:7
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
From: Task: WebDriver.call(function)
    at thenableWebDriverProxy.call (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\webdriver.js:901:23)
    at thenableWebDriverProxy.findElementsInternal_ (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\webdriver.js:1066:17)
    at thenableWebDriverProxy.findElements (C:\Users\User\AppData\Roaming\npm\node_modules\selenium-webdriver\lib\webdriver.js:1043:19)
    at Function.one.all (C:\Users\User\AppData\Roaming\npm\node_modules\chai-webdriver\node_modules\webdriver-sizzle\lib\webdriver_sizzle.js:64:19)
    at assertElementExists (C:\Users\User\AppData\Roaming\npm\node_modules\chai-webdriver\lib\index.js:18:16)
    at Proxy.<anonymous> (C:\Users\User\AppData\Roaming\npm\node_modules\chai-webdriver\lib\index.js:90:14)
    at Proxy.methodWrapper (C:\Users\User\AppData\Roaming\npm\node_modules\chai\lib\chai\utils\addMethod.js:57:25)
    at Object.<anonymous> (C:\Users\User\src\izel\tests\chai.js:17:62)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)

The file being run is that included in the README.md under the title 'Setup'

REadme show how to run

I dont see how to run this in the readme might be nice for prospective users

Inject sizzle, or something smaller, on every assertion

Has benefits:

Does not change anything in the global namespace
Means that users don't need to use the injectSizzle function on every new page load

and drawbacks:

Sizzle needs to go over the wire on every assertion

Not sure how bad the drawback actually is. Minified sizzle is 18.506kb (pretty small) but we could definitely make it smaller by looking at the selector and only transferring the exact code required for the client to interpret it.

Chai-webdriver expect.to.have.attribute should work with /regex/

Difficult to debug dom selectors

I'm having trouble figuring out if chai-webdriver is even working. In the following example

var webdriver = require('selenium-webdriver');
var chai = require('chai');
var expect = chai.expect;
var chaiWebdriver = require('chai-webdriver');

describe('TWT Plugin', function () {
  var capabilities, driver;
  before(function (done) {
    capabilities = webdriver.Capabilities.chrome();
    capabilities.set("chromeOptions", {
      "excludeSwitches": ["ignore-certificate-errors"]
    });
    driver = new webdriver.Builder().withCapabilities(capabilities).build();
    chai.use(chaiWebdriver(driver));
    return done();
  });

  after(function (done) {
    return driver.quit().then(done);
  });

  it('should be embeddable', function () {
    driver.get('http://localhost:3000/page.html');
    expect("h1").dom.to.contain("text");
  });
});

when I run mocha test/integration/test_plugin.js --timeout 15000 I get AssertionError: expected 'h1' to include 'text' but I don't get any message explaining what was contained in the selector, so I'm having a hard time even knowing if it matched anything. Any suggestions on how to debug or otherwise improve this process?

Need regex text matcher

I feel this needs something like .dom.text.to.match(RegExp)... currently have to do this manually

Newbie Issue with running the tests with Firefox using Mocha

Hi,

I use Chai-webdriver with Mocha test runner and I have issues running the tests on Mac OS X.
Mocha shows the test as passing even with no assertions, and Firefox is not launching.

There must be something obvious I'm missing but I can't see it.

I run the tests with:

mocha --recursive

Here's the test code:

'use strict'

var sw = require('selenium-webdriver');
var driver = new sw.Builder()
  .withCapabilities(sw.Capabilities.firefox())
  .build()

// And then...
var chai = require('chai')
var chaiWebdriver = require('chai-webdriver')
chai.use(chaiWebdriver(driver))


describe('Simple registration form:', () => {

  describe('form is submitted when filled in with valid values', () => {
    it('should show confirmation page', () => {
      driver.get('http://github.org/')
    })
  })

})

also tried replacing

.withCapabilities(sw.Capabilities.firefox())

with

.forBrowser('firefox')

with no avail.

Here's my package.json (which i've npm installed locally):

{
  "name": "my-test-project",
  "version": "0.0.1",
  "description": "Example project for writing test cases in NodeJS. Uses Mocha as the main testing engine, and PhantomJS for browser testing.",
  "main": "app.js",
  "directories": {
    "test": "tests"
  },
  "dependencies": {
    "express": ">= 0.0.1",
    "mongoose": ">= 0.0.1",
    "jade": ">= *"
  },
  "devDependencies": {
    "chai": "^3.5.0",
    "chai-webdriver": "^1.2.0",
    "mocha": "^2.5.3",
    "phantom": ">= 0.0.1",
    "request": ">= 0.0.1",
    "selenium-webdriver": "^2.53.2"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "BSD"
}

Assertion element count ranges

Allowing for:

expect('.foo').to.have.count.lte(3)
expect('.foo').to.have.count.gt(1)

etc etc.

Should extend the native chai assertions for above, least, below, most, within, etc.

Unhelpful error message if a string is passed to .match instead of a regular expression

When I try to write an assert that uses .match I get an error. The assertion and error are below.

expect('html').dom.to.not.match.text('/pattern/');

TypeError: Object function () {
    var old_ssfi = flag(this, 'ssfi');
    if (old_ssfi && config.includeStack === false)
        flag(this, 'ssfi', ctx[name]);
    var result = method.apply(this, arguments);
    return result === undefined ? this : result;
} has no method 'text'

Support for Webdriver 3.0?

Webdriver 3.0 was recently released and is the version I am using. I am getting installation errors when attempting to npm install chai-webdriver.

[email protected] /Users/joshuareichardt/github.com/browserstack
├─┬ [email protected]
│ ├── UNMET PEER DEPENDENCY selenium-webdriver@>=2.42.0
│ ├── [email protected]
│ └── [email protected]
└── UNMET PEER DEPENDENCY [email protected]

npm WARN [email protected] requires a peer of selenium-webdriver@>=2.42.0 but none was installed.
npm WARN [email protected] requires a peer of selenium-webdriver@>=2.42.0 but none was installed.

Error with selenium-webdriver 2.40.0

Upgrading to:

[email protected]
[email protected]

Gave me an error on all my tests:

 Uncaught TypeError: Invalid locator
  at Function.webdriver.Locator.checkLocator (node_modules/selenium-webdriver/lib/webdriver/locators.js:243:9)
  at webdriver.WebDriver.findElement (node_modules/selenium-webdriver/lib/webdriver/webdriver.js:693:33)
  at one (node_modules/chai-webdriver/node_modules/webdriver-sizzle/lib/webdriver_sizzle.js:15:22)
  at assertDisplayed (node_modules/chai-webdriver/lib/index.js:42:16)
  at Assertion.<anonymous> (node_modules/chai-webdriver/lib/index.js:55:16)
  at Assertion.ctx.(anonymous function) [as visible] (node_modules/chai/lib/chai/utils/addMethod.js:34:25)
  at test/e2e/login_scenarios.js:34:45

Downgrading to:

[email protected]
[email protected]

Works fine.

I'm not sure what happened in the latest release of selenium-webdriver, that introduced some breaking change?

Thanks!

XPATH

Good Morning! Did plugin support XPATH selectors?

README cofused me

Readme of this repo confused me by showing different ways of using .not. E.g.

expect('.toggle-pane').dom.to.not.be.visible(); //to.not
hai.expect('#site-container h1.heading').dom.to.not.contain.text("I'm a kitty!"); //to.not
expect(selector).dom.not.to.have.style('property', 'value'); //not.to

Could you please maintain the integrity of Readme by using .not only in one way and is it possible to use .not in both the ways?

Chai Website

I have updated chaijs.com to include your plugin. Sorry it took so long.

I would like to feature this on the homepage but your code samples are too long. If you are interested in this can you please provide a very short description and a chunk of code samples that are no longer than what is shown here.

Unhandled error using mocha

I’m having a hard time with chai webdriver,

http://stackoverflow.com/q/40167054/6320039

I’m starting to guess it may be an error coming from the plugin, that’s why I’m putting it here

expect('body').dom.to.have.attr('foo', 'bar')
expect('body').dom.to.have.attr('foo').match(/bar/)