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.

324 lines
10 KiB

1 year ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
  1. QUnit.module('nested-repeater', {
  2. setup: function () {
  3. this.$fixture = $('#qunit-fixture');
  4. this.$fixture.html($('#template').html());
  5. this.$outerRepeater = this.$fixture.find('.outer-repeater');
  6. this.$innerRepeater = this.$fixture.find('.inner-repeater');
  7. this.$outerAddButton = this.$fixture.find('.outer-repeater > [data-repeater-create]');
  8. this.$innerAddButton = this.$fixture.find('.inner-repeater > [data-repeater-create]');
  9. }
  10. });
  11. QUnit.test('isFirstItemUndeletable configuration option', function (assert) {
  12. this.$outerRepeater.repeater({
  13. isFirstItemUndeletable: true,
  14. repeaters: [{
  15. selector: '.inner-repeater',
  16. isFirstItemUndeletable: true
  17. }]
  18. });
  19. this.$outerAddButton.click();
  20. this.$innerAddButton.click();
  21. var $outerItems = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]');
  22. var $innerItems = this.$innerRepeater.find('[data-repeater-item]');
  23. assert.strictEqual($outerItems.length, 2, 'adds a second item to outer list');
  24. assert.strictEqual($innerItems.length, 2, 'adds a second item to inner list');
  25. assert.strictEqual(
  26. this.$outerRepeater.find('[data-repeater-item].outer')
  27. .first().find('[data-repeater-delete].outer').length,
  28. 0,
  29. 'No delete button on first outer item'
  30. );
  31. assert.strictEqual(
  32. this.$outerRepeater.find('[data-repeater-item].outer')
  33. .last().find('[data-repeater-delete].outer').length,
  34. 1,
  35. 'Delete button on second outer item'
  36. );
  37. assert.strictEqual(
  38. this.$innerRepeater.find('[data-repeater-item]')
  39. .first().find('[data-repeater-delete]').length,
  40. 0,
  41. 'No delete button on first inner item of first outer item'
  42. );
  43. assert.strictEqual(
  44. this.$innerRepeater.find('[data-repeater-item]')
  45. .last().find('[data-repeater-delete]').length,
  46. 1,
  47. 'Delete button on second inner item of first outer item'
  48. );
  49. assert.strictEqual(
  50. this.$outerRepeater.find('[data-repeater-list="inner-group"]').last()
  51. .find('[data-repeater-item]').first().find('[data-repeater-delete]').length,
  52. 0,
  53. 'No delete button on first inner item of second outer item'
  54. );
  55. });
  56. QUnit.test('setList', function (assert) {
  57. var repeater = this.$outerRepeater.repeater({
  58. repeaters: [{ selector: '.inner-repeater' }]
  59. });
  60. repeater.setList([
  61. {
  62. 'text-input': 'set-a',
  63. 'inner-group': [{ 'inner-text-input': 'set-b' }]
  64. },
  65. {
  66. 'text-input': 'set-foo',
  67. 'inner-group': []
  68. }
  69. ]);
  70. var $items = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]');
  71. assert.deepEqual(
  72. getNamedInputValues($items.first()),
  73. {
  74. "outer-group[0][text-input]": "set-a",
  75. "outer-group[0][inner-group][0][inner-text-input]": "set-b"
  76. },
  77. 'set first item'
  78. );
  79. assert.deepEqual(
  80. getNamedInputValues($items.last()),
  81. {
  82. "outer-group[1][text-input]": "set-foo"
  83. },
  84. 'set second item'
  85. );
  86. });
  87. QUnit.test('add item nested outer', function (assert) {
  88. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  89. this.$outerAddButton.click();
  90. var $items = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]');
  91. assert.strictEqual($items.length, 2, 'adds a second item to list');
  92. assert.strictEqual(
  93. $items.first().find('[data-repeater-list="inner-group"] > [data-repeater-item]').length,
  94. 1, 'does not duplicate first inner repeater'
  95. );
  96. assert.strictEqual(
  97. $items.last().find('[data-repeater-list="inner-group"] > [data-repeater-item]').length,
  98. 1, 'does not duplicate last inner repeater'
  99. );
  100. assert.deepEqual(
  101. getNamedInputValues($items.first()),
  102. {
  103. "outer-group[0][text-input]": "A",
  104. "outer-group[0][inner-group][0][inner-text-input]": "B"
  105. },
  106. 'renamed first item'
  107. );
  108. assert.deepEqual(
  109. getNamedInputValues($items.last()),
  110. {
  111. "outer-group[1][text-input]": "",
  112. "outer-group[1][inner-group][0][inner-text-input]": ""
  113. },
  114. 'renamed last item, values cleared'
  115. );
  116. });
  117. QUnit.test('delete added item outer from repeated outer', function (assert) {
  118. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  119. this.$outerAddButton.click();
  120. var $lastOuterItem = this.$outerRepeater
  121. .find('[data-repeater-list="outer-group"] > [data-repeater-item]')
  122. .last();
  123. $lastOuterItem.find('[data-repeater-delete]').first().click();
  124. assert.deepEqual(
  125. getNamedInputValues(this.$outerRepeater),
  126. {
  127. "outer-group[0][text-input]": "A",
  128. "outer-group[0][inner-group][0][inner-text-input]": "B"
  129. }
  130. );
  131. });
  132. QUnit.test('delete added item outer from first outer', function (assert) {
  133. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  134. this.$outerAddButton.click();
  135. var $firstOuterItem = this.$outerRepeater
  136. .find('[data-repeater-list="outer-group"] > [data-repeater-item]')
  137. .first();
  138. $firstOuterItem.find('[data-repeater-delete]').first().click();
  139. assert.deepEqual(
  140. getNamedInputValues(this.$outerRepeater),
  141. {
  142. "outer-group[0][text-input]": "",
  143. "outer-group[0][inner-group][0][inner-text-input]": ""
  144. }
  145. );
  146. });
  147. QUnit.test('add item nested inner', function (assert) {
  148. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  149. this.$innerAddButton.click();
  150. assert.strictEqual(
  151. this.$innerRepeater.find('[data-repeater-item]').length,
  152. 2, 'adds item to inner repeater'
  153. );
  154. var $items = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]');
  155. assert.strictEqual($items.length, 1, 'does not add item to outer list');
  156. assert.deepEqual(
  157. getNamedInputValues($items.first()),
  158. {
  159. "outer-group[0][text-input]": "A",
  160. "outer-group[0][inner-group][0][inner-text-input]": "B",
  161. "outer-group[0][inner-group][1][inner-text-input]": "",
  162. },
  163. 'renamed items'
  164. );
  165. });
  166. QUnit.test('add item nested inner from repeated outer', function (assert) {
  167. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  168. this.$outerAddButton.click();
  169. var $lastItem = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]').last();
  170. $lastItem.find('[data-repeater-create]').click();
  171. assert.strictEqual(
  172. this.$innerRepeater.find('[data-repeater-item]').length,
  173. 1, 'does not add item to first inner repeater'
  174. );
  175. assert.strictEqual(
  176. $lastItem.find('[data-repeater-item]').length,
  177. 2, 'adds item to second inner repeater'
  178. );
  179. var $items = this.$outerRepeater.find('[data-repeater-list="outer-group"] > [data-repeater-item]');
  180. assert.strictEqual($items.length, 2, 'correct number of terms in outer list');
  181. assert.deepEqual(
  182. getNamedInputValues(this.$outerRepeater),
  183. {
  184. "outer-group[0][text-input]": "A",
  185. "outer-group[0][inner-group][0][inner-text-input]": "B",
  186. "outer-group[1][text-input]": "",
  187. "outer-group[1][inner-group][0][inner-text-input]": "",
  188. "outer-group[1][inner-group][1][inner-text-input]": "",
  189. },
  190. 'renamed items'
  191. );
  192. });
  193. QUnit.test('delete added item nested inner from repeated outer', function (assert) {
  194. this.$outerRepeater.repeater({ repeaters: [{ selector: '.inner-repeater' }] });
  195. this.$outerAddButton.click();
  196. var $lastOuterItem = this.$outerRepeater
  197. .find('[data-repeater-list="outer-group"] > [data-repeater-item]')
  198. .last();
  199. $lastOuterItem.find('[data-repeater-create]').click();
  200. $lastOuterItem.find('[data-repeater-list] [data-repeater-delete]').first().click();
  201. assert.deepEqual(
  202. getNamedInputValues(this.$outerRepeater),
  203. {
  204. "outer-group[0][text-input]": "A",
  205. "outer-group[0][inner-group][0][inner-text-input]": "B",
  206. "outer-group[1][text-input]": "",
  207. "outer-group[1][inner-group][0][inner-text-input]": ""
  208. }
  209. );
  210. });
  211. QUnit.test('nested default values first item', function (assert) {
  212. this.$outerRepeater.repeater({
  213. repeaters: [{
  214. selector: '.inner-repeater',
  215. defaultValues: { 'inner-text-input': 'foo' }
  216. }]
  217. });
  218. this.$innerAddButton.click();
  219. assert.deepEqual(
  220. getNamedInputValues(this.$outerRepeater),
  221. {
  222. "outer-group[0][text-input]": "A",
  223. "outer-group[0][inner-group][0][inner-text-input]": "B",
  224. "outer-group[0][inner-group][1][inner-text-input]": "foo"
  225. }
  226. );
  227. });
  228. QUnit.test('nested default values last item', function (assert) {
  229. this.$outerRepeater.repeater({
  230. repeaters: [{
  231. selector: '.inner-repeater',
  232. defaultValues: { 'inner-text-input': 'foo' }
  233. }]
  234. });
  235. this.$outerAddButton.click();
  236. var $lastOuterItem = this.$outerRepeater
  237. .find('[data-repeater-list="outer-group"] > [data-repeater-item]')
  238. .last();
  239. assert.deepEqual(
  240. getNamedInputValues(this.$outerRepeater),
  241. {
  242. "outer-group[0][text-input]": "A",
  243. "outer-group[0][inner-group][0][inner-text-input]": "B",
  244. "outer-group[1][text-input]": "",
  245. "outer-group[1][inner-group][0][inner-text-input]": "foo"
  246. }
  247. );
  248. $lastOuterItem.find('[data-repeater-create]').click();
  249. assert.deepEqual(
  250. getNamedInputValues(this.$outerRepeater),
  251. {
  252. "outer-group[0][text-input]": "A",
  253. "outer-group[0][inner-group][0][inner-text-input]": "B",
  254. "outer-group[1][text-input]": "",
  255. "outer-group[1][inner-group][0][inner-text-input]": "foo",
  256. "outer-group[1][inner-group][1][inner-text-input]": "foo"
  257. }
  258. );
  259. });
  260. QUnit.test('repeaterVal nested', function (assert) {
  261. this.$outerRepeater.repeater({
  262. repeaters: [{ selector: '.inner-repeater' }]
  263. });
  264. assert.deepEqual(this.$outerRepeater.repeaterVal(), {
  265. 'outer-group': [{
  266. 'text-input': 'A',
  267. 'inner-group': [{ 'inner-text-input': 'B' }]
  268. }]
  269. });
  270. });