From f8adc007da122c16933d742cea123d36cc6ba76d Mon Sep 17 00:00:00 2001 From: Roman Semenov Date: Thu, 9 Nov 2023 17:44:25 +0400 Subject: [PATCH] TreeList and DataGrid always show the W1025 warning regardless of the height option value or CSS limiting the component height (T1196939) (#25974) --- .../grids/grid_core/views/m_rows_view.ts | 2 +- .../virtual_scrolling/m_virtual_scrolling.ts | 10 ++++- testing/testcafe/tests/dataGrid/scrolling.ts | 45 +++++++++++++++++++ 3 files changed, 54 insertions(+), 3 deletions(-) diff --git a/js/__internal/grids/grid_core/views/m_rows_view.ts b/js/__internal/grids/grid_core/views/m_rows_view.ts index f07e8f1aef18..c1507ca15e7a 100644 --- a/js/__internal/grids/grid_core/views/m_rows_view.ts +++ b/js/__internal/grids/grid_core/views/m_rows_view.ts @@ -897,7 +897,7 @@ class RowsView extends ColumnsView { that._scrollTop = 0; that._scrollLeft = -1; that._scrollRight = 0; - that._hasHeight = false; + that._hasHeight = undefined; that._contentChanges = []; dataController.loadingChanged.add((isLoading, messageText) => { that.setLoading(isLoading, messageText); diff --git a/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts b/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts index c8164ff26071..14e06b7dba2b 100644 --- a/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts +++ b/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts @@ -485,8 +485,6 @@ const VirtualScrollingRowsViewExtender = (function () { const changeType = change && change.changeType; const d: any = Deferred(); - this.throwHeightWarningIfNeed(); - const contentTable = contentElement.children().first(); if (changeType === 'append' || changeType === 'prepend') { this.waitAsyncTemplates().done(() => { @@ -749,7 +747,13 @@ const VirtualScrollingRowsViewExtender = (function () { this.callBase.call(this, isLoading, messageText); }, + // NOTE: warning won't be thrown if height was specified and then removed, + // because for some reason `_hasHeight` is not updated properly in this case throwHeightWarningIfNeed() { + if (this._hasHeight === undefined) { + return; + } + const needToThrow = !this._hasHeight && isVirtualPaging(this); if (needToThrow && !this._heightWarningIsThrown) { this._heightWarningIsThrown = true; @@ -763,6 +767,8 @@ const VirtualScrollingRowsViewExtender = (function () { that.callBase(); + this.throwHeightWarningIfNeed(); + if (that.component.$element() && !that._windowScroll && isElementInDom($element)) { that._windowScroll = subscribeToExternalScrollers($element, (scrollPos) => { if (!that._hasHeight && that._rowHeight) { diff --git a/testing/testcafe/tests/dataGrid/scrolling.ts b/testing/testcafe/tests/dataGrid/scrolling.ts index be6edf75b43e..5d0aff8f3d66 100644 --- a/testing/testcafe/tests/dataGrid/scrolling.ts +++ b/testing/testcafe/tests/dataGrid/scrolling.ts @@ -1,5 +1,6 @@ import { ClientFunction, Selector } from 'testcafe'; import { createScreenshotsComparer } from 'devextreme-screenshot-comparer'; +import { removeStylesheetRulesFromPage, insertStylesheetRulesToPage } from '../../helpers/domUtils'; import url from '../../helpers/getPageUrl'; import createWidget from '../../helpers/createWidget'; import DataGrid from '../../model/dataGrid'; @@ -1624,8 +1625,52 @@ test('Warning should be thrown if scrolling is virtual and height is not specifi scrolling: { mode: 'virtual', }, + dataSource: [ + { column: 'value' }, + ], +})); + +test('Warning should not be thrown if scrolling is virtual and height is specified with option', async (t) => { + const consoleMessages = await t.getBrowserConsoleMessages(); + const warningExists = !!consoleMessages?.warn.find((message) => message.startsWith('W1025')); + + await t.expect(warningExists).notOk(); +}).before(async () => createWidget('dxDataGrid', { + scrolling: { + mode: 'virtual', + }, + dataSource: [ + { column: 'value' }, + ], + height: 200, })); +['height', 'max-height'].forEach((cssOption) => { + test(`Warning should not be thrown if scrolling is virtual and height is specified with css (${cssOption})`, async (t) => { + const consoleMessages = await t.getBrowserConsoleMessages(); + const warningExists = !!consoleMessages?.warn.find((message) => message.startsWith('W1025')); + + await t.expect(warningExists).notOk(); + }).before(async () => { + await insertStylesheetRulesToPage(` + #container { + ${cssOption}: 200px; + } + `); + + await createWidget('dxDataGrid', { + scrolling: { + mode: 'virtual', + }, + dataSource: [ + { column: 'value' }, + ], + }); + }).after(async () => { + await removeStylesheetRulesFromPage(); + }); +}); + // T1194796 test('The row alternation should display correctly when grouping and virtual scrolling are enabled', async (t) => { const dataGrid = new DataGrid('#container');