@svgrid/grid 2.6.17 → 2.6.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (253) hide show
  1. package/CHANGELOG.md +346 -346
  2. package/README.md +199 -199
  3. package/dist/FlexRender.svelte +96 -96
  4. package/dist/GridFooter.svelte +181 -181
  5. package/dist/GridMenus.svelte +705 -705
  6. package/dist/SvAutoComplete.svelte +165 -165
  7. package/dist/SvAvatar.svelte +75 -75
  8. package/dist/SvCalendar.svelte +503 -503
  9. package/dist/SvCarousel.svelte +141 -141
  10. package/dist/SvCheckBox.svelte +102 -102
  11. package/dist/SvCircularProgress.svelte +109 -109
  12. package/dist/SvColorInput.svelte +181 -181
  13. package/dist/SvComboBox.svelte +275 -275
  14. package/dist/SvContextMenu.svelte +116 -116
  15. package/dist/SvCountryInput.svelte +163 -163
  16. package/dist/SvDrawer.svelte +254 -254
  17. package/dist/SvDropDownList.svelte +374 -374
  18. package/dist/SvDurationInput.svelte +126 -126
  19. package/dist/SvField.svelte +293 -293
  20. package/dist/SvForm.svelte +437 -437
  21. package/dist/SvGrid.css +2896 -2896
  22. package/dist/SvGrid.svelte +2956 -2956
  23. package/dist/SvGridCellEditor.svelte +662 -662
  24. package/dist/SvGridChart.svelte +1716 -1716
  25. package/dist/SvGridChartPanel.svelte +485 -485
  26. package/dist/SvGridChartView.svelte +70 -70
  27. package/dist/SvGridDropdown.svelte +728 -728
  28. package/dist/SvGridSelect.svelte +266 -266
  29. package/dist/SvGroupCell.svelte +116 -116
  30. package/dist/SvListBox.svelte +326 -326
  31. package/dist/SvMaskedInput.svelte +122 -122
  32. package/dist/SvMenu.svelte +124 -124
  33. package/dist/SvMenuList.svelte +146 -146
  34. package/dist/SvMultiSelect.svelte +289 -289
  35. package/dist/SvNumberInput.svelte +168 -168
  36. package/dist/SvOtpInput.svelte +158 -158
  37. package/dist/SvPasswordInput.svelte +151 -151
  38. package/dist/SvPhoneInput.svelte +133 -133
  39. package/dist/SvPopover.svelte +197 -197
  40. package/dist/SvProgress.svelte +116 -116
  41. package/dist/SvRadioGroup.svelte +107 -107
  42. package/dist/SvRating.svelte +112 -112
  43. package/dist/SvResult.svelte +73 -73
  44. package/dist/SvRichText.svelte +211 -211
  45. package/dist/SvRowGroupPanel.svelte +170 -170
  46. package/dist/SvScrollArea.svelte +61 -61
  47. package/dist/SvSlider.svelte +203 -203
  48. package/dist/SvSwitchButton.svelte +108 -108
  49. package/dist/SvTagsInput.svelte +115 -115
  50. package/dist/SvTextInput.svelte +147 -147
  51. package/dist/SvTimePicker.svelte +245 -245
  52. package/dist/SvToaster.svelte +159 -159
  53. package/dist/SvToggleButton.svelte +85 -85
  54. package/dist/SvTooltip.svelte +161 -161
  55. package/dist/SvTour.svelte +208 -208
  56. package/dist/SvTree.svelte +444 -444
  57. package/dist/SvTreeSelect.svelte +235 -235
  58. package/dist/cdn/{GridMenus-3kKYmYOE.js → GridMenus-B0F9iBrG.js} +2 -2
  59. package/dist/cdn/{GridMenus-BcDiwQ9U.js → GridMenus-IHK_l7m6.js} +2 -2
  60. package/dist/cdn/{SvDateTimePicker-DSUhIta8.js → SvDateTimePicker-CHnUkWcH.js} +2 -2
  61. package/dist/cdn/{SvDateTimePicker-h9kPyszT.js → SvDateTimePicker-CRQH_U7E.js} +2 -2
  62. package/dist/cdn/{SvGridCellEditor-DkyQO6FV.js → SvGridCellEditor-BGUCzuPB.js} +1 -1
  63. package/dist/cdn/{SvGridCellEditor-JpJSRhDx.js → SvGridCellEditor-G8IMWIws.js} +1 -1
  64. package/dist/cdn/{SvGridChart-CwhFz7GV.js → SvGridChart-BEJmNNx9.js} +1 -1
  65. package/dist/cdn/{SvGridChart-Bs2GIR2Q.js → SvGridChart-BwVos976.js} +1 -1
  66. package/dist/cdn/{SvGridChartPanel-1WXuStzM.js → SvGridChartPanel-BOknOkrP.js} +1 -1
  67. package/dist/cdn/{SvGridChartPanel-e5_nqNP9.js → SvGridChartPanel-D2PjII4O.js} +1 -1
  68. package/dist/cdn/{SvGridChartView-SmPW10dI.js → SvGridChartView-00LPUHL1.js} +1 -1
  69. package/dist/cdn/{SvGridChartView-eSPuJE6g.js → SvGridChartView-BhUEJ5ki.js} +1 -1
  70. package/dist/cdn/{SvGridDropdown-B1ZcLpgs.js → SvGridDropdown-D0VdjeR8.js} +1 -1
  71. package/dist/cdn/{SvGridDropdown-CtdbHcIS.js → SvGridDropdown-D13MtJ2j.js} +1 -1
  72. package/dist/cdn/{src-DMZZVVFd.js → src-B1TdiyS8.js} +26 -26
  73. package/dist/cdn/{src-D79V6bCA.js → src-Cd0tearp.js} +27 -27
  74. package/dist/cdn/svgrid.js +5 -5
  75. package/dist/cdn/svgrid.svelte-external.js +5 -5
  76. package/dist/chart-export.js +8 -8
  77. package/package.json +11 -11
  78. package/src/FlexRender.svelte +96 -96
  79. package/src/GridFooter.svelte +181 -181
  80. package/src/GridMenus.svelte +705 -705
  81. package/src/SvAutoComplete.svelte +165 -165
  82. package/src/SvAvatar.svelte +75 -75
  83. package/src/SvCalendar.svelte +503 -503
  84. package/src/SvCalendar.test.ts +226 -226
  85. package/src/SvCarousel.svelte +141 -141
  86. package/src/SvCheckBox.svelte +102 -102
  87. package/src/SvCircularProgress.svelte +109 -109
  88. package/src/SvColorInput.svelte +181 -181
  89. package/src/SvComboBox.svelte +275 -275
  90. package/src/SvContextMenu.svelte +116 -116
  91. package/src/SvCountryInput.svelte +163 -163
  92. package/src/SvDrawer.svelte +254 -254
  93. package/src/SvDropDownList.svelte +374 -374
  94. package/src/SvDurationInput.svelte +126 -126
  95. package/src/SvField.svelte +293 -293
  96. package/src/SvForm.svelte +437 -437
  97. package/src/SvForm.test.ts +411 -411
  98. package/src/SvGrid.controller.svelte.ts +3974 -3974
  99. package/src/SvGrid.css +2896 -2896
  100. package/src/SvGrid.svelte +2956 -2956
  101. package/src/SvGrid.types.ts +1790 -1790
  102. package/src/SvGridCellEditor.svelte +662 -662
  103. package/src/SvGridChart.svelte +1716 -1716
  104. package/src/SvGridChartPanel.svelte +485 -485
  105. package/src/SvGridChartView.svelte +70 -70
  106. package/src/SvGridDropdown.svelte +728 -728
  107. package/src/SvGridSelect.svelte +266 -266
  108. package/src/SvGroupCell.svelte +116 -116
  109. package/src/SvListBox.svelte +326 -326
  110. package/src/SvMaskedInput.svelte +122 -122
  111. package/src/SvMenu.svelte +124 -124
  112. package/src/SvMenu.test.ts +97 -97
  113. package/src/SvMenuList.svelte +146 -146
  114. package/src/SvMultiSelect.svelte +289 -289
  115. package/src/SvNumberInput.svelte +168 -168
  116. package/src/SvOtpInput.svelte +158 -158
  117. package/src/SvPasswordInput.svelte +151 -151
  118. package/src/SvPhoneInput.svelte +133 -133
  119. package/src/SvPopover.svelte +197 -197
  120. package/src/SvProgress.svelte +116 -116
  121. package/src/SvRadioGroup.svelte +107 -107
  122. package/src/SvRating.svelte +112 -112
  123. package/src/SvResult.svelte +73 -73
  124. package/src/SvRichText.svelte +211 -211
  125. package/src/SvRowGroupPanel.svelte +170 -170
  126. package/src/SvScrollArea.svelte +61 -61
  127. package/src/SvSlider.svelte +203 -203
  128. package/src/SvSwitchButton.svelte +108 -108
  129. package/src/SvTagsInput.svelte +115 -115
  130. package/src/SvTextInput.svelte +147 -147
  131. package/src/SvTimePicker.svelte +245 -245
  132. package/src/SvToaster.svelte +159 -159
  133. package/src/SvToaster.test.ts +95 -95
  134. package/src/SvToggleButton.svelte +85 -85
  135. package/src/SvTooltip.svelte +161 -161
  136. package/src/SvTour.svelte +208 -208
  137. package/src/SvTree.svelte +444 -444
  138. package/src/SvTreeSelect.svelte +235 -235
  139. package/src/a11y/dismissable.test.ts +119 -119
  140. package/src/a11y/dismissable.ts +114 -114
  141. package/src/a11y.contract.test.ts +49 -49
  142. package/src/a11y.test.ts +59 -59
  143. package/src/a11y.ts +61 -61
  144. package/src/ai.test.ts +502 -502
  145. package/src/ai.ts +1391 -1391
  146. package/src/build-api.coverage.test.ts +633 -633
  147. package/src/build-api.ts +846 -846
  148. package/src/builtin-editors.grid.test.ts +83 -83
  149. package/src/cell-formatting.ts +169 -169
  150. package/src/cell-render.test.ts +513 -513
  151. package/src/cell-render.ts +496 -496
  152. package/src/cell-values.ts +118 -118
  153. package/src/chart-export.ts +201 -201
  154. package/src/chart-view.svelte.ts +36 -36
  155. package/src/chart.ts +2295 -2295
  156. package/src/collaboration.test.ts +104 -104
  157. package/src/collaboration.ts +167 -167
  158. package/src/core.performance.test.ts +30 -30
  159. package/src/core.ts +1261 -1261
  160. package/src/createAutocomplete.svelte.ts +132 -132
  161. package/src/createCombobox.svelte.ts +191 -191
  162. package/src/createCountryInput.svelte.ts +157 -157
  163. package/src/createDropdownList.svelte.ts +168 -168
  164. package/src/createForm.svelte.ts +386 -386
  165. package/src/createGrid.svelte.ts +42 -42
  166. package/src/createGrid.test.ts +10 -10
  167. package/src/createGridState.svelte.ts +17 -17
  168. package/src/createListbox.svelte.ts +250 -250
  169. package/src/createMenu.svelte.ts +224 -224
  170. package/src/createPopoverSelect.svelte.ts +213 -213
  171. package/src/createSlider.svelte.ts +191 -191
  172. package/src/createTooltip.svelte.ts +144 -144
  173. package/src/createTree.svelte.ts +319 -319
  174. package/src/editing.test.ts +949 -949
  175. package/src/editing.ts +606 -606
  176. package/src/editor-contract.ts +170 -170
  177. package/src/editor-registry.grid.test.ts +144 -144
  178. package/src/editor-registry.ts +122 -122
  179. package/src/export-data-api.test.ts +126 -126
  180. package/src/export-format.test.ts +107 -107
  181. package/src/export-format.ts +601 -601
  182. package/src/filter-operators.ts +160 -160
  183. package/src/flex-render.ts +3 -3
  184. package/src/form-field.ts +127 -127
  185. package/src/group-display.test.ts +167 -167
  186. package/src/group-display.ts +200 -200
  187. package/src/headless.ts +87 -87
  188. package/src/index.ts +754 -754
  189. package/src/js-scroller.svelte.ts +173 -173
  190. package/src/keyboard-handlers.ts +270 -270
  191. package/src/keyboard.test.ts +59 -59
  192. package/src/keyboard.ts +97 -97
  193. package/src/list-nav.test.ts +49 -49
  194. package/src/list-nav.ts +29 -29
  195. package/src/list-option.test.ts +56 -56
  196. package/src/list-option.ts +172 -172
  197. package/src/menus.ts +567 -567
  198. package/src/merge-objects.ts +48 -48
  199. package/src/overlays.test.ts +90 -90
  200. package/src/render-component.ts +28 -28
  201. package/src/row-drag-touch.ts +211 -211
  202. package/src/row-drag.test.ts +353 -353
  203. package/src/row-drag.ts +415 -415
  204. package/src/row-resize.ts +210 -210
  205. package/src/scheduler-model.test.ts +562 -562
  206. package/src/scheduler-model.ts +872 -872
  207. package/src/selection.test.ts +754 -754
  208. package/src/selection.ts +491 -491
  209. package/src/server-data-source.test.ts +383 -383
  210. package/src/server-data-source.ts +469 -469
  211. package/src/sparkline.test.ts +68 -68
  212. package/src/sparkline.ts +169 -169
  213. package/src/spreadsheet.test.ts +488 -488
  214. package/src/spreadsheet.ts +312 -312
  215. package/src/static-functions.ts +11 -11
  216. package/src/subscribe.ts +38 -38
  217. package/src/svgrid-wrapper.types.ts +558 -558
  218. package/src/svgrid.async-editor-options.test.ts +273 -273
  219. package/src/svgrid.auto-row-height.test.ts +204 -204
  220. package/src/svgrid.behavior.test.ts +910 -910
  221. package/src/svgrid.charting.test.ts +534 -534
  222. package/src/svgrid.comments-autocomplete.test.ts +127 -127
  223. package/src/svgrid.context-menu.test.ts +147 -147
  224. package/src/svgrid.features.test.ts +157 -157
  225. package/src/svgrid.filter-depth.test.ts +163 -163
  226. package/src/svgrid.filter-menu-listbox.svelte.test.ts +331 -331
  227. package/src/svgrid.filter-menu-scroll.test.ts +112 -112
  228. package/src/svgrid.grand-total.test.ts +188 -188
  229. package/src/svgrid.group-display-mode.test.ts +171 -171
  230. package/src/svgrid.group-footers.test.ts +121 -121
  231. package/src/svgrid.group-pagination.test.ts +153 -153
  232. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  233. package/src/svgrid.tree-data.test.ts +186 -186
  234. package/src/svgrid.wrapper.test.ts +63 -63
  235. package/src/svgriddropdown.async-panel.svelte.test.ts +195 -195
  236. package/src/test-setup.ts +62 -62
  237. package/src/themes/index.ts +288 -288
  238. package/src/toast-store.svelte.ts +246 -246
  239. package/src/toast-store.test.ts +147 -147
  240. package/src/tree-row-model.test.ts +168 -168
  241. package/src/ui-buttons.test.ts +144 -144
  242. package/src/ui-inputs.test.ts +118 -118
  243. package/src/ui-localization.test.ts +113 -113
  244. package/src/ui-range.test.ts +70 -70
  245. package/src/ui-selection.test.ts +155 -155
  246. package/src/ui-tier1.test.ts +142 -142
  247. package/src/virtual.test.ts +88 -88
  248. package/src/virtualization/column-virtualizer.test.ts +27 -27
  249. package/src/virtualization/column-virtualizer.ts +30 -30
  250. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  251. package/src/virtualization/types.ts +30 -30
  252. package/src/virtualization/virtualizer.test.ts +47 -47
  253. package/src/virtualization/virtualizer.ts +322 -322
