The WHATWG Blog

Please leave your sense of logic at the door, thanks!

Defining the WindowProxy, Window, and Location objects

by Anne van Kesteren in WHATWG

The HTML Standard defines how navigation works inside a browser tab, how JavaScript executes, what the overarching web security model is, and how all these intertwine and work together. Over the last decade, we’ve made immense progress in specifying previously-unspecified behavior, reverse-engineering and precisely documenting the de-facto requirements for a web-compatible browser. Nevertheless, there are still some corners of the web that are underspecified—sometimes because we haven’t yet discovered the incompatibility, and sometimes because specifying the behavior in a way that is acceptable to all implementers is really, really hard. What follows is an account of the latter.

Until recently, the HTML Standard lacked a precise definition of the WindowProxy, Window, and Location objects. As you might imagine, these are fairly important objects, so having them be underdefined was not great for the web. (Note that the global object used for documents is the Window object, though due the way browsers evolved it is never directly exposed. Instead, JavaScript code accesses the WindowProxy object, which serves as a proxy and security boundary for the Window object.)

Each navigable frame (top-level tab, <iframe> element, et cetera) is called a browsing context in the HTML Standard. A browsing context has an associated WindowProxy and Window object. As you navigate a browsing context, the associated Window object changes. But the whole time, the WindowProxy object stays the same. Ergo, one WindowProxy object is a proxy for many Window objects.

To make matters more interesting, scripts in these different browsing contexts can access each other, through frame.contentWindow, self.opener, window.open(), et cetera. The same-origin policy generally forbids code from one origin from accessing code from a different origin, which prevents evil.com from prying into bank.com. The two legacy exceptions to this rule are the WindowProxy and Location objects, which have some properties that can be accessed across origins.

document.domain makes this even trickier, as it effectively allows you to observe a WindowProxy or Location object as cross-origin initially, and same-origin later, or vice versa. Since the object remains the same during that time, the same-origin versus cross-origin logic needs to be part of the same object and cannot be spread across different classes.

As JavaScript has many ways to inspect objects, WindowProxy and Location objects were forced to be exotic objects and defined in terms of JavaScript’s “meta-object protocol”. This means they have custom internal methods (such as [[Get]] or [[DefineOwnProperty]]) that define how they respond to the low-level operations that govern JavaScript execution.

Defining this all in detail has been a multi-year effort spearheaded by Bobby Holley, Boris Zbarsky, Ian Hickson, Adam Barth, Domenic Denicola, and Anne van Kesteren, and completed in the “define security around Window, WindowProxy, and Location objects properly” pull request. The basic setup we ended up with is that WindowProxy and Location objects have specific cross-origin branches in their internal method implementation. These take care to only expose specific properties, and even for those properties, generating specific accessor functions per origin. This ensures that cross-origin access is not inadvertently allowed through something like Object.getOwnPropertyDescriptor(otherWindowProxy, "window").get. After filtering, a WindowProxy object will forward to its Window object as appropriate, whereas a Location object simply gives access to its own properties.

Having these objects defined in detail will make it easier for implementations to refactor, and for new novel implementations like Servo to achieve web-compatibility. It will reduce debugging time for web developers after implementations have converged on the edge cases. And it drastically simplifies extending these objects, as well as placing new restrictions upon them, within this well-defined subsystem. Well-understood, stable foundations are the key to future extensions.

(Many thanks to Bobby Holley for his contributions to this post.)

3 Responses to “Defining the WindowProxy, Window, and Location objects”

  1. Jeff Walden says:

    Web developers should additionally rejoice at this brave new world, because it enables the exciting possibility for Location objects to have cyclic [[Prototype]] chains:

    Object.setPrototypeOf(Location.prototype, location); // doesn’t throw a TypeError
    assert_equals(Object.getPrototypeOf(location), Location.prototype);
    assert_equals(Object.getPrototypeOf(Location.prototype), location);

    In fact, Firefox nightly builds already implement this important advance in the web platform. So give it a try! You never knew what you were missing.

  2. Jeff Walden says:

    …okay, more seriously, this is good stuff that’ll make the web platform better specified and, in time, more interoperably implemented. Even if cracktastic behavior like in the previous comment occasionally, unavoidably, falls out of the process. 🙂

  3. Raul Mihăilă says:

    Will this help Chrome and Firefox behave the same with respect to non-writable, non-configurable properties of the window proxy when the location/window changes (the window proxy’s target)? Currently, in Chrome they disappear and in Firefox they are kept.