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

JavaScript
1

Here is my project: https://glitch.com/~zeb-fcc-chai-project

I am unable to pass the Run Functional Tests using a Headless Browser and Run Functional Tests using a Headless Browser II challenges.

I get this error when I submit my project:

// running tests
expected 'failed' to equal 'passed'
// tests completed

I suspect it may have something to do with the fact that the challenge seems to expect me to use the browser.assert.element function with the arguments of the browser.assert.elements function (note the “s”). See https://zombie.js.org/#assertelementselection-message

3 Likes
2

I’m seeing this in the console.

TypeError: browser.fill(...).pressButton is not a function

I don’t really have anything more for you right now.

3

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
4

Thanks. This worked for me. An alternative way to write it using Async:

browser.fill('surname', 'Colombo', async () => {
  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()
  });
});

Note: Sometimes it requires clicking Submit twice to get it to pass. First time passes all tests except for “All tests should pass.” and the second time gives all tests a checkmark. Not sure why.

5

I could not understand what was the reason for the test failing and I stumbled upon this thread. Thanks, man!
The Information Security and Quality Assurance Curriculum is really full of bugs…

2 Likes
6

You’re a hero. Been working on this for like an hour.