1

I'm using Polymer to create custom elements (web components) and have run into a problem when removing them from the DOM. Say I have an element like this:

<link rel="import" href="../polymer/polymer.html">

<polymer-element name="demo-element">
    <template>
        <h1 on-tap="{{ titleTap }}">A custom demo element</h1>
    </template>
    <script>
        Polymer('demo-element', {
            titleTap: function() { // do something }
        });
    </script>
</polymer-element>

Then when removing the <demo-element></demo-element> from the DOM I will end up with a detached DOM tree with a reference to the H1 element (according to Chrome Devtools). It seems to me that it's the polymerWrapper that references it.

According to the documentation in Polymer API reference the framework should automatically handle the unbind. Is this not working or am I misunderstanding it?

Is this something that in the future will be handled by the browsers or will we need to depend on frameworks like Polymer to do keep our memory clean? (So what I'm asking is if there are any proposals or standards relating to this)

4

0 回答 0