We discovered something interesting the other day. It turns out that if you manually apply an id to an element in the Identity inspector, it becomes a global variable.
One immediate advantage of this is that you can very simply access properties of any element without having to search for the element by id to start with. Thus,
var x = document.getElementById("banana"); x.style.color = "yellow";
banana.style.color = 'yellow';
One implication of this is that a project with sloppy namespacing would run into issues. Say you created a rectangle element and then added the id
banana. Later on, you write
var banana = "I love bananas."
At this point, logging
banana does not give you the string in praise of fruit, however. It gives you
<div class="HYPE_element" id="banana" hype_scene_index="0" style="pointer-events: auto; position: absolute; border: 1px solid rgb(216, 221, 228); background-color: rgb(232, 235, 237); overflow: visible; z-index: 1; width: 100px; height: 100px; transform-origin: 50% 50%; transform: translateX(249px) translateY(149px) rotateY(0deg);"></div>
which is clearly going to upset people not looking for it.
However, if you now write
window.banana = "I love bananas."
and log that, you now get the string which may have implications if you forget that you also have an element with that id.
Was this intentional on the part of Hype developers, and what other pitfalls and benefits might result?