Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Greasemonkey Script and Function Scope

Here is my script code:

    // ==UserScript==
    // @name          test 
    // @description   test
    // @include       http://*
    // @copyright     Bruno Tyndall
    // ==/UserScript==

    var main = function() {
        var b = document.getElementsByTagName('body')[0];
        var t = document.createElement('div');
        t.innerHTML = '<a href="javascript:void(0);" style="color:white;">Hello World</a>';
        t.style.position = 'absolute';
        t.style.zIndex = 1000;
        t.style.bottom = '5px';
        t.style.right = '5px';
        t.firstChild.setAttribute('onclick', 'test();');
        b.appendChild(t);

    }

    var test = function() {
        alert("Hello World");
    }
    main();

The only issue I have is when Hello World is clicked the page cannot find the test() function. Please tell me I don't have to solve it by innerHTML'ing the function onto the page like this. Is there another way?

Thanks.

like image 685
BuddyJoe Avatar asked Feb 15 '09 15:02

BuddyJoe


3 Answers

Greasemonkey executes the script in a sandbox - the page doesn't have access to it for security reasons. All acceses to dom and window are via wrappers.

If you want to access the unsecured objects you can use wrappedJSObject property.

For your case you can use unsafeWindow (or window.wrappedJSObject):

unsafeWindow.test = function() { ....

There are some security issues with this, see: http://wiki.greasespot.net/UnsafeWindow

Also, greasemonkey executes the script after the DOMContentLoaded (when the dom is ready) event so you don't need that onload nonsense.

Also, you can't use attributes to set event listeners, or properties for that matter - you must use dom api for that. Eg:

t.firstChild.addEventListener('click', test, false);

or:

t.firstChild.addEventListener('click', function(event){ blabla }, false);
like image 160
2 revs Avatar answered Sep 21 '22 13:09

2 revs


iirc, greasemonkey runs within it's own scope, so test will not be in the global namespace.

Instead of poluting the global though, why not create your anchor element through DOM manipulation? That will return you a refernece which you can bind an anonymous function (or the greasemonkey scoped test).

like image 21
annakata Avatar answered Sep 22 '22 13:09

annakata


Try adding the function test to the window object

window.test = function ...

Edit

Also, it's a good idea to run your code from a 'load' event handler instead of just by calling it at the end of your scripts. e.g.:

window.addEventListener("load", function(e) {
 // Your main() here
}, false);
like image 33
Assaf Lavie Avatar answered Sep 20 '22 13:09

Assaf Lavie