Inserting a cutom element as child results in two instances

[shashi]

I have an element defined like this:

<dom-module
  id="my-elem">

<template></template>

<script>

Polymer({

  is: "my-elem",

  properties: {
  },
  attached: function () {
     alert("blah")
     console.log(this.parentNode)
  }
})

</script>

</dom-module>

Now if I have markup that uses this tag inside a paper-button, e.g.:

<paper-button><my-elem></my-elem></paper-button>

The alert in the attached callback is fired twice. The first time this.parentNode is the paper-button while the second time this.parentNode is a paper-material which is created by paper-button's template.

Is there a way to only make a callback fire once on initialization and guarantee that the parent node will be paper-button?

I think this is a more general issue than just a problem specific to paper-button, but I could not make a simpler reproduction. I am happy to move the issue to a different repo / change the title to whatever suits better.

[shashi]

Oh it looks like this example is not sufficient to reproduce the problem. Hmm, my setup is a bit more involved, instead of actual mark-up the elements are created using virtual-dom library, which is essentially done using document.createElement.

But, I was unable to reproduce this even when I replaced the final mark up with this JS:

  var x = document.createElement("paper-button")
  var y = document.createElement("my-elem")
  document.body.appendChild(x)
  x.appendChild(y)

Any ideas on where to look to debug this?

[shashi]

I encountered this issue while transitioning from Polymer 0.5 to 1.0. And I didn't know about Shady DOM, now I do.

[shashi]

Ok, closing this as this seems to happen due to the fact that virtual-dom is not aware of Shady DOM. However, I opened a nice-to-have issue here: https://github.com/Polymer/polymer/issues/2186