A user account is required in order to edit this wiki, but we've had to disable public user registrations due to spam.
To request an account, ask an autoconfirmed user on Chat (such as one of these permanent autoconfirmed members).
Component Model Strawman: Isolation: Difference between revisions
No edit summary |
|||
| Line 1: | Line 1: | ||
= Overview = | = Overview = | ||
The isolated components definition is a <tt>provide</tt> attributed HTML file which is loaded in separate namespace. | |||
It is basically a document loaded by an iframe. But it has different way for communicating with the host document. | |||
See also the "Isolation" section on [[Component_Model_Strawman:_Declarative_Syntax]]. | |||
== Terms == | == Terms == | ||
| Line 22: | Line 27: | ||
The component should be able to apply and filter data and styles passed in as it sees fit. | The component should be able to apply and filter data and styles passed in as it sees fit. | ||
== Element Registration == | == Element Registration == | ||
Revision as of 20:22, 25 October 2011
Overview
The isolated components definition is a provide attributed HTML file which is loaded in separate namespace. It is basically a document loaded by an iframe. But it has different way for communicating with the host document.
See also the "Isolation" section on Component_Model_Strawman:_Declarative_Syntax.
Terms
- Confined: disallow a component from accessing the containing page. Useful when a page does not trust the component or its source.
- Encapsulated: disallow the containing page from accessing the internals of the component. Useful when a component wants to prevent a page from meddling with it.
- Isolated: a component that is both confined and encapsulated.
Considerations
To facilitate component isolation:
Autonomy
Components should be autonomous entities that can be loaded and applied as a single building block. Avoid requiring extensive manipulations on both side of the page <=> component divide.
This will also help in implementing decorators.
Interface
The interface of a component should be minimal and well defined. Embedding pages should not be required (nor able to in the case of encapsulation) to access, or even know about, the internals of a component. Conversely, the function of a component should not depend on being able to access the DOM or any other information of the hosting page that is not provided through an interface.
The component should be able to apply and filter data and styles passed in as it sees fit.
Element Registration
- XXX: define the element name resolution order.
Isolated providing document can register new elements for the host document. But in slightly different way: the lifecycle callbacks including open and close use HTMLElementProxy instead of HTMLElement, that means open should return an instance of HTMLElementProxy and close callback receives it as a parameter.
<head>
<element for="x-comment">
<script>
HTMLElementElement.current.open = function() {
var element = return new HTMLElementProxy();
element.addEventListener("message", ...);
return element;
}});
</script>
</element>
</head>
HTMLElementProxy
An element on the host document is represented as a HTMLElementProxy object in the isolated document. If an isolated-registered element is built on the host document, a set of lifecycle callback is invoked on the isolated document. The open callback should return an HTMLElementProxy object, which is then connected to associated element on the host document. Scripts in both document can communicate through the proxy using MessageEvent.
interface [
Constructor()
] HTMLElementProxy : EventTarget {
void postMessage(any message, optional sequence<Transferable> transfer);
}
// Should be implemented by HTMLElement family.
interface [
Constructor(),
NoInterfaceObject
] HTMLElementHost {
void postMessage(any message, optional sequence<Transferable> transfer);
}
Isolated ShadowRoot
Shadow Trees for the host document can live in the isolated document. The ShadowRoot constructor can accept HTMLElementProxy instead of HTMLElement.
<head>
<element for="x-comment">
<script>
HTMLElementElement.current.open = function() {
var element = return new HTMLElementProxy();
var shadow = new ShadowRoot(element);
// Build the shadow tree here...
return element;
}});
</script>
</element>
</head>
Isolated ShadowRoot objects don't propagate events across two documents.