multiple-tests.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. module('Selection containers - Multiple');
  2. var MultipleSelection = require('select2/selection/multiple');
  3. var $ = require('jquery');
  4. var Options = require('select2/options');
  5. var Utils = require('select2/utils');
  6. var options = new Options({});
  7. test('display uses templateSelection', function (assert) {
  8. var called = false;
  9. var templateOptions = new Options({
  10. templateSelection: function (data) {
  11. called = true;
  12. return data.text;
  13. }
  14. });
  15. var selection = new MultipleSelection(
  16. $('#qunit-fixture .multiple'),
  17. templateOptions
  18. );
  19. var out = selection.display({
  20. text: 'test'
  21. });
  22. assert.ok(called);
  23. assert.equal(out, 'test');
  24. });
  25. test('templateSelection can addClass', function (assert) {
  26. var called = false;
  27. var templateOptions = new Options({
  28. templateSelection: function (data, container) {
  29. called = true;
  30. container.addClass('testclass');
  31. return data.text;
  32. }
  33. });
  34. var selection = new MultipleSelection(
  35. $('#qunit-fixture .multiple'),
  36. templateOptions
  37. );
  38. var $container = selection.selectionContainer();
  39. var out = selection.display({
  40. text: 'test'
  41. }, $container);
  42. assert.ok(called);
  43. assert.equal(out, 'test');
  44. assert.ok($container.hasClass('testclass'));
  45. });
  46. test('empty update clears the selection', function (assert) {
  47. var selection = new MultipleSelection(
  48. $('#qunit-fixture .multiple'),
  49. options
  50. );
  51. var $selection = selection.render();
  52. var $rendered = $selection.find('.select2-selection__rendered');
  53. $rendered.text('testing');
  54. selection.update([]);
  55. assert.equal($rendered.text(), '');
  56. });
  57. test('escapeMarkup is being used', function (assert) {
  58. var selection = new MultipleSelection(
  59. $('#qunit-fixture .multiple'),
  60. options
  61. );
  62. var $selection = selection.render();
  63. var $rendered = $selection.find('.select2-selection__rendered');
  64. var unescapedText = '<script>bad("stuff");</script>';
  65. selection.update([{
  66. text: unescapedText
  67. }]);
  68. assert.equal(
  69. $rendered.text().substr(1),
  70. unescapedText,
  71. 'The text should be escaped by default to prevent injection'
  72. );
  73. });
  74. test('clear button respects the disabled state', function (assert) {
  75. var options = new Options({
  76. disabled: true
  77. });
  78. var $select = $('#qunit-fixture .multiple');
  79. var container = new MockContainer();
  80. var $container = $('<div></div>');
  81. var selection = new MultipleSelection(
  82. $select,
  83. options
  84. );
  85. var $selection = selection.render();
  86. $container.append($selection);
  87. selection.bind(container, $container);
  88. // Select an option
  89. selection.update([{
  90. text: 'Test'
  91. }]);
  92. var $rendered = $selection.find('.select2-selection__rendered');
  93. var $pill = $rendered.find('.select2-selection__choice');
  94. assert.equal($pill.length, 1, 'There should only be one selection');
  95. var $remove = $pill.find('.select2-selection__choice__remove');
  96. assert.equal(
  97. $remove.length,
  98. 1,
  99. 'The remove icon is displayed for the selection'
  100. );
  101. // Set up the unselect handler
  102. selection.on('unselect', function (params) {
  103. assert.ok(false, 'The unselect handler should not be triggered');
  104. });
  105. // Trigger the handler for the remove icon
  106. $remove.trigger('click');
  107. });