Inconsisten page loads

[nebulade]

I tried to use zombie for ui testing, however I get very mixed, inconsistent behavior on page visits.

The test was against a meteor app (in this case Rocket.Chat) and the condensed version to reveal the bug looks like:

var browser = new (require('zombie'))();
var attempts = 10;
var results = [];

function test() {
    if (attempts === 0) {
        console.log('Results:');
        console.log(results);
        process.exit();
    }

    console.log('Test:', attempts);
    browser.visit('https://demo.rocket.chat/home', function (e) {
        results.push(e || 'success');
        --attempts;
        test();
    });
}

test();

Running this gives various output like for example:

% node bug.js
Test: 10
Test: 9
Test: 8
Test: 7
Test: 6
Test: 5
Test: 4
Test: 3
Test: 2
Test: 1
Results:
[[TypeError: n.initCustomEvent is not a function],
  [TypeError: n.initCustomEvent is not a function],
   'success',
  [TypeError: n.initCustomEvent is not a function],
  [TypeError: n.initCustomEvent is not a function],
  [Error: Timeout: did not get to load all resources on this page],
  [TypeError: n.initCustomEvent is not a function],
  [TypeError: n.initCustomEvent is not a function],
  [Error: Timeout: did not get to load all resources on this page],
  [TypeError: n.initCustomEvent is not a function] ]
node bug.js  30.77s user 0.67s system 69% cpu 45.452 total

The zombie and node versions are

% grep version node_modules/zombie/package.json
  "version": "4.2.1"
% node --version
v4.2.2

I couldn't find any options to change the loading and execution behavior. Besides the timeouts, there seems to be some race in the script execution inside the website?

Would be great if someone has any hints on that issue or confirm if zombie is the wrong tool for such pages 😄

[mahnunchik]

+1

[beefo]

I'm seeing a similar issue when using Material Design Lite which requires Dialog Polyfil to polyfill "dialog" element.
This appears to be the code where the error occurs:

var supportCustomEvent = window.CustomEvent;
  if (!supportCustomEvent || typeof supportCustomEvent == 'object') {
    supportCustomEvent = function CustomEvent(event, x) {
      x = x || {};
      var ev = document.createEvent('CustomEvent');
      ev.initCustomEvent(event, !!x.bubbles, !!x.cancelable, x.detail || null);
      return ev;
    };
    supportCustomEvent.prototype = window.Event.prototype;
  }

Error message:

  zombie TypeError: ev.initCustomEvent is not a function
    at Object.CustomEvent (http://www.example.com/bower_components/dialog-polyfill/dialog-polyfill.js:8:10)
    at Object.dialogPolyfillInfo.close (http://www.example.com/bower_components/dialog-polyfill/dialog-polyfill.js:241:24)
    at null.<anonymous> (http://www.example.com/_dev/login.js:147:21)
    at callListeners (...\node_modules\jsdom\lib\jsdom\events\EventTarget.js:170:34)
    at dispatchPhase (...\node_modules\jsdom\lib\jsdom\events\EventTarget.js:159:7)
    at EventTarget.dispatchEvent (...\node_modules\jsdom\lib\jsdom\events\EventTarget.js:115:3)
    at DOM.EventTarget.dispatchEvent (...\node_modules\zombie\lib\dom\jsdom_patches.js:155:31)
    at define.proto.dispatchEvent (...\node_modules\jsdom\lib\jsdom\level2\html.js:365:55)
    at Browser.fire (...\node_modules\zombie\lib\index.js:424:14)
    at Browser.pressButton (...\node_modules\zombie\lib\index.js:1200:19)