Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
79 changes: 79 additions & 0 deletions e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2117,3 +2117,82 @@ test('Horizontal scrollbar should not appear when columnHidingEnabled is true an
useNative: true,
},
}));

test('navigateToRow should scroll to the correct row with virtual scrolling (T1220800)', async (t) => {
const dataGrid = new DataGrid('#container');
const targetKey = 901;

await t.expect(dataGrid.isReady()).ok();

// act
await dataGrid.apiNavigateToRow(targetKey);

// assert
await t
.expect(dataGrid.isReady())
.ok()
.expect(dataGrid.getDataCells(0).nth(0).textContent)
.eql(String(targetKey));

const visibleRows = await dataGrid.apiGetVisibleRows();

await t.expect(visibleRows[0].key).eql(targetKey, `Row with key ${targetKey} should be the first visible row after navigation`);
}).before(async (t) => {
const initStore = ClientFunction(() => {
const getItems = (): Record<string, unknown>[] => {
const items: Record<string, unknown>[] = [];
for (let i = 0; i < 1000000; i += 1) {
items.push({
ID: i + 1,
Name: `Name ${i + 1}`,
Description: `Text text text text text text text text text text ${i + 1}`,
});
}
return items;
};

(window as any).myStore = new (window as any).DevExpress.data.ArrayStore({
key: 'ID',
data: getItems(),
});
});

await initStore.with({ boundTestRun: t })();

return createWidget('dxDataGrid', () => ({
dataSource: new (window as any).DevExpress.data.CustomStore({
key: 'ID',
loadMode: 'raw',
load(loadOptions) {
return new Promise((resolve) => {
(window as any).myStore.load(loadOptions).done((data) => {
resolve(data);
});
});
},
totalCount() {
return (window as any).myStore.totalCount();
},
}),
width: 900,
height: 250,
wordWrapEnabled: true,
showBorders: true,
scrolling: {
mode: 'virtual',
rowRenderingMode: 'virtual',
useNative: false,
},
paging: {
pageSize: 20,
},
columns: [
{
dataField: 'ID',
width: 90,
},
'Name',
'Description',
],
}));
});
Original file line number Diff line number Diff line change
Expand Up @@ -321,7 +321,7 @@ class VirtualScrollController {
}
});

return Math.floor(offset + itemCount * this._viewportItemSize * this._sizeRatio);
return offset + itemCount * this._viewportItemSize * this._sizeRatio;
}

private getContentOffset(type) {
Expand Down
12 changes: 11 additions & 1 deletion packages/testcafe-models/dataGrid/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -181,10 +181,18 @@ export default class DataGrid extends GridCore {
return this.getRowsView().find(`.${CLASS.row}`);
}

getDataRows(): Selector {
return this.getRows().filter(`.${CLASS.dataRow}`);
}

getCells(): Selector {
return this.getRowsView().find('td');
}

getDataCells(rowIndex: number): Selector {
return this.getDataRows().nth(rowIndex).find('td');
}

getDataRow(index: number): DataRow {
return new DataRow(this.element.find(`.${CLASS.dataRow}[aria-rowindex='${index + 1}']`), this.getName());
}
Expand Down Expand Up @@ -926,8 +934,10 @@ export default class DataGrid extends GridCore {
const isElementInRowsView = (element) => {
const rowsViewRect = rowsViewElement[0].getBoundingClientRect();
const elementRect = element.getBoundingClientRect();
const tolerance = 1;

return elementRect.top >= rowsViewRect.top && elementRect.bottom <= rowsViewRect.bottom;
return elementRect.top >= rowsViewRect.top - tolerance
&& elementRect.bottom <= rowsViewRect.bottom + tolerance;
};
const rowElement = rowsViewElement.find('.dx-row-focused');

Expand Down
Loading