@@ -1,949 +1,949 @@
1
- import { beforeEach, describe, expect, it, vi } from 'vitest'
2
- import { createEditing } from './editing'
3
-
4
- // ---------------------------------------------------------------------------
5
- // Fake controller `ctx` for the editing handlers. The handlers operate purely
6
- // through this handle (mirroring clipboard.test.ts), so a hand-rolled stub
7
- // drives every non-clipboard branch without mounting the grid. Clipboard
8
- // paste paths are covered by clipboard.test.ts and only lightly touched here.
9
- // ---------------------------------------------------------------------------
10
-
11
- interface ColSpec {
12
- id: string
13
- field?: string
14
- editable?: boolean | ((cellCtx: any) => boolean)
15
- editorType?: string
16
- editorMultiple?: boolean
17
- }
18
-
19
- interface FakeOptions {
20
- columns?: ColSpec[]
21
- data?: Array<Record<string, unknown>>
22
- groupRows?: Set<number>
23
- editingEnabled?: boolean
24
- }
25
-
26
- function makeCtx(opts: FakeOptions = {}) {
27
- const columns: ColSpec[] = opts.columns ?? [
28
- { id: 'a', field: 'a', editable: true, editorType: 'text' },
29
- { id: 'b', field: 'b', editable: true, editorType: 'number' },
30
- ]
31
- const data = (opts.data ?? [
32
- { a: 'a0', b: 0 },
33
- { a: 'a1', b: 1 },
34
- ]).map((d) => ({ ...d }))
35
-
36
- const allColumns = columns.map((c) => ({
37
- id: c.id,
38
- columnDef: {
39
- field: c.field,
40
- editable: c.editable,
41
- editorType: c.editorType,
42
- editorMultiple: c.editorMultiple,
43
- },
44
- }))
45
-
46
- let activeCell: { rowIndex: number; colIndex: number } | null = null
47
-
48
- const buildRows = (rows: Array<Record<string, unknown>>) =>
49
- rows.map((row, index) => ({
50
- id: String(index),
51
- original: row,
52
- getCanExpand: () => opts.groupRows?.has(index) ?? false,
53
- getCellValueByColumnId: (colId: string) =>
54
- (row as Record<string, unknown>)[colId],
55
- }))
56
-
57
- let backing = data
58
-
59
- const ctx: any = {
60
- allColumns,
61
- _rows: buildRows(data),
62
- get allRows() {
63
- return ctx._rows
64
- },
65
- // The full filtered model. Same rows here (the fake has no pagination);
66
- // tests that exercise the "row left the model" path override `_rows`
67
- // alone so the two genuinely diverge.
68
- get allRowsBeforePagination() {
69
- return ctx._rowsBeforePagination ?? ctx._rows
70
- },
71
- get activeCell() {
72
- return activeCell
73
- },
74
- scrollActiveCellIntoView: () => {},
75
- editingEnabled: opts.editingEnabled ?? true,
76
- editingCell: null,
77
- editorSelectAll: false,
78
- editedCellValues: {},
79
- selectionRange: { anchor: null, focus: null },
80
- gridRootEl: null,
81
- props: {},
82
- history: [] as any[],
83
- historyPtr: -1,
84
- historyVersion: 0,
85
- UNDO_LIMIT: 100,
86
- activeCalls: [] as Array<[number, number]>,
87
- selectionCalls: [] as Array<[number, number]>,
88
- setActiveCell: (r: number, c: number) => {
89
- activeCell = { rowIndex: r, colIndex: c }
90
- ctx.activeCalls.push([r, c])
91
- },
92
- setSelection: (r: number, c: number) => {
93
- ctx.selectionCalls.push([r, c])
94
- },
95
- grid: {
96
- getState: () => ({ activeCell }),
97
- store: { setState: vi.fn() },
98
- },
99
- }
100
-
101
- Object.defineProperty(ctx, 'internalData', {
102
- get: () => backing,
103
- set: (next: Array<Record<string, unknown>>) => {
104
- backing = next
105
- ctx._rows = buildRows(next)
106
- },
107
- })
108
- ctx.internalData = data
109
-
110
- return ctx
111
- }
112
-
113
- const editingFor = (opts?: FakeOptions) => {
114
- const ctx = makeCtx(opts)
115
- return { ctx, ed: createEditing(ctx) }
116
- }
117
-
118
- describe('isCellEditable', () => {
119
- it('treats undefined editable as editable', () => {
120
- const { ctx, ed } = editingFor({
121
- columns: [{ id: 'a', field: 'a' }],
122
- data: [{ a: 1 }],
123
- })
124
- expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(true)
125
- })
126
-
127
- it('treats editable:false as locked (fast path, no row needed)', () => {
128
- const { ctx, ed } = editingFor({
129
- columns: [{ id: 'a', field: 'a', editable: false }],
130
- })
131
- expect(ed.isCellEditable(ctx.allColumns[0])).toBe(false)
132
- })
133
-
134
- it('honours a cell-level predicate returning false', () => {
135
- const { ctx, ed } = editingFor({
136
- columns: [{ id: 'a', field: 'a', editable: () => false }],
137
- data: [{ a: 1 }],
138
- })
139
- expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(false)
140
- })
141
-
142
- it('honours a cell-level predicate returning true', () => {
143
- const { ctx, ed } = editingFor({
144
- columns: [{ id: 'a', field: 'a', editable: (cc: any) => cc.row.id === '0' }],
145
- data: [{ a: 1 }],
146
- })
147
- expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(true)
148
- })
149
-
150
- it('passes a usable CellContext to the predicate', () => {
151
- const spy = vi.fn().mockReturnValue(true)
152
- const { ctx, ed } = editingFor({
153
- columns: [{ id: 'a', field: 'a', editable: spy }],
154
- data: [{ a: 'hello' }],
155
- })
156
- ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])
157
- const cc = spy.mock.calls[0]![0]
158
- expect(cc.getValue()).toBe('hello')
159
- expect(cc.cell.getValue()).toBe('hello')
160
- expect(cc.cell.getContext()).toBe(cc)
161
- expect(cc.column).toBe(ctx.allColumns[0])
162
- })
163
-
164
- it('returns editable when predicate exists but no row supplied', () => {
165
- const { ctx, ed } = editingFor({
166
- columns: [{ id: 'a', field: 'a', editable: () => false }],
167
- })
168
- // No row -> cannot evaluate predicate -> defaults to editable.
169
- expect(ed.isCellEditable(ctx.allColumns[0])).toBe(true)
170
- })
171
-
172
- it('biases to not-editable when the predicate throws', () => {
173
- const { ctx, ed } = editingFor({
174
- columns: [
175
- {
176
- id: 'a',
177
- field: 'a',
178
- editable: () => {
179
- throw new Error('boom')
180
- },
181
- },
182
- ],
183
- data: [{ a: 1 }],
184
- })
185
- expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(false)
186
- })
187
- })
188
-
189
- describe('isCellEditableAt', () => {
190
- it('resolves row/column by index then defers to isCellEditable', () => {
191
- const { ed } = editingFor({
192
- columns: [
193
- { id: 'a', field: 'a', editable: true },
194
- { id: 'b', field: 'b', editable: false },
195
- ],
196
- data: [{ a: 1, b: 2 }],
197
- })
198
- expect(ed.isCellEditableAt(0, 0)).toBe(true)
199
- expect(ed.isCellEditableAt(0, 1)).toBe(false)
200
- })
201
-
202
- it('returns false when the column index is out of range', () => {
203
- const { ed } = editingFor()
204
- expect(ed.isCellEditableAt(0, 99)).toBe(false)
205
- })
206
- })
207
-
208
- describe('getRowColumnValue', () => {
209
- it('reads the base value when the column id is known', () => {
210
- const { ctx, ed } = editingFor({
211
- columns: [{ id: 'a', field: 'a' }],
212
- data: [{ a: 'x' }],
213
- })
214
- expect(ed.getRowColumnValue(ctx.allRows[0], 'a')).toBe('x')
215
- })
216
-
217
- it('falls back to row.getCellValueByColumnId for an unknown column', () => {
218
- const { ctx, ed } = editingFor({
219
- columns: [{ id: 'a', field: 'a' }],
220
- data: [{ a: 'x', ghost: 'g' }],
221
- })
222
- expect(ed.getRowColumnValue(ctx.allRows[0], 'ghost')).toBe('g')
223
- })
224
- })
225
-
226
- describe('getCellDisplayValue', () => {
227
- it('returns the base value when there is no pending edit', () => {
228
- const { ed } = editingFor()
229
- expect(ed.getCellDisplayValue('0', 'a', 'base')).toBe('base')
230
- })
231
-
232
- it('prefers an edited override keyed by rowId:colId', () => {
233
- const { ctx, ed } = editingFor()
234
- ctx.editedCellValues['0:a'] = 'edited'
235
- expect(ed.getCellDisplayValue('0', 'a', 'base')).toBe('edited')
236
- })
237
-
238
- it('treats an explicit undefined override as present', () => {
239
- const { ctx, ed } = editingFor()
240
- ctx.editedCellValues['0:a'] = undefined
241
- expect(ed.getCellDisplayValue('0', 'a', 'base')).toBeUndefined()
242
- })
243
- })
244
-
245
- describe('startEditingWithChar', () => {
246
- it('seeds the editor with the typed character and sets active/selection', () => {
247
- const { ctx, ed } = editingFor({
248
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
249
- data: [{ a: 'x' }],
250
- })
251
- expect(ed.startEditingWithChar(0, 0, 'Z')).toBe(true)
252
- expect(ctx.editingCell).toEqual({
253
- rowId: '0',
254
- columnId: 'a',
255
- editorType: 'text',
256
- value: 'Z',
257
- // The row's data object, kept so the commit still lands if a filter
258
- // drops the row from the model mid-edit (#49).
259
- rowRef: ctx.internalData[0],
260
- })
261
- expect(ctx.editorSelectAll).toBe(false)
262
- expect(ctx.activeCalls).toEqual([[0, 0]])
263
- expect(ctx.selectionCalls).toEqual([[0, 0]])
264
- })
265
-
266
- it('defaults the editor type to text when none is declared', () => {
267
- const { ctx, ed } = editingFor({
268
- columns: [{ id: 'a', field: 'a' }],
269
- data: [{ a: 'x' }],
270
- })
271
- ed.startEditingWithChar(0, 0, 'k')
272
- expect(ctx.editingCell.editorType).toBe('text')
273
- })
274
-
275
- it('returns false when editing is globally disabled', () => {
276
- const { ctx, ed } = editingFor({ editingEnabled: false })
277
- expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
278
- expect(ctx.editingCell).toBeNull()
279
- })
280
-
281
- it('returns false for a missing row or column', () => {
282
- const { ed } = editingFor()
283
- expect(ed.startEditingWithChar(99, 0, 'a')).toBe(false)
284
- expect(ed.startEditingWithChar(0, 99, 'a')).toBe(false)
285
- })
286
-
287
- it('returns false for a group row', () => {
288
- const { ed } = editingFor({
289
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
290
- data: [{ a: 'x' }],
291
- groupRows: new Set([0]),
292
- })
293
- expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
294
- })
295
-
296
- it('returns false for a non-editable cell', () => {
297
- const { ed } = editingFor({
298
- columns: [{ id: 'a', field: 'a', editable: false, editorType: 'text' }],
299
- data: [{ a: 'x' }],
300
- })
301
- expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
302
- })
303
-
304
- it('rejects type-to-edit for checkbox/date/datetime/list/chips editors', () => {
305
- for (const editorType of ['checkbox', 'date', 'datetime', 'list', 'chips']) {
306
- const { ed } = editingFor({
307
- columns: [{ id: 'a', field: 'a', editorType }],
308
- data: [{ a: 'x' }],
309
- })
310
- expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
311
- }
312
- })
313
-
314
- it('rejects a non-numeric character on a number editor', () => {
315
- const { ed } = editingFor({
316
- columns: [{ id: 'a', field: 'a', editorType: 'number' }],
317
- data: [{ a: 1 }],
318
- })
319
- expect(ed.startEditingWithChar(0, 0, 'x')).toBe(false)
320
- })
321
-
322
- it('accepts a numeric character on a number editor', () => {
323
- const { ctx, ed } = editingFor({
324
- columns: [{ id: 'a', field: 'a', editorType: 'number' }],
325
- data: [{ a: 1 }],
326
- })
327
- expect(ed.startEditingWithChar(0, 0, '7')).toBe(true)
328
- expect(ctx.editingCell.value).toBe('7')
329
- })
330
- })
331
-
332
- describe('saveEditingCell', () => {
333
- it('does nothing when there is no editing cell', () => {
334
- const { ctx, ed } = editingFor()
335
- ed.saveEditingCell()
336
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
337
- })
338
-
339
- it('parses, writes original, records edited value, and clears editing', () => {
340
- const { ctx, ed } = editingFor({
341
- columns: [{ id: 'b', field: 'b', editorType: 'number' }],
342
- data: [{ b: 0 }],
343
- })
344
- ctx.editingCell = { rowId: '0', columnId: 'b', editorType: 'number', value: '42' }
345
- ed.saveEditingCell()
346
- expect(ctx.internalData[0].b).toBe(42) // parsed to number, written to original
347
- expect(ctx.editedCellValues['0:b']).toBe(42)
348
- expect(ctx.editingCell).toBeNull()
349
- expect(ctx.grid.store.setState).toHaveBeenCalled()
350
- })
351
-
352
- it('coerces an unparseable number to null', () => {
353
- const { ctx, ed } = editingFor({
354
- columns: [{ id: 'b', field: 'b', editorType: 'number' }],
355
- data: [{ b: 5 }],
356
- })
357
- ctx.editingCell = { rowId: '0', columnId: 'b', editorType: 'number', value: 'abc' }
358
- ed.saveEditingCell()
359
- expect(ctx.internalData[0].b).toBeNull()
360
- })
361
-
362
- it('respects editorMultiple when parsing list editors', () => {
363
- const { ctx, ed } = editingFor({
364
- columns: [
365
- { id: 'a', field: 'a', editorType: 'list', editorMultiple: true },
366
- ],
367
- data: [{ a: [] }],
368
- })
369
- ctx.editingCell = {
370
- rowId: '0',
371
- columnId: 'a',
372
- editorType: 'list',
373
- value: ['x', 'y'],
374
- }
375
- ed.saveEditingCell()
376
- expect(ctx.internalData[0].a).toEqual(['x', 'y'])
377
- })
378
-
379
- it('pushes a history step and bumps the version on a real change', () => {
380
- const { ctx, ed } = editingFor({
381
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
382
- data: [{ a: 'old' }],
383
- })
384
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'new' }
385
- ed.saveEditingCell()
386
- expect(ctx.history).toHaveLength(1)
387
- expect(ctx.history[0]).toMatchObject({
388
- rowId: '0',
389
- columnId: 'a',
390
- field: 'a',
391
- before: 'old',
392
- after: 'new',
393
- })
394
- expect(ctx.historyPtr).toBe(0)
395
- expect(ctx.historyVersion).toBe(1)
396
- })
397
-
398
- it('does not push history when the value is unchanged', () => {
399
- const { ctx, ed } = editingFor({
400
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
401
- data: [{ a: 'same' }],
402
- })
403
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'same' }
404
- ed.saveEditingCell()
405
- expect(ctx.history).toHaveLength(0)
406
- expect(ctx.historyVersion).toBe(0)
407
- })
408
-
409
- it('truncates forward (redo) history when editing after an undo', () => {
410
- const { ctx, ed } = editingFor({
411
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
412
- data: [{ a: 'v0' }],
413
- })
414
- // Pretend there is forward history the user could have redone.
415
- ctx.history = [
416
- { rowId: '0', columnId: 'a', field: 'a', before: 'x', after: 'y' },
417
- { rowId: '0', columnId: 'a', field: 'a', before: 'y', after: 'z' },
418
- ]
419
- ctx.historyPtr = 0 // pointer is behind the tail
420
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'v1' }
421
- ed.saveEditingCell()
422
- // Forward step (index 1) dropped, new step appended at index 1.
423
- expect(ctx.history).toHaveLength(2)
424
- expect(ctx.history[1].after).toBe('v1')
425
- expect(ctx.historyPtr).toBe(1)
426
- })
427
-
428
- it('caps the history at UNDO_LIMIT dropping the oldest entries', () => {
429
- const { ctx, ed } = editingFor({
430
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
431
- data: [{ a: 'start' }],
432
- })
433
- ctx.UNDO_LIMIT = 3
434
- ctx.history = [
435
- { rowId: '0', columnId: 'a', field: 'a', before: '0', after: '1' },
436
- { rowId: '0', columnId: 'a', field: 'a', before: '1', after: '2' },
437
- { rowId: '0', columnId: 'a', field: 'a', before: '2', after: '3' },
438
- ]
439
- ctx.historyPtr = 2
440
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'final' }
441
- ed.saveEditingCell()
442
- expect(ctx.history).toHaveLength(3) // capped
443
- expect(ctx.history[2].after).toBe('final') // newest kept
444
- expect(ctx.history[0].after).toBe('2') // oldest dropped
445
- expect(ctx.historyPtr).toBe(2)
446
- })
447
-
448
- it('fires onCellValueChange with the post-write payload', () => {
449
- const onCellValueChange = vi.fn()
450
- const { ctx, ed } = editingFor({
451
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
452
- data: [{ a: 'before' }],
453
- })
454
- ctx.props.onCellValueChange = onCellValueChange
455
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'after' }
456
- ed.saveEditingCell()
457
- expect(onCellValueChange).toHaveBeenCalledWith(
458
- expect.objectContaining({
459
- rowIndex: 0,
460
- columnId: 'a',
461
- oldValue: 'before',
462
- newValue: 'after',
463
- }),
464
- )
465
- })
466
-
467
- it('clears editing even when row/column cannot be resolved', () => {
468
- const { ctx, ed } = editingFor()
469
- ctx.editingCell = {
470
- rowId: 'missing',
471
- columnId: 'missing',
472
- editorType: 'text',
473
- value: 'x',
474
- }
475
- ed.saveEditingCell()
476
- expect(ctx.editingCell).toBeNull()
477
- expect(ctx.history).toHaveLength(0)
478
- })
479
- })
480
-
481
- describe('applyHistoryStep', () => {
482
- const step = {
483
- rowId: '0',
484
- columnId: 'a',
485
- field: 'a',
486
- before: 'B',
487
- after: 'A',
488
- }
489
-
490
- it('applies the before value on undo', () => {
491
- const { ctx, ed } = editingFor({
492
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
493
- data: [{ a: 'A' }],
494
- })
495
- ed.applyHistoryStep(step, 'undo')
496
- expect(ctx.internalData[0].a).toBe('B')
497
- expect(ctx.editedCellValues['0:a']).toBe('B')
498
- expect(ctx.grid.store.setState).toHaveBeenCalled()
499
- })
500
-
501
- it('applies the after value on redo', () => {
502
- const { ctx, ed } = editingFor({
503
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
504
- data: [{ a: 'B' }],
505
- })
506
- ed.applyHistoryStep(step, 'redo')
507
- expect(ctx.internalData[0].a).toBe('A')
508
- })
509
-
510
- it('fires onCellValueChange with swapped old/new on undo', () => {
511
- const onCellValueChange = vi.fn()
512
- const { ctx, ed } = editingFor({
513
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
514
- data: [{ a: 'A' }],
515
- })
516
- ctx.props.onCellValueChange = onCellValueChange
517
- ed.applyHistoryStep(step, 'undo')
518
- expect(onCellValueChange).toHaveBeenCalledWith(
519
- expect.objectContaining({ oldValue: 'A', newValue: 'B' }),
520
- )
521
- })
522
-
523
- it('is a no-op when the row or column is missing', () => {
524
- const { ctx, ed } = editingFor()
525
- ed.applyHistoryStep(
526
- { rowId: 'nope', columnId: 'a', field: 'a', before: 1, after: 2 },
527
- 'undo',
528
- )
529
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
530
- })
531
- })
532
-
533
- describe('updateEditingCellValue', () => {
534
- it('updates the value while preserving the rest of the editing cell', () => {
535
- const { ctx, ed } = editingFor()
536
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'old' }
537
- ed.updateEditingCellValue('new')
538
- expect(ctx.editingCell).toEqual({
539
- rowId: '0',
540
- columnId: 'a',
541
- editorType: 'text',
542
- value: 'new',
543
- })
544
- })
545
-
546
- it('leaves a null editing cell untouched', () => {
547
- const { ctx, ed } = editingFor()
548
- ed.updateEditingCellValue('x')
549
- expect(ctx.editingCell).toBeNull()
550
- })
551
- })
552
-
553
- describe('onEditorKeyDown', () => {
554
- function fakeEvent(key: string) {
555
- return {
556
- key,
557
- stopPropagation: vi.fn(),
558
- preventDefault: vi.fn(),
559
- } as unknown as KeyboardEvent
560
- }
561
-
562
- it('Enter saves the cell and refocuses the grid root', () => {
563
- const { ctx, ed } = editingFor({
564
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
565
- data: [{ a: 'old' }],
566
- })
567
- const focus = vi.fn()
568
- ctx.gridRootEl = { focus }
569
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'new' }
570
- const ev = fakeEvent('Enter')
571
- ed.onEditorKeyDown(ev)
572
- expect(ev.stopPropagation).toHaveBeenCalled()
573
- expect(ev.preventDefault).toHaveBeenCalled()
574
- expect(ctx.internalData[0].a).toBe('new')
575
- expect(ctx.editingCell).toBeNull()
576
- expect(focus).toHaveBeenCalledWith({ preventScroll: true })
577
- })
578
-
579
- it('Escape cancels without saving and refocuses the grid root', () => {
580
- const { ctx, ed } = editingFor({
581
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
582
- data: [{ a: 'old' }],
583
- })
584
- const focus = vi.fn()
585
- ctx.gridRootEl = { focus }
586
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'discard' }
587
- const ev = fakeEvent('Escape')
588
- ed.onEditorKeyDown(ev)
589
- expect(ctx.internalData[0].a).toBe('old') // unchanged
590
- expect(ctx.editingCell).toBeNull()
591
- expect(focus).toHaveBeenCalled()
592
- })
593
-
594
- it('stops propagation for other keys without saving or cancelling', () => {
595
- const { ctx, ed } = editingFor()
596
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'x' }
597
- const ev = fakeEvent('a')
598
- ed.onEditorKeyDown(ev)
599
- expect(ev.stopPropagation).toHaveBeenCalled()
600
- expect(ev.preventDefault).not.toHaveBeenCalled()
601
- expect(ctx.editingCell).not.toBeNull()
602
- })
603
-
604
- it('tolerates a null gridRootEl on Escape', () => {
605
- const { ctx, ed } = editingFor()
606
- ctx.gridRootEl = null
607
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'x' }
608
- expect(() => ed.onEditorKeyDown(fakeEvent('Escape'))).not.toThrow()
609
- expect(ctx.editingCell).toBeNull()
610
- })
611
-
612
- // #45 in the original report: Tab used to commit and then let the browser
613
- // walk focus out of the grid, because editors stopPropagation() every key
614
- // and nothing called preventDefault() for Tab.
615
- it('Tab saves and advances the active cell one column (#48)', () => {
616
- const { ctx, ed } = editingFor({
617
- columns: [
618
- { id: 'a', field: 'a', editorType: 'text' },
619
- { id: 'b', field: 'b', editorType: 'text' },
620
- ],
621
- data: [{ a: 'old', b: 'b0' }],
622
- })
623
- ctx.gridRootEl = { focus: vi.fn() }
624
- ed.onCellDoubleClick(0, 0)
625
- ctx.editingCell = { ...ctx.editingCell, value: 'new' }
626
- const ev = fakeEvent('Tab')
627
- ed.onEditorKeyDown(ev)
628
- expect(ev.preventDefault).toHaveBeenCalled()
629
- expect(ctx.internalData[0].a).toBe('new')
630
- expect(ctx.activeCalls.at(-1)).toEqual([0, 1])
631
- })
632
-
633
- it('Shift+Tab moves back a column and wraps to the previous row (#48)', () => {
634
- const { ctx, ed } = editingFor({
635
- columns: [
636
- { id: 'a', field: 'a', editorType: 'text' },
637
- { id: 'b', field: 'b', editorType: 'text' },
638
- ],
639
- data: [
640
- { a: 'a0', b: 'b0' },
641
- { a: 'a1', b: 'b1' },
642
- ],
643
- })
644
- ctx.gridRootEl = { focus: vi.fn() }
645
- ed.onCellDoubleClick(1, 0)
646
- const ev = { ...fakeEvent('Tab'), shiftKey: true } as unknown as KeyboardEvent
647
- ;(ev as any).preventDefault = vi.fn()
648
- ;(ev as any).stopPropagation = vi.fn()
649
- ed.onEditorKeyDown(ev)
650
- // Off the left edge -> last column of the row above.
651
- expect(ctx.activeCalls.at(-1)).toEqual([0, 1])
652
- })
653
- })
654
-
655
- describe('saveEditingCell when the row leaves the row model (#49)', () => {
656
- it('writes through the captured row when a filter hides it mid-edit', () => {
657
- const { ctx, ed } = editingFor({
658
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
659
- data: [{ a: 'old' }, { a: 'other' }],
660
- })
661
- const target = ctx.internalData[0]
662
- ed.onCellDoubleClick(0, 0)
663
- ctx.editingCell = { ...ctx.editingCell, value: 'typed' }
664
- // A filter typed into the filter row drops the edited row from BOTH the
665
- // page slice and the full filtered model while the editor is still open.
666
- ctx._rows = ctx._rows.slice(1)
667
- ctx._rowsBeforePagination = ctx._rows
668
- ed.saveEditingCell()
669
- expect(target.a).toBe('typed')
670
- expect(ctx.editingCell).toBeNull()
671
- })
672
-
673
- it('still resolves a row that is only off the current page', () => {
674
- const { ctx, ed } = editingFor({
675
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
676
- data: [{ a: 'old' }, { a: 'other' }],
677
- })
678
- const target = ctx.internalData[0]
679
- ed.onCellDoubleClick(0, 0)
680
- ctx.editingCell = { ...ctx.editingCell, value: 'typed' }
681
- // Paginated away: gone from `allRows`, still in the full filtered model.
682
- ctx._rowsBeforePagination = ctx._rows
683
- ctx._rows = ctx._rows.slice(1)
684
- ed.saveEditingCell()
685
- expect(target.a).toBe('typed')
686
- })
687
- })
688
-
689
- describe('focusOnMount', () => {
690
- let rafCb: FrameRequestCallback | null = null
691
- beforeEach(() => {
692
- rafCb = null
693
- vi.stubGlobal('requestAnimationFrame', (cb: FrameRequestCallback) => {
694
- rafCb = cb
695
- return 1
696
- })
697
- })
698
-
699
- function fakeInput(value: string) {
700
- return {
701
- value,
702
- focus: vi.fn(),
703
- select: vi.fn(),
704
- setSelectionRange: vi.fn(),
705
- }
706
- }
707
-
708
- it('selects all when editorSelectAll is set', () => {
709
- const { ctx, ed } = editingFor()
710
- ctx.editorSelectAll = true
711
- const node = fakeInput('hello')
712
- ed.focusOnMount(node as any)
713
- rafCb?.(0)
714
- expect(node.focus).toHaveBeenCalledWith({ preventScroll: true })
715
- expect(node.select).toHaveBeenCalled()
716
- expect(node.setSelectionRange).not.toHaveBeenCalled()
717
- })
718
-
719
- it('places the caret at the end when not selecting all', () => {
720
- const { ctx, ed } = editingFor()
721
- ctx.editorSelectAll = false
722
- const node = fakeInput('hello')
723
- ed.focusOnMount(node as any)
724
- rafCb?.(0)
725
- expect(node.setSelectionRange).toHaveBeenCalledWith(5, 5)
726
- expect(node.select).not.toHaveBeenCalled()
727
- })
728
-
729
- it('swallows errors from inputs that reject selection ranges', () => {
730
- const { ctx, ed } = editingFor()
731
- ctx.editorSelectAll = false
732
- const node = {
733
- value: '2020-01-01',
734
- focus: vi.fn(),
735
- select: vi.fn(),
736
- setSelectionRange: () => {
737
- throw new Error('unsupported')
738
- },
739
- }
740
- ed.focusOnMount(node as any)
741
- expect(() => rafCb?.(0)).not.toThrow()
742
- expect(node.focus).toHaveBeenCalled()
743
- })
744
- })
745
-
746
- describe('onCellDoubleClick', () => {
747
- it('enters edit mode seeded with the current display value', () => {
748
- const { ctx, ed } = editingFor({
749
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
750
- data: [{ a: 'val' }],
751
- })
752
- ed.onCellDoubleClick(0, 0)
753
- expect(ctx.editorSelectAll).toBe(true)
754
- expect(ctx.editingCell).toEqual({
755
- rowId: '0',
756
- columnId: 'a',
757
- editorType: 'text',
758
- value: 'val',
759
- rowRef: ctx.internalData[0],
760
- })
761
- expect(ctx.activeCalls).toEqual([[0, 0]])
762
- expect(ctx.selectionCalls).toEqual([[0, 0]])
763
- })
764
-
765
- it('prefers an edited override as the seed value', () => {
766
- const { ctx, ed } = editingFor({
767
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
768
- data: [{ a: 'base' }],
769
- })
770
- ctx.editedCellValues['0:a'] = 'override'
771
- ed.onCellDoubleClick(0, 0)
772
- expect(ctx.editingCell.value).toBe('override')
773
- })
774
-
775
- it('returns early when editing is disabled', () => {
776
- const { ctx, ed } = editingFor({ editingEnabled: false })
777
- ed.onCellDoubleClick(0, 0)
778
- expect(ctx.editingCell).toBeNull()
779
- })
780
-
781
- it('returns early for missing row/column or group rows', () => {
782
- const { ctx, ed } = editingFor({
783
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
784
- data: [{ a: 'x' }],
785
- groupRows: new Set([0]),
786
- })
787
- ed.onCellDoubleClick(99, 0)
788
- ed.onCellDoubleClick(0, 99)
789
- ed.onCellDoubleClick(0, 0) // group row
790
- expect(ctx.editingCell).toBeNull()
791
- })
792
-
793
- it('returns early for a non-editable cell', () => {
794
- const { ctx, ed } = editingFor({
795
- columns: [{ id: 'a', field: 'a', editable: false, editorType: 'text' }],
796
- data: [{ a: 'x' }],
797
- })
798
- ed.onCellDoubleClick(0, 0)
799
- expect(ctx.editingCell).toBeNull()
800
- })
801
-
802
- it('is a no-op when already editing the same cell', () => {
803
- const { ctx, ed } = editingFor({
804
- columns: [{ id: 'a', field: 'a', editorType: 'text' }],
805
- data: [{ a: 'x' }],
806
- })
807
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'mid-edit' }
808
- ed.onCellDoubleClick(0, 0)
809
- expect(ctx.editingCell.value).toBe('mid-edit') // untouched
810
- expect(ctx.activeCalls).toEqual([]) // setActiveCell not called
811
- })
812
-
813
- it('seeds a multi-select list editor with an array', () => {
814
- const { ctx, ed } = editingFor({
815
- columns: [
816
- { id: 'a', field: 'a', editorType: 'list', editorMultiple: true },
817
- ],
818
- data: [{ a: 'one' }],
819
- })
820
- ed.onCellDoubleClick(0, 0)
821
- expect(Array.isArray(ctx.editingCell.value)).toBe(true)
822
- expect(ctx.editingCell.value).toEqual(['one'])
823
- })
824
-
825
- it('unwraps an array seed for a single-select list editor', () => {
826
- const { ctx, ed } = editingFor({
827
- columns: [{ id: 'a', field: 'a', editorType: 'list' }],
828
- data: [{ a: ['first', 'second'] }],
829
- })
830
- ed.onCellDoubleClick(0, 0)
831
- expect(ctx.editingCell.value).toBe('first')
832
- })
833
-
834
- it('uses empty string for a single-select chips editor seeded from an empty array', () => {
835
- const { ctx, ed } = editingFor({
836
- columns: [{ id: 'a', field: 'a', editorType: 'chips' }],
837
- data: [{ a: [] }],
838
- })
839
- ed.onCellDoubleClick(0, 0)
840
- expect(ctx.editingCell.value).toBe('')
841
- })
842
- })
843
-
844
- describe('clipboard fallbacks (non-paste branches only)', () => {
845
- // onGridPaste and pasteFromClipboard guard on navigator.clipboard.readText.
846
- // The actual paste transformation is covered by clipboard.test.ts; here we
847
- // only assert the early-return guards so we do not duplicate that coverage.
848
-
849
- it('pasteFromClipboard returns early when the async API is unavailable', async () => {
850
- Object.defineProperty(navigator, 'clipboard', {
851
- value: undefined,
852
- configurable: true,
853
- })
854
- const { ctx, ed } = editingFor()
855
- await ed.pasteFromClipboard()
856
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
857
- })
858
-
859
- it('pasteFromClipboard swallows a rejected readText', async () => {
860
- Object.defineProperty(navigator, 'clipboard', {
861
- value: { readText: vi.fn().mockRejectedValue(new Error('denied')) },
862
- configurable: true,
863
- })
864
- const { ctx, ed } = editingFor()
865
- await expect(ed.pasteFromClipboard()).resolves.toBeUndefined()
866
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
867
- })
868
-
869
- it('onGridPaste ignores the native event when the async API is present', () => {
870
- Object.defineProperty(navigator, 'clipboard', {
871
- value: { readText: vi.fn() },
872
- configurable: true,
873
- })
874
- const { ctx, ed } = editingFor()
875
- const ev = {
876
- clipboardData: { getData: () => 'a\tb' },
877
- preventDefault: vi.fn(),
878
- } as unknown as ClipboardEvent
879
- ed.onGridPaste(ev)
880
- expect(ev.preventDefault).not.toHaveBeenCalled()
881
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
882
- })
883
-
884
- it('onGridPaste returns early on empty clipboard text in the fallback path', () => {
885
- Object.defineProperty(navigator, 'clipboard', {
886
- value: undefined,
887
- configurable: true,
888
- })
889
- const { ctx, ed } = editingFor()
890
- const ev = {
891
- clipboardData: { getData: () => '' },
892
- preventDefault: vi.fn(),
893
- } as unknown as ClipboardEvent
894
- ed.onGridPaste(ev)
895
- expect(ev.preventDefault).not.toHaveBeenCalled()
896
- expect(ctx.grid.store.setState).not.toHaveBeenCalled()
897
- })
898
-
899
- it('onGridPaste applies pasted text via the fallback path', () => {
900
- Object.defineProperty(navigator, 'clipboard', {
901
- value: undefined,
902
- configurable: true,
903
- })
904
- const { ctx, ed } = editingFor({
905
- columns: [
906
- { id: 'a', field: 'a', editorType: 'text', editable: true },
907
- { id: 'b', field: 'b', editorType: 'text', editable: true },
908
- ],
909
- data: [
910
- { a: '', b: '' },
911
- { a: '', b: '' },
912
- ],
913
- })
914
- ctx.selectionRange = {
915
- anchor: { rowIndex: 0, colIndex: 0 },
916
- focus: { rowIndex: 0, colIndex: 0 },
917
- }
918
- const ev = {
919
- clipboardData: { getData: () => 'X\tY\nZ\tW' },
920
- preventDefault: vi.fn(),
921
- } as unknown as ClipboardEvent
922
- ed.onGridPaste(ev)
923
- expect(ev.preventDefault).toHaveBeenCalled()
924
- expect(ctx.internalData[0]).toMatchObject({ a: 'X', b: 'Y' })
925
- expect(ctx.internalData[1]).toMatchObject({ a: 'Z', b: 'W' })
926
- })
927
-
928
- it('onGridPaste bails while a cell is being edited (native editor paste wins)', () => {
929
- Object.defineProperty(navigator, 'clipboard', {
930
- value: undefined, // fallback path (Firefox / insecure) - would otherwise hijack
931
- configurable: true,
932
- })
933
- const { ctx, ed } = editingFor({
934
- columns: [{ id: 'a', field: 'a', editorType: 'text', editable: true }],
935
- data: [{ a: 'orig' }],
936
- })
937
- ctx.selectionRange = { anchor: { rowIndex: 0, colIndex: 0 }, focus: { rowIndex: 0, colIndex: 0 } }
938
- ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'orig' }
939
- const ev = {
940
- clipboardData: { getData: () => 'PASTED' },
941
- preventDefault: vi.fn(),
942
- } as unknown as ClipboardEvent
943
- ed.onGridPaste(ev)
944
- // The grid must NOT preventDefault (so the editor's native paste proceeds)
945
- // and must NOT write to the data cell.
946
- expect(ev.preventDefault).not.toHaveBeenCalled()
947
- expect(ctx.internalData[0]).toMatchObject({ a: 'orig' })
948
- })
949
- })
1
+ import { beforeEach, describe, expect, it, vi } from 'vitest'
2
+ import { createEditing } from './editing'
3
+
4
+ // ---------------------------------------------------------------------------
5
+ // Fake controller `ctx` for the editing handlers. The handlers operate purely
6
+ // through this handle (mirroring clipboard.test.ts), so a hand-rolled stub
7
+ // drives every non-clipboard branch without mounting the grid. Clipboard
8
+ // paste paths are covered by clipboard.test.ts and only lightly touched here.
9
+ // ---------------------------------------------------------------------------
10
+
11
+ interface ColSpec {
12
+ id: string
13
+ field?: string
14
+ editable?: boolean | ((cellCtx: any) => boolean)
15
+ editorType?: string
16
+ editorMultiple?: boolean
17
+ }
18
+
19
+ interface FakeOptions {
20
+ columns?: ColSpec[]
21
+ data?: Array<Record<string, unknown>>
22
+ groupRows?: Set<number>
23
+ editingEnabled?: boolean
24
+ }
25
+
26
+ function makeCtx(opts: FakeOptions = {}) {
27
+ const columns: ColSpec[] = opts.columns ?? [
28
+ { id: 'a', field: 'a', editable: true, editorType: 'text' },
29
+ { id: 'b', field: 'b', editable: true, editorType: 'number' },
30
+ ]
31
+ const data = (opts.data ?? [
32
+ { a: 'a0', b: 0 },
33
+ { a: 'a1', b: 1 },
34
+ ]).map((d) => ({ ...d }))
35
+
36
+ const allColumns = columns.map((c) => ({
37
+ id: c.id,
38
+ columnDef: {
39
+ field: c.field,
40
+ editable: c.editable,
41
+ editorType: c.editorType,
42
+ editorMultiple: c.editorMultiple,
43
+ },
44
+ }))
45
+
46
+ let activeCell: { rowIndex: number; colIndex: number } | null = null
47
+
48
+ const buildRows = (rows: Array<Record<string, unknown>>) =>
49
+ rows.map((row, index) => ({
50
+ id: String(index),
51
+ original: row,
52
+ getCanExpand: () => opts.groupRows?.has(index) ?? false,
53
+ getCellValueByColumnId: (colId: string) =>
54
+ (row as Record<string, unknown>)[colId],
55
+ }))
56
+
57
+ let backing = data
58
+
59
+ const ctx: any = {
60
+ allColumns,
61
+ _rows: buildRows(data),
62
+ get allRows() {
63
+ return ctx._rows
64
+ },
65
+ // The full filtered model. Same rows here (the fake has no pagination);
66
+ // tests that exercise the "row left the model" path override `_rows`
67
+ // alone so the two genuinely diverge.
68
+ get allRowsBeforePagination() {
69
+ return ctx._rowsBeforePagination ?? ctx._rows
70
+ },
71
+ get activeCell() {
72
+ return activeCell
73
+ },
74
+ scrollActiveCellIntoView: () => {},
75
+ editingEnabled: opts.editingEnabled ?? true,
76
+ editingCell: null,
77
+ editorSelectAll: false,
78
+ editedCellValues: {},
79
+ selectionRange: { anchor: null, focus: null },
80
+ gridRootEl: null,
81
+ props: {},
82
+ history: [] as any[],
83
+ historyPtr: -1,
84
+ historyVersion: 0,
85
+ UNDO_LIMIT: 100,
86
+ activeCalls: [] as Array<[number, number]>,
87
+ selectionCalls: [] as Array<[number, number]>,
88
+ setActiveCell: (r: number, c: number) => {
89
+ activeCell = { rowIndex: r, colIndex: c }
90
+ ctx.activeCalls.push([r, c])
91
+ },
92
+ setSelection: (r: number, c: number) => {
93
+ ctx.selectionCalls.push([r, c])
94
+ },
95
+ grid: {
96
+ getState: () => ({ activeCell }),
97
+ store: { setState: vi.fn() },
98
+ },
99
+ }
100
+
101
+ Object.defineProperty(ctx, 'internalData', {
102
+ get: () => backing,
103
+ set: (next: Array<Record<string, unknown>>) => {
104
+ backing = next
105
+ ctx._rows = buildRows(next)
106
+ },
107
+ })
108
+ ctx.internalData = data
109
+
110
+ return ctx
111
+ }
112
+
113
+ const editingFor = (opts?: FakeOptions) => {
114
+ const ctx = makeCtx(opts)
115
+ return { ctx, ed: createEditing(ctx) }
116
+ }
117
+
118
+ describe('isCellEditable', () => {
119
+ it('treats undefined editable as editable', () => {
120
+ const { ctx, ed } = editingFor({
121
+ columns: [{ id: 'a', field: 'a' }],
122
+ data: [{ a: 1 }],
123
+ })
124
+ expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(true)
125
+ })
126
+
127
+ it('treats editable:false as locked (fast path, no row needed)', () => {
128
+ const { ctx, ed } = editingFor({
129
+ columns: [{ id: 'a', field: 'a', editable: false }],
130
+ })
131
+ expect(ed.isCellEditable(ctx.allColumns[0])).toBe(false)
132
+ })
133
+
134
+ it('honours a cell-level predicate returning false', () => {
135
+ const { ctx, ed } = editingFor({
136
+ columns: [{ id: 'a', field: 'a', editable: () => false }],
137
+ data: [{ a: 1 }],
138
+ })
139
+ expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(false)
140
+ })
141
+
142
+ it('honours a cell-level predicate returning true', () => {
143
+ const { ctx, ed } = editingFor({
144
+ columns: [{ id: 'a', field: 'a', editable: (cc: any) => cc.row.id === '0' }],
145
+ data: [{ a: 1 }],
146
+ })
147
+ expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(true)
148
+ })
149
+
150
+ it('passes a usable CellContext to the predicate', () => {
151
+ const spy = vi.fn().mockReturnValue(true)
152
+ const { ctx, ed } = editingFor({
153
+ columns: [{ id: 'a', field: 'a', editable: spy }],
154
+ data: [{ a: 'hello' }],
155
+ })
156
+ ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])
157
+ const cc = spy.mock.calls[0]![0]
158
+ expect(cc.getValue()).toBe('hello')
159
+ expect(cc.cell.getValue()).toBe('hello')
160
+ expect(cc.cell.getContext()).toBe(cc)
161
+ expect(cc.column).toBe(ctx.allColumns[0])
162
+ })
163
+
164
+ it('returns editable when predicate exists but no row supplied', () => {
165
+ const { ctx, ed } = editingFor({
166
+ columns: [{ id: 'a', field: 'a', editable: () => false }],
167
+ })
168
+ // No row -> cannot evaluate predicate -> defaults to editable.
169
+ expect(ed.isCellEditable(ctx.allColumns[0])).toBe(true)
170
+ })
171
+
172
+ it('biases to not-editable when the predicate throws', () => {
173
+ const { ctx, ed } = editingFor({
174
+ columns: [
175
+ {
176
+ id: 'a',
177
+ field: 'a',
178
+ editable: () => {
179
+ throw new Error('boom')
180
+ },
181
+ },
182
+ ],
183
+ data: [{ a: 1 }],
184
+ })
185
+ expect(ed.isCellEditable(ctx.allColumns[0], ctx.allRows[0])).toBe(false)
186
+ })
187
+ })
188
+
189
+ describe('isCellEditableAt', () => {
190
+ it('resolves row/column by index then defers to isCellEditable', () => {
191
+ const { ed } = editingFor({
192
+ columns: [
193
+ { id: 'a', field: 'a', editable: true },
194
+ { id: 'b', field: 'b', editable: false },
195
+ ],
196
+ data: [{ a: 1, b: 2 }],
197
+ })
198
+ expect(ed.isCellEditableAt(0, 0)).toBe(true)
199
+ expect(ed.isCellEditableAt(0, 1)).toBe(false)
200
+ })
201
+
202
+ it('returns false when the column index is out of range', () => {
203
+ const { ed } = editingFor()
204
+ expect(ed.isCellEditableAt(0, 99)).toBe(false)
205
+ })
206
+ })
207
+
208
+ describe('getRowColumnValue', () => {
209
+ it('reads the base value when the column id is known', () => {
210
+ const { ctx, ed } = editingFor({
211
+ columns: [{ id: 'a', field: 'a' }],
212
+ data: [{ a: 'x' }],
213
+ })
214
+ expect(ed.getRowColumnValue(ctx.allRows[0], 'a')).toBe('x')
215
+ })
216
+
217
+ it('falls back to row.getCellValueByColumnId for an unknown column', () => {
218
+ const { ctx, ed } = editingFor({
219
+ columns: [{ id: 'a', field: 'a' }],
220
+ data: [{ a: 'x', ghost: 'g' }],
221
+ })
222
+ expect(ed.getRowColumnValue(ctx.allRows[0], 'ghost')).toBe('g')
223
+ })
224
+ })
225
+
226
+ describe('getCellDisplayValue', () => {
227
+ it('returns the base value when there is no pending edit', () => {
228
+ const { ed } = editingFor()
229
+ expect(ed.getCellDisplayValue('0', 'a', 'base')).toBe('base')
230
+ })
231
+
232
+ it('prefers an edited override keyed by rowId:colId', () => {
233
+ const { ctx, ed } = editingFor()
234
+ ctx.editedCellValues['0:a'] = 'edited'
235
+ expect(ed.getCellDisplayValue('0', 'a', 'base')).toBe('edited')
236
+ })
237
+
238
+ it('treats an explicit undefined override as present', () => {
239
+ const { ctx, ed } = editingFor()
240
+ ctx.editedCellValues['0:a'] = undefined
241
+ expect(ed.getCellDisplayValue('0', 'a', 'base')).toBeUndefined()
242
+ })
243
+ })
244
+
245
+ describe('startEditingWithChar', () => {
246
+ it('seeds the editor with the typed character and sets active/selection', () => {
247
+ const { ctx, ed } = editingFor({
248
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
249
+ data: [{ a: 'x' }],
250
+ })
251
+ expect(ed.startEditingWithChar(0, 0, 'Z')).toBe(true)
252
+ expect(ctx.editingCell).toEqual({
253
+ rowId: '0',
254
+ columnId: 'a',
255
+ editorType: 'text',
256
+ value: 'Z',
257
+ // The row's data object, kept so the commit still lands if a filter
258
+ // drops the row from the model mid-edit (#49).
259
+ rowRef: ctx.internalData[0],
260
+ })
261
+ expect(ctx.editorSelectAll).toBe(false)
262
+ expect(ctx.activeCalls).toEqual([[0, 0]])
263
+ expect(ctx.selectionCalls).toEqual([[0, 0]])
264
+ })
265
+
266
+ it('defaults the editor type to text when none is declared', () => {
267
+ const { ctx, ed } = editingFor({
268
+ columns: [{ id: 'a', field: 'a' }],
269
+ data: [{ a: 'x' }],
270
+ })
271
+ ed.startEditingWithChar(0, 0, 'k')
272
+ expect(ctx.editingCell.editorType).toBe('text')
273
+ })
274
+
275
+ it('returns false when editing is globally disabled', () => {
276
+ const { ctx, ed } = editingFor({ editingEnabled: false })
277
+ expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
278
+ expect(ctx.editingCell).toBeNull()
279
+ })
280
+
281
+ it('returns false for a missing row or column', () => {
282
+ const { ed } = editingFor()
283
+ expect(ed.startEditingWithChar(99, 0, 'a')).toBe(false)
284
+ expect(ed.startEditingWithChar(0, 99, 'a')).toBe(false)
285
+ })
286
+
287
+ it('returns false for a group row', () => {
288
+ const { ed } = editingFor({
289
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
290
+ data: [{ a: 'x' }],
291
+ groupRows: new Set([0]),
292
+ })
293
+ expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
294
+ })
295
+
296
+ it('returns false for a non-editable cell', () => {
297
+ const { ed } = editingFor({
298
+ columns: [{ id: 'a', field: 'a', editable: false, editorType: 'text' }],
299
+ data: [{ a: 'x' }],
300
+ })
301
+ expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
302
+ })
303
+
304
+ it('rejects type-to-edit for checkbox/date/datetime/list/chips editors', () => {
305
+ for (const editorType of ['checkbox', 'date', 'datetime', 'list', 'chips']) {
306
+ const { ed } = editingFor({
307
+ columns: [{ id: 'a', field: 'a', editorType }],
308
+ data: [{ a: 'x' }],
309
+ })
310
+ expect(ed.startEditingWithChar(0, 0, 'a')).toBe(false)
311
+ }
312
+ })
313
+
314
+ it('rejects a non-numeric character on a number editor', () => {
315
+ const { ed } = editingFor({
316
+ columns: [{ id: 'a', field: 'a', editorType: 'number' }],
317
+ data: [{ a: 1 }],
318
+ })
319
+ expect(ed.startEditingWithChar(0, 0, 'x')).toBe(false)
320
+ })
321
+
322
+ it('accepts a numeric character on a number editor', () => {
323
+ const { ctx, ed } = editingFor({
324
+ columns: [{ id: 'a', field: 'a', editorType: 'number' }],
325
+ data: [{ a: 1 }],
326
+ })
327
+ expect(ed.startEditingWithChar(0, 0, '7')).toBe(true)
328
+ expect(ctx.editingCell.value).toBe('7')
329
+ })
330
+ })
331
+
332
+ describe('saveEditingCell', () => {
333
+ it('does nothing when there is no editing cell', () => {
334
+ const { ctx, ed } = editingFor()
335
+ ed.saveEditingCell()
336
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
337
+ })
338
+
339
+ it('parses, writes original, records edited value, and clears editing', () => {
340
+ const { ctx, ed } = editingFor({
341
+ columns: [{ id: 'b', field: 'b', editorType: 'number' }],
342
+ data: [{ b: 0 }],
343
+ })
344
+ ctx.editingCell = { rowId: '0', columnId: 'b', editorType: 'number', value: '42' }
345
+ ed.saveEditingCell()
346
+ expect(ctx.internalData[0].b).toBe(42) // parsed to number, written to original
347
+ expect(ctx.editedCellValues['0:b']).toBe(42)
348
+ expect(ctx.editingCell).toBeNull()
349
+ expect(ctx.grid.store.setState).toHaveBeenCalled()
350
+ })
351
+
352
+ it('coerces an unparseable number to null', () => {
353
+ const { ctx, ed } = editingFor({
354
+ columns: [{ id: 'b', field: 'b', editorType: 'number' }],
355
+ data: [{ b: 5 }],
356
+ })
357
+ ctx.editingCell = { rowId: '0', columnId: 'b', editorType: 'number', value: 'abc' }
358
+ ed.saveEditingCell()
359
+ expect(ctx.internalData[0].b).toBeNull()
360
+ })
361
+
362
+ it('respects editorMultiple when parsing list editors', () => {
363
+ const { ctx, ed } = editingFor({
364
+ columns: [
365
+ { id: 'a', field: 'a', editorType: 'list', editorMultiple: true },
366
+ ],
367
+ data: [{ a: [] }],
368
+ })
369
+ ctx.editingCell = {
370
+ rowId: '0',
371
+ columnId: 'a',
372
+ editorType: 'list',
373
+ value: ['x', 'y'],
374
+ }
375
+ ed.saveEditingCell()
376
+ expect(ctx.internalData[0].a).toEqual(['x', 'y'])
377
+ })
378
+
379
+ it('pushes a history step and bumps the version on a real change', () => {
380
+ const { ctx, ed } = editingFor({
381
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
382
+ data: [{ a: 'old' }],
383
+ })
384
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'new' }
385
+ ed.saveEditingCell()
386
+ expect(ctx.history).toHaveLength(1)
387
+ expect(ctx.history[0]).toMatchObject({
388
+ rowId: '0',
389
+ columnId: 'a',
390
+ field: 'a',
391
+ before: 'old',
392
+ after: 'new',
393
+ })
394
+ expect(ctx.historyPtr).toBe(0)
395
+ expect(ctx.historyVersion).toBe(1)
396
+ })
397
+
398
+ it('does not push history when the value is unchanged', () => {
399
+ const { ctx, ed } = editingFor({
400
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
401
+ data: [{ a: 'same' }],
402
+ })
403
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'same' }
404
+ ed.saveEditingCell()
405
+ expect(ctx.history).toHaveLength(0)
406
+ expect(ctx.historyVersion).toBe(0)
407
+ })
408
+
409
+ it('truncates forward (redo) history when editing after an undo', () => {
410
+ const { ctx, ed } = editingFor({
411
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
412
+ data: [{ a: 'v0' }],
413
+ })
414
+ // Pretend there is forward history the user could have redone.
415
+ ctx.history = [
416
+ { rowId: '0', columnId: 'a', field: 'a', before: 'x', after: 'y' },
417
+ { rowId: '0', columnId: 'a', field: 'a', before: 'y', after: 'z' },
418
+ ]
419
+ ctx.historyPtr = 0 // pointer is behind the tail
420
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'v1' }
421
+ ed.saveEditingCell()
422
+ // Forward step (index 1) dropped, new step appended at index 1.
423
+ expect(ctx.history).toHaveLength(2)
424
+ expect(ctx.history[1].after).toBe('v1')
425
+ expect(ctx.historyPtr).toBe(1)
426
+ })
427
+
428
+ it('caps the history at UNDO_LIMIT dropping the oldest entries', () => {
429
+ const { ctx, ed } = editingFor({
430
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
431
+ data: [{ a: 'start' }],
432
+ })
433
+ ctx.UNDO_LIMIT = 3
434
+ ctx.history = [
435
+ { rowId: '0', columnId: 'a', field: 'a', before: '0', after: '1' },
436
+ { rowId: '0', columnId: 'a', field: 'a', before: '1', after: '2' },
437
+ { rowId: '0', columnId: 'a', field: 'a', before: '2', after: '3' },
438
+ ]
439
+ ctx.historyPtr = 2
440
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'final' }
441
+ ed.saveEditingCell()
442
+ expect(ctx.history).toHaveLength(3) // capped
443
+ expect(ctx.history[2].after).toBe('final') // newest kept
444
+ expect(ctx.history[0].after).toBe('2') // oldest dropped
445
+ expect(ctx.historyPtr).toBe(2)
446
+ })
447
+
448
+ it('fires onCellValueChange with the post-write payload', () => {
449
+ const onCellValueChange = vi.fn()
450
+ const { ctx, ed } = editingFor({
451
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
452
+ data: [{ a: 'before' }],
453
+ })
454
+ ctx.props.onCellValueChange = onCellValueChange
455
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'after' }
456
+ ed.saveEditingCell()
457
+ expect(onCellValueChange).toHaveBeenCalledWith(
458
+ expect.objectContaining({
459
+ rowIndex: 0,
460
+ columnId: 'a',
461
+ oldValue: 'before',
462
+ newValue: 'after',
463
+ }),
464
+ )
465
+ })
466
+
467
+ it('clears editing even when row/column cannot be resolved', () => {
468
+ const { ctx, ed } = editingFor()
469
+ ctx.editingCell = {
470
+ rowId: 'missing',
471
+ columnId: 'missing',
472
+ editorType: 'text',
473
+ value: 'x',
474
+ }
475
+ ed.saveEditingCell()
476
+ expect(ctx.editingCell).toBeNull()
477
+ expect(ctx.history).toHaveLength(0)
478
+ })
479
+ })
480
+
481
+ describe('applyHistoryStep', () => {
482
+ const step = {
483
+ rowId: '0',
484
+ columnId: 'a',
485
+ field: 'a',
486
+ before: 'B',
487
+ after: 'A',
488
+ }
489
+
490
+ it('applies the before value on undo', () => {
491
+ const { ctx, ed } = editingFor({
492
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
493
+ data: [{ a: 'A' }],
494
+ })
495
+ ed.applyHistoryStep(step, 'undo')
496
+ expect(ctx.internalData[0].a).toBe('B')
497
+ expect(ctx.editedCellValues['0:a']).toBe('B')
498
+ expect(ctx.grid.store.setState).toHaveBeenCalled()
499
+ })
500
+
501
+ it('applies the after value on redo', () => {
502
+ const { ctx, ed } = editingFor({
503
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
504
+ data: [{ a: 'B' }],
505
+ })
506
+ ed.applyHistoryStep(step, 'redo')
507
+ expect(ctx.internalData[0].a).toBe('A')
508
+ })
509
+
510
+ it('fires onCellValueChange with swapped old/new on undo', () => {
511
+ const onCellValueChange = vi.fn()
512
+ const { ctx, ed } = editingFor({
513
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
514
+ data: [{ a: 'A' }],
515
+ })
516
+ ctx.props.onCellValueChange = onCellValueChange
517
+ ed.applyHistoryStep(step, 'undo')
518
+ expect(onCellValueChange).toHaveBeenCalledWith(
519
+ expect.objectContaining({ oldValue: 'A', newValue: 'B' }),
520
+ )
521
+ })
522
+
523
+ it('is a no-op when the row or column is missing', () => {
524
+ const { ctx, ed } = editingFor()
525
+ ed.applyHistoryStep(
526
+ { rowId: 'nope', columnId: 'a', field: 'a', before: 1, after: 2 },
527
+ 'undo',
528
+ )
529
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
530
+ })
531
+ })
532
+
533
+ describe('updateEditingCellValue', () => {
534
+ it('updates the value while preserving the rest of the editing cell', () => {
535
+ const { ctx, ed } = editingFor()
536
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'old' }
537
+ ed.updateEditingCellValue('new')
538
+ expect(ctx.editingCell).toEqual({
539
+ rowId: '0',
540
+ columnId: 'a',
541
+ editorType: 'text',
542
+ value: 'new',
543
+ })
544
+ })
545
+
546
+ it('leaves a null editing cell untouched', () => {
547
+ const { ctx, ed } = editingFor()
548
+ ed.updateEditingCellValue('x')
549
+ expect(ctx.editingCell).toBeNull()
550
+ })
551
+ })
552
+
553
+ describe('onEditorKeyDown', () => {
554
+ function fakeEvent(key: string) {
555
+ return {
556
+ key,
557
+ stopPropagation: vi.fn(),
558
+ preventDefault: vi.fn(),
559
+ } as unknown as KeyboardEvent
560
+ }
561
+
562
+ it('Enter saves the cell and refocuses the grid root', () => {
563
+ const { ctx, ed } = editingFor({
564
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
565
+ data: [{ a: 'old' }],
566
+ })
567
+ const focus = vi.fn()
568
+ ctx.gridRootEl = { focus }
569
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'new' }
570
+ const ev = fakeEvent('Enter')
571
+ ed.onEditorKeyDown(ev)
572
+ expect(ev.stopPropagation).toHaveBeenCalled()
573
+ expect(ev.preventDefault).toHaveBeenCalled()
574
+ expect(ctx.internalData[0].a).toBe('new')
575
+ expect(ctx.editingCell).toBeNull()
576
+ expect(focus).toHaveBeenCalledWith({ preventScroll: true })
577
+ })
578
+
579
+ it('Escape cancels without saving and refocuses the grid root', () => {
580
+ const { ctx, ed } = editingFor({
581
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
582
+ data: [{ a: 'old' }],
583
+ })
584
+ const focus = vi.fn()
585
+ ctx.gridRootEl = { focus }
586
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'discard' }
587
+ const ev = fakeEvent('Escape')
588
+ ed.onEditorKeyDown(ev)
589
+ expect(ctx.internalData[0].a).toBe('old') // unchanged
590
+ expect(ctx.editingCell).toBeNull()
591
+ expect(focus).toHaveBeenCalled()
592
+ })
593
+
594
+ it('stops propagation for other keys without saving or cancelling', () => {
595
+ const { ctx, ed } = editingFor()
596
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'x' }
597
+ const ev = fakeEvent('a')
598
+ ed.onEditorKeyDown(ev)
599
+ expect(ev.stopPropagation).toHaveBeenCalled()
600
+ expect(ev.preventDefault).not.toHaveBeenCalled()
601
+ expect(ctx.editingCell).not.toBeNull()
602
+ })
603
+
604
+ it('tolerates a null gridRootEl on Escape', () => {
605
+ const { ctx, ed } = editingFor()
606
+ ctx.gridRootEl = null
607
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'x' }
608
+ expect(() => ed.onEditorKeyDown(fakeEvent('Escape'))).not.toThrow()
609
+ expect(ctx.editingCell).toBeNull()
610
+ })
611
+
612
+ // #45 in the original report: Tab used to commit and then let the browser
613
+ // walk focus out of the grid, because editors stopPropagation() every key
614
+ // and nothing called preventDefault() for Tab.
615
+ it('Tab saves and advances the active cell one column (#48)', () => {
616
+ const { ctx, ed } = editingFor({
617
+ columns: [
618
+ { id: 'a', field: 'a', editorType: 'text' },
619
+ { id: 'b', field: 'b', editorType: 'text' },
620
+ ],
621
+ data: [{ a: 'old', b: 'b0' }],
622
+ })
623
+ ctx.gridRootEl = { focus: vi.fn() }
624
+ ed.onCellDoubleClick(0, 0)
625
+ ctx.editingCell = { ...ctx.editingCell, value: 'new' }
626
+ const ev = fakeEvent('Tab')
627
+ ed.onEditorKeyDown(ev)
628
+ expect(ev.preventDefault).toHaveBeenCalled()
629
+ expect(ctx.internalData[0].a).toBe('new')
630
+ expect(ctx.activeCalls.at(-1)).toEqual([0, 1])
631
+ })
632
+
633
+ it('Shift+Tab moves back a column and wraps to the previous row (#48)', () => {
634
+ const { ctx, ed } = editingFor({
635
+ columns: [
636
+ { id: 'a', field: 'a', editorType: 'text' },
637
+ { id: 'b', field: 'b', editorType: 'text' },
638
+ ],
639
+ data: [
640
+ { a: 'a0', b: 'b0' },
641
+ { a: 'a1', b: 'b1' },
642
+ ],
643
+ })
644
+ ctx.gridRootEl = { focus: vi.fn() }
645
+ ed.onCellDoubleClick(1, 0)
646
+ const ev = { ...fakeEvent('Tab'), shiftKey: true } as unknown as KeyboardEvent
647
+ ;(ev as any).preventDefault = vi.fn()
648
+ ;(ev as any).stopPropagation = vi.fn()
649
+ ed.onEditorKeyDown(ev)
650
+ // Off the left edge -> last column of the row above.
651
+ expect(ctx.activeCalls.at(-1)).toEqual([0, 1])
652
+ })
653
+ })
654
+
655
+ describe('saveEditingCell when the row leaves the row model (#49)', () => {
656
+ it('writes through the captured row when a filter hides it mid-edit', () => {
657
+ const { ctx, ed } = editingFor({
658
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
659
+ data: [{ a: 'old' }, { a: 'other' }],
660
+ })
661
+ const target = ctx.internalData[0]
662
+ ed.onCellDoubleClick(0, 0)
663
+ ctx.editingCell = { ...ctx.editingCell, value: 'typed' }
664
+ // A filter typed into the filter row drops the edited row from BOTH the
665
+ // page slice and the full filtered model while the editor is still open.
666
+ ctx._rows = ctx._rows.slice(1)
667
+ ctx._rowsBeforePagination = ctx._rows
668
+ ed.saveEditingCell()
669
+ expect(target.a).toBe('typed')
670
+ expect(ctx.editingCell).toBeNull()
671
+ })
672
+
673
+ it('still resolves a row that is only off the current page', () => {
674
+ const { ctx, ed } = editingFor({
675
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
676
+ data: [{ a: 'old' }, { a: 'other' }],
677
+ })
678
+ const target = ctx.internalData[0]
679
+ ed.onCellDoubleClick(0, 0)
680
+ ctx.editingCell = { ...ctx.editingCell, value: 'typed' }
681
+ // Paginated away: gone from `allRows`, still in the full filtered model.
682
+ ctx._rowsBeforePagination = ctx._rows
683
+ ctx._rows = ctx._rows.slice(1)
684
+ ed.saveEditingCell()
685
+ expect(target.a).toBe('typed')
686
+ })
687
+ })
688
+
689
+ describe('focusOnMount', () => {
690
+ let rafCb: FrameRequestCallback | null = null
691
+ beforeEach(() => {
692
+ rafCb = null
693
+ vi.stubGlobal('requestAnimationFrame', (cb: FrameRequestCallback) => {
694
+ rafCb = cb
695
+ return 1
696
+ })
697
+ })
698
+
699
+ function fakeInput(value: string) {
700
+ return {
701
+ value,
702
+ focus: vi.fn(),
703
+ select: vi.fn(),
704
+ setSelectionRange: vi.fn(),
705
+ }
706
+ }
707
+
708
+ it('selects all when editorSelectAll is set', () => {
709
+ const { ctx, ed } = editingFor()
710
+ ctx.editorSelectAll = true
711
+ const node = fakeInput('hello')
712
+ ed.focusOnMount(node as any)
713
+ rafCb?.(0)
714
+ expect(node.focus).toHaveBeenCalledWith({ preventScroll: true })
715
+ expect(node.select).toHaveBeenCalled()
716
+ expect(node.setSelectionRange).not.toHaveBeenCalled()
717
+ })
718
+
719
+ it('places the caret at the end when not selecting all', () => {
720
+ const { ctx, ed } = editingFor()
721
+ ctx.editorSelectAll = false
722
+ const node = fakeInput('hello')
723
+ ed.focusOnMount(node as any)
724
+ rafCb?.(0)
725
+ expect(node.setSelectionRange).toHaveBeenCalledWith(5, 5)
726
+ expect(node.select).not.toHaveBeenCalled()
727
+ })
728
+
729
+ it('swallows errors from inputs that reject selection ranges', () => {
730
+ const { ctx, ed } = editingFor()
731
+ ctx.editorSelectAll = false
732
+ const node = {
733
+ value: '2020-01-01',
734
+ focus: vi.fn(),
735
+ select: vi.fn(),
736
+ setSelectionRange: () => {
737
+ throw new Error('unsupported')
738
+ },
739
+ }
740
+ ed.focusOnMount(node as any)
741
+ expect(() => rafCb?.(0)).not.toThrow()
742
+ expect(node.focus).toHaveBeenCalled()
743
+ })
744
+ })
745
+
746
+ describe('onCellDoubleClick', () => {
747
+ it('enters edit mode seeded with the current display value', () => {
748
+ const { ctx, ed } = editingFor({
749
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
750
+ data: [{ a: 'val' }],
751
+ })
752
+ ed.onCellDoubleClick(0, 0)
753
+ expect(ctx.editorSelectAll).toBe(true)
754
+ expect(ctx.editingCell).toEqual({
755
+ rowId: '0',
756
+ columnId: 'a',
757
+ editorType: 'text',
758
+ value: 'val',
759
+ rowRef: ctx.internalData[0],
760
+ })
761
+ expect(ctx.activeCalls).toEqual([[0, 0]])
762
+ expect(ctx.selectionCalls).toEqual([[0, 0]])
763
+ })
764
+
765
+ it('prefers an edited override as the seed value', () => {
766
+ const { ctx, ed } = editingFor({
767
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
768
+ data: [{ a: 'base' }],
769
+ })
770
+ ctx.editedCellValues['0:a'] = 'override'
771
+ ed.onCellDoubleClick(0, 0)
772
+ expect(ctx.editingCell.value).toBe('override')
773
+ })
774
+
775
+ it('returns early when editing is disabled', () => {
776
+ const { ctx, ed } = editingFor({ editingEnabled: false })
777
+ ed.onCellDoubleClick(0, 0)
778
+ expect(ctx.editingCell).toBeNull()
779
+ })
780
+
781
+ it('returns early for missing row/column or group rows', () => {
782
+ const { ctx, ed } = editingFor({
783
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
784
+ data: [{ a: 'x' }],
785
+ groupRows: new Set([0]),
786
+ })
787
+ ed.onCellDoubleClick(99, 0)
788
+ ed.onCellDoubleClick(0, 99)
789
+ ed.onCellDoubleClick(0, 0) // group row
790
+ expect(ctx.editingCell).toBeNull()
791
+ })
792
+
793
+ it('returns early for a non-editable cell', () => {
794
+ const { ctx, ed } = editingFor({
795
+ columns: [{ id: 'a', field: 'a', editable: false, editorType: 'text' }],
796
+ data: [{ a: 'x' }],
797
+ })
798
+ ed.onCellDoubleClick(0, 0)
799
+ expect(ctx.editingCell).toBeNull()
800
+ })
801
+
802
+ it('is a no-op when already editing the same cell', () => {
803
+ const { ctx, ed } = editingFor({
804
+ columns: [{ id: 'a', field: 'a', editorType: 'text' }],
805
+ data: [{ a: 'x' }],
806
+ })
807
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'mid-edit' }
808
+ ed.onCellDoubleClick(0, 0)
809
+ expect(ctx.editingCell.value).toBe('mid-edit') // untouched
810
+ expect(ctx.activeCalls).toEqual([]) // setActiveCell not called
811
+ })
812
+
813
+ it('seeds a multi-select list editor with an array', () => {
814
+ const { ctx, ed } = editingFor({
815
+ columns: [
816
+ { id: 'a', field: 'a', editorType: 'list', editorMultiple: true },
817
+ ],
818
+ data: [{ a: 'one' }],
819
+ })
820
+ ed.onCellDoubleClick(0, 0)
821
+ expect(Array.isArray(ctx.editingCell.value)).toBe(true)
822
+ expect(ctx.editingCell.value).toEqual(['one'])
823
+ })
824
+
825
+ it('unwraps an array seed for a single-select list editor', () => {
826
+ const { ctx, ed } = editingFor({
827
+ columns: [{ id: 'a', field: 'a', editorType: 'list' }],
828
+ data: [{ a: ['first', 'second'] }],
829
+ })
830
+ ed.onCellDoubleClick(0, 0)
831
+ expect(ctx.editingCell.value).toBe('first')
832
+ })
833
+
834
+ it('uses empty string for a single-select chips editor seeded from an empty array', () => {
835
+ const { ctx, ed } = editingFor({
836
+ columns: [{ id: 'a', field: 'a', editorType: 'chips' }],
837
+ data: [{ a: [] }],
838
+ })
839
+ ed.onCellDoubleClick(0, 0)
840
+ expect(ctx.editingCell.value).toBe('')
841
+ })
842
+ })
843
+
844
+ describe('clipboard fallbacks (non-paste branches only)', () => {
845
+ // onGridPaste and pasteFromClipboard guard on navigator.clipboard.readText.
846
+ // The actual paste transformation is covered by clipboard.test.ts; here we
847
+ // only assert the early-return guards so we do not duplicate that coverage.
848
+
849
+ it('pasteFromClipboard returns early when the async API is unavailable', async () => {
850
+ Object.defineProperty(navigator, 'clipboard', {
851
+ value: undefined,
852
+ configurable: true,
853
+ })
854
+ const { ctx, ed } = editingFor()
855
+ await ed.pasteFromClipboard()
856
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
857
+ })
858
+
859
+ it('pasteFromClipboard swallows a rejected readText', async () => {
860
+ Object.defineProperty(navigator, 'clipboard', {
861
+ value: { readText: vi.fn().mockRejectedValue(new Error('denied')) },
862
+ configurable: true,
863
+ })
864
+ const { ctx, ed } = editingFor()
865
+ await expect(ed.pasteFromClipboard()).resolves.toBeUndefined()
866
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
867
+ })
868
+
869
+ it('onGridPaste ignores the native event when the async API is present', () => {
870
+ Object.defineProperty(navigator, 'clipboard', {
871
+ value: { readText: vi.fn() },
872
+ configurable: true,
873
+ })
874
+ const { ctx, ed } = editingFor()
875
+ const ev = {
876
+ clipboardData: { getData: () => 'a\tb' },
877
+ preventDefault: vi.fn(),
878
+ } as unknown as ClipboardEvent
879
+ ed.onGridPaste(ev)
880
+ expect(ev.preventDefault).not.toHaveBeenCalled()
881
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
882
+ })
883
+
884
+ it('onGridPaste returns early on empty clipboard text in the fallback path', () => {
885
+ Object.defineProperty(navigator, 'clipboard', {
886
+ value: undefined,
887
+ configurable: true,
888
+ })
889
+ const { ctx, ed } = editingFor()
890
+ const ev = {
891
+ clipboardData: { getData: () => '' },
892
+ preventDefault: vi.fn(),
893
+ } as unknown as ClipboardEvent
894
+ ed.onGridPaste(ev)
895
+ expect(ev.preventDefault).not.toHaveBeenCalled()
896
+ expect(ctx.grid.store.setState).not.toHaveBeenCalled()
897
+ })
898
+
899
+ it('onGridPaste applies pasted text via the fallback path', () => {
900
+ Object.defineProperty(navigator, 'clipboard', {
901
+ value: undefined,
902
+ configurable: true,
903
+ })
904
+ const { ctx, ed } = editingFor({
905
+ columns: [
906
+ { id: 'a', field: 'a', editorType: 'text', editable: true },
907
+ { id: 'b', field: 'b', editorType: 'text', editable: true },
908
+ ],
909
+ data: [
910
+ { a: '', b: '' },
911
+ { a: '', b: '' },
912
+ ],
913
+ })
914
+ ctx.selectionRange = {
915
+ anchor: { rowIndex: 0, colIndex: 0 },
916
+ focus: { rowIndex: 0, colIndex: 0 },
917
+ }
918
+ const ev = {
919
+ clipboardData: { getData: () => 'X\tY\nZ\tW' },
920
+ preventDefault: vi.fn(),
921
+ } as unknown as ClipboardEvent
922
+ ed.onGridPaste(ev)
923
+ expect(ev.preventDefault).toHaveBeenCalled()
924
+ expect(ctx.internalData[0]).toMatchObject({ a: 'X', b: 'Y' })
925
+ expect(ctx.internalData[1]).toMatchObject({ a: 'Z', b: 'W' })
926
+ })
927
+
928
+ it('onGridPaste bails while a cell is being edited (native editor paste wins)', () => {
929
+ Object.defineProperty(navigator, 'clipboard', {
930
+ value: undefined, // fallback path (Firefox / insecure) - would otherwise hijack
931
+ configurable: true,
932
+ })
933
+ const { ctx, ed } = editingFor({
934
+ columns: [{ id: 'a', field: 'a', editorType: 'text', editable: true }],
935
+ data: [{ a: 'orig' }],
936
+ })
937
+ ctx.selectionRange = { anchor: { rowIndex: 0, colIndex: 0 }, focus: { rowIndex: 0, colIndex: 0 } }
938
+ ctx.editingCell = { rowId: '0', columnId: 'a', editorType: 'text', value: 'orig' }
939
+ const ev = {
940
+ clipboardData: { getData: () => 'PASTED' },
941
+ preventDefault: vi.fn(),
942
+ } as unknown as ClipboardEvent
943
+ ed.onGridPaste(ev)
944
+ // The grid must NOT preventDefault (so the editor's native paste proceeds)
945
+ // and must NOT write to the data cell.
946
+ expect(ev.preventDefault).not.toHaveBeenCalled()
947
+ expect(ctx.internalData[0]).toMatchObject({ a: 'orig' })
948
+ })
949
+ })