I just try to recreate this grouping example: https://jsfiddle.net/api/post/library/pure/

var now = moment().minutes(0).seconds(0).milliseconds(0);
var itemCount = 60;

// create a data set with groups
var groups = new vis.DataSet();

groups.add([
  {
    id: 1,
    content: "Lee",
    nestedGroups: [11, 12, 13],
  },
  {
    id: 2,
    content: "invisible group",
    visible: false,
  },
  {
    id: 3,
    content: "John",
    nestedGroups: [14],
    showNested: false,
  },
  {
    id: 4,
    content: "Alson",
  },
]);

groups.add([
  {
    id: 11,
    content: "cook",
  },
  {
    id: 12,
    content: "shop",
  },
  {
    id: 13,
    content: "clean house",
  },
  {
    id: 14,
    content: "wash dishes",
  },
]);

// create a dataset with items
var items = new vis.DataSet();
var groupIds = groups.getIds();
var types = ["box", "point", "range", "background"];
for (var i = 0; i < itemCount; i++) {
  var start = now.clone().add(Math.random() * 200, "hours");
  var end = start.clone().add(2, "hours");
  var randomGroupId = groupIds[Math.floor(Math.random() * groupIds.length)];
  var type = types[Math.floor(4 * Math.random())];

  items.add({
    id: i,
    group: randomGroupId,
    content: "item " + i,
    start: start,
    end: end,
    type: type,
  });
}

// create visualization
var container = document.getElementById("visualization");
var options = {
  groupOrder: "content", // groupOrder can be a property name or a sorting function
};

var timeline = new vis.Timeline(container, items, groups, options);

However I embed it in my own application which has, among others a menu structure (using toggle an collapse). My Vis time works for the best part without any problems but toggling the groups gives strange behavior. Groups are disappearing and sub groups are not shown.

I assume this is caused by event-triggering confusion.

Is there a way I can isolate the vis.js events from my hosting application? Never experienced something like this before so no clue how to solve it.