Giter Club home page Giter Club logo

Comments (7)

tejacques avatar tejacques commented on August 19, 2024

I think I've got something working for this using the Navigated event. I'm not sure if it's spec equivalent to PhantomJS because it won't fire on reload, but I'll try to do some testing and submit a PR.

from triflejs.

tejacques avatar tejacques commented on August 19, 2024

There's actually another bug related to this. The toolset added to the window (json2 and ie tools) aren't actually available until the page onload event is fired. In PhantomJS they are available immediately because they are inserted when the page is created.

This can be fixed very easily by moving the AddToolset() call from DocumentCompleted to Navigated. The unhandled error tracking should also be moved.

from triflejs.

sdesalas avatar sdesalas commented on August 19, 2024

Hi @tejacques, like your fix. Will get to it ASAP.

from triflejs.

sdesalas avatar sdesalas commented on August 19, 2024

HI @tejacques,

Added a fix for this bug. Had to call page.onInitialized during the first part of DocumentCompleted event (instead of Navigated, but a bit earlier than before as I'm not waiting for all other js/css/img resources via window.onload). Reason for this is that I couldn't get access to global variables using page.evaluate during Navigated.

Thanks for your help and for the detailed test example.

My unit tests are running ok now. Let me know how you go.

from triflejs.

sdesalas avatar sdesalas commented on August 19, 2024

Btw. I noticed that if I move 'onInitialized' to the 'Navigated' browser event I can write to global context on the webpage (but not read as the DOM is not available yet).. might consider moving functionality there if PhantomJS behaves the same way.

from triflejs.

tejacques avatar tejacques commented on August 19, 2024

In phantomJS onInitialized is called before the DOM is ready or any JS executes on the page.

Here's an example to test with:

TestPage.html

<!DOCTYPE html>
<html>
<head>
    <title>Test Page</title>
</head>
<body>
    <script>
        callPhantom({ hello: 'from script tag' });
        window.onload = function () {
            callPhantom({ hello: 'from onload' });
        }
    </script>
</body>
</html>

TestScript.js

var webPage = require('webpage');
var page = webPage.create();
page.onInitialized = function () {
    console.log("Initialized");
}
page.onCallback = function(data) {
    console.log('CALLBACK: ' + JSON.stringify(data));
  // Prints 'CALLBACK: { "hello": "world" }'
};
page.onConsoleMessage = function (msg) {
    console.log(msg);
};
page.evaluate(function () {
    callPhantom({ hello: 'world' });
});
page.open('http://localhost:port/path/to/TestPage.html', function (status) {
    phantom.exit();
});

PhantomJS Output:

>phantomjs path/to/TestScript.js
Initialized
CALLBACK: {"hello":"world"}
Initialized
CALLBACK: {"hello":"from script tag"}
CALLBACK: {"hello":"from onload"}

TrifleJS Output:

>trifleJS.exe path/to/TestScript.js
CALLBACK: {"hello":"world"}
CALLBACK: {"hello":"from script tag"}
Initialized
CALLBACK: {"hello":"from onload"}

Currently, TrifleJS isn't calling onInitialized at all unless a page is loaded, and onInitialized is called after the page runs, but before onload.

from triflejs.

sdesalas avatar sdesalas commented on August 19, 2024

Hiya,

Thanks for the great test example, I've used it to determine the load order for main lifecycle events (including onLoadStarted and onLoadFinished) and got the following from PhantomJS:

onInitialized
onCallback: beforeopen
onLoadStarted
onInitialized
onCallback: script
onCallback: onload
onLoadFinished
page.open

I've replicated this order (except for the first event) in my unit tests so I dont break it later.

The event missing is the onInitialized event called at the very beginning (during page.evaluate() and before page.open()). My feeling with this one is that I'd rather leave it for now as I'll break a few things if I try to postpone initialization (before opening a remote page) in the same way.

from triflejs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.