Iframe & component selectors
Component selectors
If you are writing events inside a component, there a couple of selectors you can use to reference elements outside of it.
To reference elements directly in the document:
document -> selector
To reference elements in the component's parent DOM area:
parent -> selector
To reference the host element of the component:
host -> selector
Note that any variables referenced will only use the variable scope of the component it is being called from. So if you are using, for example, "document -> #myDiv_" in a private component, the variable "myVariable" will come from the private component and not the document.
Shadow DOM selector
Elements can be targeted in a shadow DOM by using the keyword "shadow" as of 2.4.0:
shadow DOM host element -> shadow -> selector
This will drill down into the shadow DOM via the host element and target the selector.
This method only applies to elements in shadow DOM as target selectors. To create an event selector for an element in a shadow DOM, you need to create the event inside the shadow DOM component itself. See the documentation on components to discover how to do this.
Iframe selector
To reference an element or selection in a iframe:
iframe element selector -> selector
To reference the immediate parent window from Active CSS config within an iframe:
parent -> selector
You will need to have permission to access the iframe and change its content, eg. if iframe permissions are set to same-origin then it should work.
This will only work in target selectors and action commands. To set up an event in an iframe, you need to have Active CSS running in that iframe with its own config.
Events do not bubble up through iframes natively, and this is not encouraged due it being potentially a massive security hole.
This should work in most instances. Every selector underneath the event selector gets run through an iframe syntax conversion and adjusts accordingly, but we haven't yet tested all the commands in an iframe context. Some of the commands just aren't going to be applicable or work when sent from outside an iframe. But please let us know if something doesn't work and you think that it should work, and we'll take a look. Some things we may not implement due to potential security issues between iframes from different sources both running Active CSS. Ie. we don't want Active CSS fully able to function with wild abandon, sending window messages all over the place, as this could lead to potential hacking issues.
If you do see any security issues with anything in Active CSS currently, it would be great if you could let us know so we can fix it asap :) Also, if you are concerned that some area or function in Active CSS may be a security hole but you are not sure - it just "smells" that way, please let us know with specific details and we will investigate.