Meteor: Exception in task with queue: Error: failed to execute 'removeChild' in 'Node': the node to be deleted is not a child of this node

I have a really weird problem and I don’t know how to solve it.

I am trying to create a very simple implementation of fullpage.js and meteor.js . Below is the code, but after a few minutes it breaks. When I open a new window incognito, it works for a few more minutes, but when I refresh the page, I get the following error 3 times (one for each document in the collection).

 Exception in queued task: Error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. at Error (native) at DOMRange.detach (http://localhost:3000/packages/blaze.js?efa68f65e67544b5a05509804bf97e2c91ce75eb:512:24) at DOMRange.setMembers (http://localhost:3000/packages/blaze.js?efa68f65e67544b5a05509804bf97e2c91ce75eb:471:12) at DOMRange.addMember (http://localhost:3000/packages/blaze.js?efa68f65e67544b5a05509804bf97e2c91ce75eb:540:10) at http://localhost:3000/packages/blaze.js?efa68f65e67544b5a05509804bf97e2c91ce75eb:2541:32 at Object.Tracker.nonreactive (http://localhost:3000/packages/tracker.js?517c8fe8ed6408951a30941e64a5383a7174bcfa:513:12) at Object.Blaze.Each.eachView.onViewCreated.eachView.stopHandle.ObserveSequence.observe.addedAt (http://localhost:3000/packages/blaze.js?efa68f65e67544b5a05509804bf97e2c91ce75eb:2528:17) at Object.cursor.observe.addedAt (http://localhost:3000/packages/observe-sequence.js?2fd807ea171ead273b9e6458607cb226012d9240:339:19) at LocalCollection._observeFromObserveChanges.observeChangesCallbacks.addedBefore (http://localhost:3000/packages/minimongo.js?e8806aa7782b729b2517ebc0cd10b321667f1427:3840:28) at Object.LocalCollection._CachingChangeObserver.self.applyChange.addedBefore (http://localhost:3000/packages/minimongo.js?e8806aa7782b729b2517ebc0cd10b321667f1427:3777:56) 

Meteorpad: http://meteorpad.com/pad/RT4HwXmXW6wbghNhK/Fullpage

main.html

 <head> <title>Title</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> {{>fullPage}} </body> <template name="fullPage"> <div id="fullpage" class="section"> {{#each products}} <div class="slide"><h2>{{name}}</h2></div> {{/each}} </div> </template> 

client /app.js

 Template.fullPage.rendered = function () { $('#fullpage').fullpage(); }; Template.fullPage.helpers({ products: function () { return Products.find(); } }); 

server /app.js

 Meteor.startup(function () { if (Products.find().count() === 0) { var Product1 = Products.insert({ name: "1" }); var Product2 = Products.insert({ name: "2" }); var Product3 = Products.insert({ name: "3" }); } }); 

common.js

 Products = new Mongo.Collection('products'); 
+2
source share
2 answers

Adding a <div> around your {{#each products}} may solve your problem.

I am not familiar with fullpage.js, but I was getting the same error message with the maazalik package: malihu-jquery-custom-scrollbar. The plugin works by copying and pasting elements into a new div, which can cause problems if the first child of this element is {{#each}} or {{#if}} . Adding a <div> solves this.

You can find more information in this github issue .

+3
source

Could you try adding else to each function to see if it allows anything?

 <template name="fullPage"> <div id="fullpage" class="section"> {{#each products}} <div class="slide"><h2>{{name}}</h2></div> {{else}} {{! does this help? }} {{/each}} </div> </template> 
0
source

Source: https://habr.com/ru/post/1241518/


All Articles