What is the difference between open() and window.open() in Firefox?

Question

In answering my question Pumbaa80 found a difference between calling open() and window.open(), try the following examples in Firefox (tested on 11.0):

1. http://jsfiddle.net/9kqp5/ (calls open; opens in new tab in FF, provided that the "Open new windows in new tab instead" setting is on, which it is by default)

2. http://jsfiddle.net/HLbLu/ (calls window.open; opens in new small window)

But why on earth there is a difference? If I try the following example:

<script>
var a = 2;
function hello() { alert(this.a); }

hello();
window.hello();
</script>

Both variants of calling function hello work exactly the same, including having the same this!!!

Answer 1

One of your fiddles is calling window.open while the other is calling document.open, because the scope chain in inline attribute event handlers is weird. So you end up at http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#dom-document-open

That said, since you pass 3 arguments, this should be invoking window.open. The difference in behavior seems to be a bug in Firefox. I filed https://bugzilla.mozilla.org/show_bug.cgi?id=741266 on that.

Answer 2

Inside the event handler, open by itself will resolve to document.open. As Boris Zbarsky mentioned in a comment and in his answer, this is expected behavior, specified by HTML5. In the section on event handlers, step 6 specifies:

6. Using the script execution environment created above, create a function object (as defined in ECMAScript edition 5 section 13.2 Creating Function Objects), with:

(...)
Lexical Environment Scope

1. Let Scope be the result of NewObjectEnvironment(the element's Document, the global environment).
2. If the element has a form owner, let Scope be the result of NewObjectEnvironment(the element's form owner, Scope).
3. Let Scope be the result of NewObjectEnvironment(the element's object, Scope).
   (...)

In other words, variable references within the event handler will be resolved in the order:

1. local scope
2. element properties
3. owner form properties (if applicable)
4. document properties
5. global scope

Answer 3

Your two fiddles work the same for me on Chrome.

However, the two lines of code

window.open(...);

and

open(...);

are NOT equivalent. The only time they will be equivalent is if your current executing scope does not provide a new definition for open, causing the interpreter to look in the higher scopes until it reaches the global scope and finds window.open.

You can see this in action in this fiddle:

var test = function () {
    var open = function () {
      alert('uh oh');  
    };

    window.open('www.google.com');
    open('www.google.com');
};

test();

Answer 4

The are in fact the same. Try window.open === open or window["open"] === open. If that yields false to you then you must be in a closure and somecode has defined open.

And of course this stands for all the objects that are member of the global (window) object.

Answer 5

This is indeed very strange. It looks like The onclick handler when added as an attribute has some context with a wrapped open function that differs from window.open:

http://jsfiddle.net/aFujb/

This happens in latest Firefox, Safari and Chrome. I can't find any explanation or bug report for either browser.

I tried to find out what's happening in Firefox's source code, but quite honestly it's too much for me atm. Looks there's two different window.open implementations called nsGlobalWindow::Open and nsGlobalWindow::OpenJS, but I'm not sure whether this has something to do with the question.

Answer 6

In a browser, the default context is window. That's why you can call open(), alert() and even escape() for example. Calling window.open() is exactly equivalent to open().

How a new window opens by the open() function call is entirely dependent on your browser.