[SOLVED] Observing a collection for changes: exception

I need some help updating this code. I used a rather old example of leaflet and meteor.

I have the following code, based on the example above. Firefox (Firebug) gives me a big error in the console, stating:

Exception in queued task: added@http://localhost:3000/app/app.js?hash=29699009bf0d975c6c958528e0b6ee50567a1c2d:409:11
LocalCollection._observeFromObserveChanges/observeChangesCallbacks.added@http://localhost:3000/packages/minimongo.js?hash=88217d643bc16fdf3505c6d4b2b8f5ddc400c49a:3756:11
LocalCollection._CachingChangeObserver/self.applyChange.added@http://localhost:3000/packages

Template.buildingsMap.created = function() {
Buildings.find({}).observe({
  added: function(building) {
    var marker = new L.Marker([building.location.coordinates[1], building.location.coordinates[0]], {
      _id: building._id,
      name: building.name,
      icon: createIcon(building)
    }).on('click', function(e) {
      $.publish('toast', ["was clicked", e.target.options.name, "info", 0]);
    });
    map.addLayer(marker);
    markers[marker.options._id] = marker;
  },
  changed: function(building) {
    var marker = markers[building._id];
    if(marker) marker.setIcon(createIcon(building));
  },
  removed: function(building) {
    var marker = markers[building._id];
    if(map.hasLayer(marker)) {
      map.removeLayer(marker);
      delete markers[building._id];
    }
  }
});

}

Where is this code supposed to reside?

Some say in the server directory, like here. I have it residing in /client/buildings/buildingsMap.js within the if(Meteor.isClient) { … } portion.

I tried putting the code into the server directory (/server/observables.js) and it complained that ‘L’ didn’t exist. that makes sense since L is the Leaflet object on the client. I’m glad that is cleared up. :slight_smile:

commenting out the following line in the ‘added’ function gets rid of the exception:

// map.addLayer(marker);

Any ideas why. I’m using the npm leaflet@1.0.0-rc.3 package

First: Try the code button: </> makes your code much easier read.

You can use observe on both client and server. Depending on where you want to do something with the event.

So for example on the server: When a user updates a building you want to get new coordinates for it.
On the client: When another user updates a building you want to show a notification.

So it works on both where you need.

Then your issue: It’s not really debuggable from here. It is likely raised inside that package. If you open those urls listed in the error on your local machine (or use source maps) you might find the issue.

The error itself is very general and not simple to point to an issue.

When you can’t find it in the code: In general to solve this kind of issues is to first check that you have the most recent version, check that it’s maintained and check the Github issues on the package.

I put the code into Template.buildingsMap.onRendered instead of Template.buildingsMap.created and it all seems to work now.

1 Like

That makes sense since the elements may not be there at on rendered. So yes makes sense. That being said this observe code doesn’t have to live in onRendered since it doesn’t have to restart constantly. It should be able to live in a tracker.autorun which starts with Meteor.onStartup. I would for sure check to see it doesn’t run too many times now.

Observe can start once and then it will keep running when needed as long as your page is alive on the client.