Can't pass "Run Functional Tests using a Headless Browser" challenge

I figured out what was causing the aforementioned TypeError. It seems that the documentation on the Zombie.js website is out of date and/or incorrect compared to its GitHub page.

Essentially, the browser.fill and browser.pressButton functions return promises. You can’t chain them like browser.fill(…).browser.pressButton(…). You have to do browser.fill(…).then(() => {browser.pressButton(…)})

Here’s an example. I had to change code like this:

browser.fill('surname', 'Colombo')
  .pressButton('submit', () => {
    browser.assert.success()
    browser.assert.text('span#name', 'Cristoforo')
    browser.assert.text('span#surname', 'Colombo')
    browser.assert.element('span#dates', 1)
    done()
  })

to this instead:

browser.fill('surname', 'Colombo').then(() => {
  browser.pressButton('submit', () => {
    browser.assert.success()
    browser.assert.text('span#name', 'Cristoforo')
    browser.assert.text('span#surname', 'Colombo')
    browser.assert.element('span#dates', 1)
    done()
  })

This is an error that is already present in the boilerplate’s example code, so hopefully this post will help anyone else who runs into the same issue. Notably, I updated all the dependencies (and the Node engine) in package.json, so it’s possible the boilerplate example code is correct for an older version of the Zombie.js library. For the record, my project is using Zombie.js v6.1.4.

EDIT: I just checked, and the issue is indeed primarily caused by a difference between Zombie.js v5 and v6:

Various browser methods, like focus, fill, etc now take a callback, or return a promise.

6 Likes