Before all hook error (Timeout: did not get to load all resources on this page) in browser action simulation challenge

[pecardozo17]

Tell us what’s happening:
So I’m getting the following error:

 1) Functional Tests with Zombie.js
       "before all" hook in "Functional Tests with Zombie.js":
     Error: Timeout: did not get to load all resources on this page
      at Timeout.timeout (node_modules/zombie/lib/eventloop.js:436:36)
      at listOnTimeout (node:internal/timers:559:17)
      at processTimers (node:internal/timers:502:7)

I really don’t understand why I’m getting this error. I changed the timeout value to 20000 and I still get this error. I’m not really experienced with chai or repl, so I’m working a little bit blind here. This is the only thing restraining me from completing the challenge, so it’s getting a little bit frustrating. Any help is appreciated

Your code so far

const Browser = require('zombie');
Browser.site = [here should go the repl URL];

suite('Functional Tests with Zombie.js', function () {
  this.timeout(20000);
  const browser = new Browser();

  suiteSetup(function(done) {
  return browser.visit('/', done);
  });

  suite('Headless browser', function () {
    test('should have a working "site" property', function() {
      assert.isNotNull(browser.site);
    });
  });

  suite('"Famous Italian Explorers" form', function () {
    // #5
    test('Submit the surname "Colombo" in the HTML form', function (done) {
    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.elements('span#dates', 1);
          done();
        })
      })
    });
    // #6
    test('Submit the surname "Vespucci" in the HTML form', function (done) {
      browser.fill('surname','Vespucci')
      .then(()=>{
        browser.pressButton('submit', () => {
          browser.assert.success();
          browser.assert.text('span#name', 'Amerigo');
          browser.assert.text('span#surname', 'Vespucci');
          browser.assert.elements('span#dates', 1);
          done();
        })
      })
    });
  });
});

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Challenge: Quality Assurance and Testing with Chai - Simulate Actions Using a Headless Browser

Link to the challenge:

freeCodeCamp.org

[lasjorg]

Did you change Browser.site to point to the Replit?

Anyway, I would suggest you do this locally as the zombie tests are very unreliable on Replit.

[arnazaron]

The problem is the first argument of browser.visit in the return statement inside suiteSetup hook. It should be the site’s url. I’ve tested it with ‘http://localhost:3000’.
My code is:

const Browser = require('zombie');

Browser.site = 'http://localhost:3000'; // Your URL here

suite('Functional Tests with Zombie.js', function() {
  this.timeout(5000);

  const browser = new Browser();

  suiteSetup(function(done) {
    return browser.visit('http://localhost:3000', done); // Here should be the same URL for the first argument
  });


  suite('Headless browser', function() {


    test('should have a working "site" property', function() {
      assert.isNotNull(browser.site);
    });
  });

  suite('"Famous Italian Explorers" form', function() {
    // #5
    test('Submit the surname "Colombo" in the HTML form', function(done) {
      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.elements("span#dates", 1);
          done();
        });
      });
    });
    // #6
    test('Submit the surname "Vespucci" in the HTML form', function(done) {
      browser.fill("surname", "Vespucci").then(() => {
        browser.pressButton("submit", () => {
          browser.assert.success();
          browser.assert.text("span#name", "Amerigo");
          browser.assert.text("span#surname", "Vespucci");
          browser.assert.elements("span#dates", 1);
          done();
        });
      });
    });
  });
});