No Description
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.

select-tests.js 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557
  1. module('Data adapters - Select - current');
  2. var SelectData = require('select2/data/select');
  3. var $ = require('jquery');
  4. var Options = require('select2/options');
  5. var selectOptions = new Options({});
  6. test('current gets default for single', function (assert) {
  7. var $select = $('#qunit-fixture .single');
  8. var data = new SelectData($select, selectOptions);
  9. data.current(function (data) {
  10. assert.equal(
  11. data.length,
  12. 1,
  13. 'There should only be one selected option'
  14. );
  15. var option = data[0];
  16. assert.equal(
  17. option.id,
  18. 'One',
  19. 'The value of the option tag should be the id'
  20. );
  21. assert.equal(
  22. option.text,
  23. 'One',
  24. 'The text within the option tag should be the text'
  25. );
  26. });
  27. });
  28. test('current gets default for multiple', function (assert) {
  29. var $select = $('#qunit-fixture .multiple');
  30. var data = new SelectData($select, selectOptions);
  31. data.current(function (data) {
  32. assert.equal(
  33. data.length,
  34. 0,
  35. 'Multiple selects have no default selection.'
  36. );
  37. });
  38. });
  39. test('current gets options with explicit value', function (assert) {
  40. var $select = $('#qunit-fixture .single');
  41. var $option = $('<option value="1">One</option>');
  42. $select.append($option);
  43. var data = new SelectData($select, selectOptions);
  44. $select.val('1');
  45. data.current(function (data) {
  46. assert.equal(
  47. data.length,
  48. 1,
  49. 'There should be one selected option'
  50. );
  51. var option = data[0];
  52. assert.equal(
  53. option.id,
  54. '1',
  55. 'The option value should be the selected id'
  56. );
  57. assert.equal(
  58. option.text,
  59. 'One',
  60. 'The text should match the text for the option tag'
  61. );
  62. });
  63. });
  64. test('current gets options with implicit value', function (assert) {
  65. var $select = $('#qunit-fixture .single');
  66. var data = new SelectData($select, selectOptions);
  67. $select.val('One');
  68. data.current(function (val) {
  69. assert.equal(
  70. val.length,
  71. 1,
  72. 'There should only be one selected value'
  73. );
  74. var option = val[0];
  75. assert.equal(
  76. option.id,
  77. 'One',
  78. 'The id should be the same as the option text'
  79. );
  80. assert.equal(
  81. option.text,
  82. 'One',
  83. 'The text should be the same as the option text'
  84. );
  85. });
  86. });
  87. test('select works for single', function (assert) {
  88. var $select = $('#qunit-fixture .single-with-placeholder');
  89. var data = new SelectData($select, selectOptions);
  90. assert.equal($select.val(), 'placeholder');
  91. data.select({
  92. id: 'One',
  93. text: 'One'
  94. });
  95. assert.equal($select.val(), 'One');
  96. });
  97. test('multiple sets the value', function (assert) {
  98. var $select = $('#qunit-fixture .multiple');
  99. var data = new SelectData($select, selectOptions);
  100. assert.ok(
  101. $select.val() == null || $select.val().length == 0,
  102. 'nothing should be selected'
  103. );
  104. data.select({
  105. id: 'Two',
  106. text: 'Two'
  107. });
  108. assert.deepEqual($select.val(), ['Two']);
  109. });
  110. test('multiple adds to the old value', function (assert) {
  111. var $select = $('#qunit-fixture .multiple');
  112. var data = new SelectData($select, selectOptions);
  113. $select.val(['Two']);
  114. assert.deepEqual($select.val(), ['Two']);
  115. data.select({
  116. id: 'One',
  117. text: 'One'
  118. });
  119. assert.deepEqual($select.val(), ['One', 'Two']);
  120. });
  121. test('duplicates - single - same id on select triggers change',
  122. function (assert) {
  123. var $select = $('#qunit-fixture .duplicates');
  124. var data = new SelectData($select, data);
  125. var second = $('#qunit-fixture .duplicates option')[2];
  126. var changeTriggered = false;
  127. assert.equal($select.val(), 'one');
  128. $select.on('change', function () {
  129. changeTriggered = true;
  130. });
  131. data.select({
  132. id: 'one',
  133. text: 'Uno',
  134. element: second
  135. });
  136. assert.equal(
  137. $select.val(),
  138. 'one',
  139. 'The value never changed'
  140. );
  141. assert.ok(
  142. changeTriggered,
  143. 'The change event should be triggered'
  144. );
  145. assert.ok(
  146. second.selected,
  147. 'The second duplicate is selected, not the first'
  148. );
  149. });
  150. test('duplicates - single - different id on select triggers change',
  151. function (assert) {
  152. var $select = $('#qunit-fixture .duplicates');
  153. var data = new SelectData($select, data);
  154. var second = $('#qunit-fixture .duplicates option')[2];
  155. var changeTriggered = false;
  156. $select.val('two');
  157. $select.on('change', function () {
  158. changeTriggered = true;
  159. });
  160. data.select({
  161. id: 'one',
  162. text: 'Uno',
  163. element: second
  164. });
  165. assert.equal(
  166. $select.val(),
  167. 'one',
  168. 'The value changed to the duplicate id'
  169. );
  170. assert.ok(
  171. changeTriggered,
  172. 'The change event should be triggered'
  173. );
  174. assert.ok(
  175. second.selected,
  176. 'The second duplicate is selected, not the first'
  177. );
  178. });
  179. test('duplicates - multiple - same id on select triggers change',
  180. function (assert) {
  181. var $select = $('#qunit-fixture .duplicates-multi');
  182. var data = new SelectData($select, data);
  183. var second = $('#qunit-fixture .duplicates-multi option')[2];
  184. var changeTriggered = false;
  185. $select.val(['one']);
  186. $select.on('change', function () {
  187. changeTriggered = true;
  188. });
  189. data.select({
  190. id: 'one',
  191. text: 'Uno',
  192. element: second
  193. });
  194. assert.deepEqual(
  195. $select.val(),
  196. ['one', 'one'],
  197. 'The value now has duplicates'
  198. );
  199. assert.ok(
  200. changeTriggered,
  201. 'The change event should be triggered'
  202. );
  203. assert.ok(
  204. second.selected,
  205. 'The second duplicate is selected, not the first'
  206. );
  207. });
  208. test('duplicates - multiple - different id on select triggers change',
  209. function (assert) {
  210. var $select = $('#qunit-fixture .duplicates-multi');
  211. var data = new SelectData($select, data);
  212. var second = $('#qunit-fixture .duplicates-multi option')[2];
  213. var changeTriggered = false;
  214. $select.val(['two']);
  215. $select.on('change', function () {
  216. changeTriggered = true;
  217. });
  218. data.select({
  219. id: 'one',
  220. text: 'Uno',
  221. element: second
  222. });
  223. assert.deepEqual(
  224. $select.val(),
  225. ['two', 'one'],
  226. 'The value has the new id'
  227. );
  228. assert.ok(
  229. changeTriggered,
  230. 'The change event should be triggered'
  231. );
  232. assert.ok(
  233. second.selected,
  234. 'The second duplicate is selected, not the first'
  235. );
  236. });
  237. module('Data adapter - Select - query');
  238. test('all options are returned with no term', function (assert) {
  239. var $select = $('#qunit-fixture .single');
  240. var data = new SelectData($select, selectOptions);
  241. data.query({}, function (data) {
  242. assert.equal(
  243. data.results.length,
  244. 1,
  245. 'The number of items returned should be equal to the number of options'
  246. );
  247. });
  248. });
  249. test('the matcher checks the text', function (assert) {
  250. var $select = $('#qunit-fixture .single');
  251. var data = new SelectData($select, selectOptions);
  252. data.query({
  253. term: 'One'
  254. }, function (data) {
  255. assert.equal(
  256. data.results.length,
  257. 1,
  258. 'Only the "One" option should be found'
  259. );
  260. });
  261. });
  262. test('the matcher ignores case', function (assert) {
  263. var $select = $('#qunit-fixture .single');
  264. var data = new SelectData($select, selectOptions);
  265. data.query({
  266. term: 'one'
  267. }, function (data) {
  268. assert.equal(
  269. data.results.length,
  270. 1,
  271. 'The "One" option should still be found'
  272. );
  273. });
  274. });
  275. test('no options may be returned with no matches', function (assert) {
  276. var $select = $('#qunit-fixture .single');
  277. var data = new SelectData($select, selectOptions);
  278. data.query({
  279. term: 'qwerty'
  280. }, function (data) {
  281. assert.equal(
  282. data.results.length,
  283. 0,
  284. 'Only matching items should be returned'
  285. );
  286. });
  287. });
  288. test('optgroup tags are marked with children', function (assert) {
  289. var $select = $('#qunit-fixture .groups');
  290. var data = new SelectData($select, selectOptions);
  291. data.query({}, function (data) {
  292. assert.ok(
  293. 'children' in data.results[0],
  294. 'The optgroup element should have children when queried'
  295. );
  296. });
  297. });
  298. test('empty optgroups are still shown when queried', function (assert) {
  299. var $select = $('#qunit-fixture .groups');
  300. var data = new SelectData($select, selectOptions);
  301. data.query({}, function (data) {
  302. assert.equal(
  303. data.results.length,
  304. 2,
  305. 'The empty optgroup element should still be returned when queried'
  306. );
  307. var item = data.results[1];
  308. assert.equal(
  309. item.text,
  310. 'Empty',
  311. 'The text of the empty optgroup should match the label'
  312. );
  313. assert.equal(
  314. item.children.length,
  315. 0,
  316. 'There should be no children in the empty opgroup'
  317. );
  318. });
  319. });
  320. test('multiple options with the same value are returned', function (assert) {
  321. var $select = $('#qunit-fixture .duplicates');
  322. var data = new SelectData($select, selectOptions);
  323. data.query({}, function (data) {
  324. assert.equal(
  325. data.results.length,
  326. 3,
  327. 'The duplicate option should still be returned when queried'
  328. );
  329. var first = data.results[0];
  330. var duplicate = data.results[2];
  331. assert.equal(
  332. first.id,
  333. duplicate.id,
  334. 'The duplicates should have the same id'
  335. );
  336. assert.notEqual(
  337. first.text,
  338. duplicate.text,
  339. 'The duplicates do not have the same text'
  340. );
  341. });
  342. });
  343. test('data objects use the text of the option', function (assert) {
  344. var $select = $('#qunit-fixture .duplicates');
  345. var data = new SelectData($select, selectOptions);
  346. var $option = $('<option>&amp;</option>');
  347. var item = data.item($option);
  348. assert.equal(item.id, '&');
  349. assert.equal(item.text, '&');
  350. });
  351. test('select option construction accepts id=0 (zero) value', function (assert) {
  352. var $select = $('#qunit-fixture .single');
  353. var selectOptions = [{ id: 0, text: 'Zero Value'}];
  354. var data = new SelectData($select, selectOptions);
  355. var optionElem = data.option(selectOptions[0]);
  356. // If was "Zero Value"", then it ignored id property
  357. assert.equal(
  358. optionElem[0].value,
  359. '0',
  360. 'Built option value should be "0" (zero as a string).'
  361. );
  362. });
  363. test('select option construction accepts id="" (empty string) value',
  364. function (assert) {
  365. var $select = $('#qunit-fixture .single');
  366. var selectOptions = [{ id: '', text: 'Empty String'}];
  367. var data = new SelectData($select, selectOptions);
  368. var optionElem = data.option(selectOptions[0]);
  369. assert.equal(
  370. optionElem[0].value,
  371. '',
  372. 'Built option value should be an empty string.'
  373. );
  374. });
  375. test('user-defined types are normalized properly', function (assert) {
  376. var $select = $('#qunit-fixture .user-defined'),
  377. UserDefinedType = function (id, text) {
  378. var self = this;
  379. self.id = id;
  380. self.text = text;
  381. return self;
  382. };
  383. var testData = [
  384. 'Test',
  385. {
  386. id: 4,
  387. text: 'item'
  388. },
  389. new UserDefinedType(1, 'aaaaaa')
  390. ];
  391. var data = new SelectData($select, selectOptions);
  392. var normalizedItem = data._normalizeItem(testData[0]);
  393. var normalizedItem2 = data._normalizeItem(testData[1]);
  394. var normalizedItem3 = data._normalizeItem(testData[2]);
  395. assert.equal(
  396. testData[0],
  397. normalizedItem.id,
  398. 'id property should be equal to text after normalize'
  399. );
  400. assert.equal(
  401. testData[0],
  402. normalizedItem.text,
  403. 'text property should be equal after normalize'
  404. );
  405. assert.equal(
  406. testData[1].id,
  407. normalizedItem2.id,
  408. 'id property should be equal after normalize'
  409. );
  410. assert.equal(
  411. testData[1].text,
  412. normalizedItem2.text,
  413. 'text property should be equal after normalize'
  414. );
  415. assert.equal(
  416. testData[2].id,
  417. normalizedItem3.id,
  418. 'id property should be equal after normalize'
  419. );
  420. assert.equal(
  421. testData[2].text,
  422. normalizedItem3.text,
  423. 'text property should be equal after normalize'
  424. );
  425. });