3

Can someone please explain why the following error occurs and what it means?

Uncaught HierarchyRequestError: Failed to execute 'appendChild' on 'Node': Nodes of type 'HTML' may not be inserted inside nodes of type '#document'.

I am not sure I am able to reproduce it but it occurs from time to time, usually when I import more than one custom element. It's extremely hard giving exact context since I am working on integrating polymer's paper/core elements for our in-house widgets. Broadly speaking what are the cases that I would see this error? Any kind of help is appreciated. Thank you.

Regards, Raja

meetar
  • 7,443
  • 8
  • 42
  • 73
Raja Naresh
  • 53
  • 1
  • 3
  • are the things you try to import contained in html tags? – Winchestro Nov 05 '14 at 20:17
  • 1
    Could this be related https://github.com/Polymer/polymer/issues/882? – ebidel Nov 05 '14 at 20:21
  • @Winchestro some of the elements were pointing to possibly a different version of paper and core elements. I noticed that and I changed it all to the same bower_components folder and it worked. Is that something that could give such an error? Thanks for giving me the idea to check my individual components. – Raja Naresh Nov 05 '14 at 21:49
  • @ebidel thanks for the comment, that certainly wasn't the issue considering I already pulled everything in my local repo. – Raja Naresh Nov 05 '14 at 21:50
  • @RajaNaresh did you actually check the network panel to see if any element gets imported more than once? – Winchestro Nov 06 '14 at 00:10
  • @Winchestro I already checked that one before I posted and it isn't the case, all the paper/core elements I am importing and my custom elements require return a 200 status code and there are no duplicates, but atleast I am able to reproduce the error now. I have two polymer components folders and when I import some elements from one and some from other I am able to successfully reproduce the error. Also, when I run this code https://gist.github.com/ebidel/cea24a0c4fdcda8f8af2 in the dev console I get all elements are successfully registered. – Raja Naresh Nov 06 '14 at 14:26
  • @Raja Naresh can you set the breakpoint at the line that produces the error, reload the page, and see how many times the breakpoint will be hit? Normally, that line should be executed only once, and no errors should happen. If you get the error when the line is executed for the second time, you have some script loaded twice somewhere (I think chrome dev tools will allow you to go to the network panel from the script source to see where it was loaded from). If the error happens the first time the line is executed, something weird is going on – artem Nov 06 '14 at 21:53
  • Quick question: are you using the yeoman generator? are you using vulcanize? – robdodson Dec 08 '14 at 00:03

1 Answers1

2

I just had this same issue. I was importing core-icon.html

I discovered that the core-meta.html also includes the polymer.html, which I had already imported. I commented out the line in the core-meta.html that imported the polymer.html and my errors went away.

Jaimz
  • 790
  • 8
  • 12
  • I'm having this issue and it seems that there should be a better solution. I'm using 25+ elements (not to mention their dependencies) it's not really feasible to go through and comment out the line on all of those. – Evan Caldwell Mar 18 '15 at 05:44
  • @EvanCaldwell try commenting out the include of the polymer.html in the core-meta.html though. Ideally you'd include the polymer.html once, I put it right on my "main" html file. – Jaimz Mar 23 '15 at 17:05