vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

194 lines
5.2 KiB

  1. var assert = require('assert');
  2. var moment = require('moment');
  3. var DataSet = require('../lib/DataSet');
  4. var DataView = require('../lib/DataView');
  5. // TODO: improve DataView tests, split up in one test per function
  6. describe('DataView', function () {
  7. it('should work', function () {
  8. var groups = new DataSet();
  9. // add items with different groups
  10. groups.add([
  11. {id: 1, content: 'Item 1', group: 1},
  12. {id: 2, content: 'Item 2', group: 2},
  13. {id: 3, content: 'Item 3', group: 2},
  14. {id: 4, content: 'Item 4', group: 1},
  15. {id: 5, content: 'Item 5', group: 3}
  16. ]);
  17. var group2 = new DataView(groups, {
  18. filter: function (item) {
  19. return item.group == 2;
  20. }
  21. });
  22. // test getting the filtered data
  23. assert.deepEqual(group2.get(), [
  24. {id: 2, content: 'Item 2', group: 2},
  25. {id: 3, content: 'Item 3', group: 2}
  26. ]);
  27. assert.equal(group2.length, 2);
  28. // test filtering the view contents
  29. assert.deepEqual(group2.get({
  30. filter: function (item) {
  31. return item.id > 2;
  32. }
  33. }), [
  34. {id: 3, content: 'Item 3', group: 2}
  35. ]);
  36. // test event subscription
  37. var groupsTriggerCount = 0;
  38. groups.on('*', function () {
  39. groupsTriggerCount++;
  40. });
  41. var group2TriggerCount = 0;
  42. group2.on('*', function () {
  43. group2TriggerCount++;
  44. });
  45. groups.update({id:2, content: 'Item 2 (changed)'});
  46. assert.equal(groupsTriggerCount, 1);
  47. assert.equal(group2TriggerCount, 1);
  48. assert.equal(group2.length, 2);
  49. groups.update({id:5, content: 'Item 5 (changed)'});
  50. assert.equal(groupsTriggerCount, 2);
  51. assert.equal(group2TriggerCount, 1);
  52. assert.equal(group2.length, 2);
  53. // detach the view from groups
  54. group2.setData(null);
  55. assert.equal(groupsTriggerCount, 2);
  56. assert.equal(group2TriggerCount, 2);
  57. assert.equal(group2.length, 0);
  58. groups.update({id:2, content: 'Item 2 (changed again)'});
  59. assert.equal(groupsTriggerCount, 3);
  60. assert.equal(group2TriggerCount, 2);
  61. // test updating of .length property
  62. group2.setData(groups);
  63. assert.equal(group2.length, 2);
  64. // add a new item
  65. groups.add({id: 6, content: 'Item 6', group: 2});
  66. assert.equal(group2.length, 3);
  67. // change an items group to 2
  68. groups.update({id: 4, group: 2});
  69. assert.equal(group2.length, 4);
  70. // change an items group to 1
  71. groups.update({id: 4, group: 1});
  72. assert.equal(group2.length, 3);
  73. // remove an item
  74. groups.remove(2);
  75. assert.equal(group2.length, 2);
  76. // remove all items
  77. groups.clear();
  78. assert.equal(group2.length, 0);
  79. });
  80. it('should refresh a DataView with filter', function () {
  81. var data = new DataSet([
  82. {id:1, value:2},
  83. {id:2, value:4},
  84. {id:3, value:7}
  85. ]);
  86. var threshold = 5;
  87. // create a view. The view has a filter with a dynamic property `threshold`
  88. var view = new DataView(data, {
  89. filter: function (item) {
  90. return item.value < threshold;
  91. }
  92. });
  93. var added, updated, removed;
  94. view.on('add', function (event, props) {added = added.concat(props.items)});
  95. view.on('update', function (event, props) {updated = updated.concat(props.items)});
  96. view.on('remove', function (event, props) {removed = removed.concat(props.items)});
  97. assert.deepEqual(view.get(), [
  98. {id:1, value:2},
  99. {id:2, value:4}
  100. ]);
  101. // change the threshold to 3
  102. added = [];
  103. updated = [];
  104. removed = [];
  105. threshold = 3;
  106. view.refresh();
  107. assert.deepEqual(view.get(), [{id:1, value:2}]);
  108. assert.deepEqual(added, []);
  109. assert.deepEqual(updated, []);
  110. assert.deepEqual(removed, [2]);
  111. // change threshold to 8
  112. added = [];
  113. updated = [];
  114. removed = [];
  115. threshold = 8;
  116. view.refresh();
  117. assert.deepEqual(view.get(), [
  118. {id:1, value:2},
  119. {id:2, value:4},
  120. {id:3, value:7}
  121. ]);
  122. assert.deepEqual(added, [2, 3]);
  123. assert.deepEqual(updated, []);
  124. assert.deepEqual(removed, []);
  125. });
  126. it('should pass data of changed items when updating a DataSet', function () {
  127. var data = new DataSet([
  128. {id: 1, title: 'Item 1', group: 1},
  129. {id: 2, title: 'Item 2', group: 2},
  130. {id: 3, title: 'Item 3', group: 2}
  131. ]);
  132. var view = new DataView(data, {
  133. filter: function (item) {
  134. return item.group === 2;
  135. }
  136. });
  137. var dataUpdates = [];
  138. var viewUpdates = [];
  139. data.on('update', function (event, properties, senderId) {
  140. dataUpdates.push([event, properties]);
  141. });
  142. view.on('update', function (event, properties, senderId) {
  143. viewUpdates.push([event, properties]);
  144. });
  145. // make a change not affecting the DataView
  146. data.update({id: 1, title: 'Item 1 (changed)'});
  147. assert.deepEqual(dataUpdates, [
  148. ['update', {items: [1], data: [{id: 1, title: 'Item 1 (changed)'}]}]
  149. ]);
  150. assert.deepEqual(viewUpdates, []);
  151. // make a change affecting the DataView
  152. data.update({id: 2, title: 'Item 2 (changed)'});
  153. assert.deepEqual(dataUpdates, [
  154. ['update', {items: [1], data: [{id: 1, title: 'Item 1 (changed)'}]}],
  155. ['update', {items: [2], data: [{id: 2, title: 'Item 2 (changed)'}]}]
  156. ]);
  157. assert.deepEqual(viewUpdates, [
  158. ['update', {items: [2], data: [{id: 2, title: 'Item 2 (changed)'}]}]
  159. ]);
  160. });
  161. });