-
Notifications
You must be signed in to change notification settings - Fork 417
Description
Version
4.21.19
Summary
I found the cause of a paste-related issue when virtual scrolling is enabled.
Rows added through resetData() or appendRows()—especially right after a paste—may not contain all column fields.
Because these rows are not rendered yet (due to virtual scrolling), their underlying row objects are incomplete.
This leads to unexpected errors during:
- internal cell rendering
- column copy & paste
- resetData() and appendRows()
Root Cause
Rows that are created but not yet rendered (because they are outside the viewport while virtual scrolling is active) may lack fields for columns defined in column.allColumns.
These incomplete row objects cause errors when the grid later tries to read or update those missing fields during paste or rendering operations.
Fix / Workaround
I added a preprocessing step in createData() that normalizes each row before raw/view data is created.
Each row is guaranteed to include all defined column fields.
Missing fields are filled with null, ensuring a consistent schema for all rows.
function createData(id, data, column, _a) {
var _b = _a.lazyObservable, lazyObservable = _b === void 0 ? false : _b, prevRows = _a.prevRows, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
generateDataCreationKey();
var keyColumnName = column.keyColumnName, _d = column.treeColumnName, treeColumnName = _d === void 0 ? '' : _d;
var rawData;
// Notify when using deprecated option "_attribute.rowSpan".
var isUseRowSpanOption = data.some(function (row) { var _a; return (_a = row._attributes) === null || _a === void 0 ? void 0 : _a.rowSpan; });
if (isUseRowSpanOption) {
// eslint-disable-next-line no-console
console.warn('The option "_attribute.rowSpan" is deprecated. Please use rowSpan option of column.\nFollow example: http://nhn.github.io/tui.grid/latest/tutorial-example29-dynamic-row-span');
}
// (HIER) Normalize row fields to match all defined columns
data = data.map(row => {
column.allColumns.forEach(col => {
if (row[col.name] === undefined) {
row[col.name] = null;
}
});
return row;
});
if (treeColumnName) {
rawData = tree_1.createTreeRawData({
id: id,
data: data,
column: column,
keyColumnName: keyColumnName,
lazyObservable: lazyObservable,
disabled: disabled,
});
}
else {
rawData = data.map(function (row, index, rows) {
return createRawRow(id, row, index, column, {
keyColumnName: keyColumnName,
prevRow: prevRows ? prevRows[index] : rows[index - 1],
lazyObservable: lazyObservable,
disabled: disabled,
});
});
}
var viewData = rawData.map(function (row) {
return lazyObservable
? { rowKey: row.rowKey, sortKey: row.sortKey, uniqueKey: row.uniqueKey }
: createViewRow(id, row, rawData, column);
});
return { rawData: rawData, viewData: viewData };
}