Merge branch '24_1' of https://github.com/DevExpress/DevExtreme into …

…24_1-List-fix-alignment-in-demos

.github/workflows/packages_publishing.yml

@@ -23,10 +23,9 @@ env:
   MOVE_STABLE_TAG: ${{ inputs.tag == 'stable' }}
 
 jobs:
-
   build:
     name: Build packages
-    runs-on: ubuntu-latest
+    runs-on: windows-latest
     outputs:
       packages: ${{ steps.filter.outputs.packages }}
     steps:
@@ -50,6 +49,19 @@ jobs:
           BUILD_INTERNAL_PACKAGE: true
         run: npm run all:build
 
+      - name: Clone deps scanner
+        uses: actions/checkout@v4
+        with:
+          repository: DevExpress/npmdeps-scanner
+          token: ${{ secrets.NPM_DEPS_SCANNER_PAT }}
+          path: deps-scanner
+
+      - name: Run deps scanner
+        run: |
+          ./deps-scanner/exe/npmDepsScanner.exe scan_cache ${{ github.workspace }} reportGithub.json
+          mkdir -p ./artifacts/deps-scanner
+          cp reportGithub.json ./artifacts/deps-scanner/
+
       - name: Build artifacts package
         run: npx ts-node tools/scripts/make-artifacts-package
 
@@ -62,9 +74,9 @@ jobs:
       - name: Filter packages
         id: filter
         working-directory: artifacts/npm
+        shell: bash
         run: ls *.tgz | grep -E -i "$FILTER" | sed -r 's/^(.*).tgz$/"\1"/g' | paste -sd "," - | sed -r 's/(.*)/packages=[\1]/' >> "$GITHUB_OUTPUT"
 
-
   publish:
     name: Publish package
     runs-on: ubuntu-latest

apps/demos/testing/known-warnings.json

@@ -1,6 +1,13 @@
 [
   "The specified credentials are invalid. You can sign up for a free developer account at http://www.bingmapsportal.com",
+  "[Vue warn]: Do not use built-in or reserved HTML elements as component id: title",
+  "[Vue warn]: Property \"",
+  "[Vue warn]: Failed to resolve component: ",
+  "Warning: forwardRef render functions accept exactly two parameters: props and ref.",
+  "Warning: %s: `ref` is not a prop.",
+  "W0001 -",
   "W0019 -",
   "W0022 -",
+  "W1011 -",
   "W2108 -"
 ]

e2e/testcafe-devextreme/tests/dataGrid/editing.ts

@@ -2289,6 +2289,30 @@ test('Popup EditForm screenshot', async (t) => {
   },
 }));
 
+// T1218553
+test('Popup EditForm screenshot when editRowKey is initially specified', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const dataGrid = new DataGrid('#container');
+
+  await t
+    .expect(await takeScreenshot('popup-edit-form-with-initial-editrowkey.png', dataGrid.element))
+    .ok()
+    .expect(dataGrid.getPopupEditForm().element.exists)
+    .ok()
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => createWidget('dxDataGrid', {
+  dataSource: getData(20, 2).map((item, index) => ({ ...item, id: index })),
+  keyExpr: 'id',
+  height: 400,
+  showBorders: true,
+  editing: {
+    mode: 'popup',
+    allowUpdating: true,
+    editRowKey: 0,
+  },
+}));
+
 // T1165529
 [
   true,

packages/devextreme/js/__internal/grids/grid_core/editing/m_editing.ts

@@ -50,6 +50,7 @@ import {
   EDIT_FORM_CLASS,
   EDIT_ICON_CLASS,
   EDIT_LINK_CLASS,
+  EDIT_MODE_POPUP,
   EDIT_MODE_ROW,
   EDIT_MODES,
   EDITING_CHANGES_OPTION_NAME,
@@ -352,6 +353,11 @@ class EditingControllerImpl extends modules.ViewController {
     return result;
   }
 
+  protected isPopupEditMode() {
+    const editMode = this.option('editing.mode');
+    return editMode === EDIT_MODE_POPUP;
+  }
+
   private _isButtonVisible(button, options) {
     const { visible } = button;
 

packages/devextreme/js/__internal/grids/grid_core/editing/m_editing_form_based.ts

@@ -25,7 +25,6 @@ import {
   DATA_EDIT_DATA_INSERT_TYPE,
   EDIT_FORM_ITEM_CLASS,
   EDIT_MODE_FORM,
-  EDIT_MODE_POPUP,
   EDIT_POPUP_CLASS,
   EDIT_POPUP_FORM_CLASS,
   EDITING_EDITROWKEY_OPTION_NAME,
@@ -59,13 +58,12 @@ const editingControllerExtender = (Base: ModuleType<EditingController>) => class
     super.init();
   }
 
-  private isFormOrPopupEditMode() {
-    return this.isPopupEditMode() || this.isFormEditMode();
+  public isEditRow(rowIndex) {
+    return !this.isPopupEditMode() && super.isEditRow(rowIndex);
   }
 
-  private isPopupEditMode() {
-    const editMode = this.option('editing.mode');
-    return editMode === EDIT_MODE_POPUP;
+  private isFormOrPopupEditMode() {
+    return this.isPopupEditMode() || this.isFormEditMode();
   }
 
   private isFormEditMode() {

packages/devextreme/js/__internal/grids/grid_core/editing/m_editing_row_based.ts

@@ -34,7 +34,8 @@ const editingControllerExtender = (Base: ModuleType<EditingController>) => class
 
   protected _isDefaultButtonVisible(button, options) {
     const isRowMode = this.isRowBasedEditMode();
-    const isEditRow = options.row && equalByValue(options.row.key, this.option(EDITING_EDITROWKEY_OPTION_NAME));
+    const isPopupEditMode = this.isPopupEditMode();
+    const isEditRow = !isPopupEditMode && options.row && equalByValue(options.row.key, this.option(EDITING_EDITROWKEY_OPTION_NAME));
 
     if (isRowMode) {
       switch (button.name) {

packages/devextreme/js/__internal/grids/grid_core/views/m_grid_view.ts

@@ -4,6 +4,7 @@ import type { dxElementWrapper } from '@js/core/renderer';
 import $ from '@js/core/renderer';
 import browser from '@js/core/utils/browser';
 import { deferRender, deferUpdate } from '@js/core/utils/common';
+import type { DeferredObj } from '@js/core/utils/deferred';
 import { Deferred, when } from '@js/core/utils/deferred';
 import { each } from '@js/core/utils/iterator';
 import { getBoundingRect } from '@js/core/utils/position';
@@ -646,9 +647,10 @@ export class ResizingController extends modules.ViewController {
   /**
    * @extended: virtual_scrolling
    */
-  public resize() {
+  public resize(): DeferredObj<unknown> {
     if (this.component._requireResize) {
-      return;
+      // @ts-expect-error
+      return new Deferred().resolve();
     }
 
     // @ts-expect-error

packages/devextreme/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts

@@ -1,6 +1,7 @@
 /* eslint-disable max-classes-per-file */
 import $ from '@js/core/renderer';
 import browser from '@js/core/utils/browser';
+import type { DeferredObj } from '@js/core/utils/deferred';
 import { Deferred, when } from '@js/core/utils/deferred';
 import { isElementInDom } from '@js/core/utils/dom';
 import { each } from '@js/core/utils/iterator';
@@ -1319,7 +1320,7 @@ export const resizing = (Base: ModuleType<ResizingController>) => class VirtualS
     return !!this._resizeTimeout;
   }
 
-  public resize() {
+  public resize(): DeferredObj<unknown> {
     let result;
 
     if (isVirtualMode(this) || gridCoreUtils.isVirtualRowRendering(this)) {

packages/devextreme/js/__internal/grids/tree_list/editing/m_editing.ts

@@ -183,7 +183,7 @@ const rowsView = (Base: ModuleType<RowsView>) => class TreeListEditingRowsViewEx
     const isEditRow = options.row && editingController.isEditRow(options.row.rowIndex);
     const isEditing = options.isEditing || isEditRow;
 
-    if (!isEditing) {
+    if (!options.isOnForm && !isEditing) {
       // @ts-expect-error
       return super._renderCellCommandContent.apply(this, arguments);
     }

packages/devextreme/js/__internal/ui/collection/base.ts

@@ -26,12 +26,18 @@ declare class Base<
 > extends Widget<TProperties> {
   getDataSource(): DataSource<TItem, TKey>;
 
-  _renderItems(items: unknown): void;
+  _renderItems(items: TItem[]): void;
   _renderItem(
     index: number,
     itemData: TItem,
     $container: dxElementWrapper,
-    $itemToReplace: dxElementWrapper,
+    $itemToReplace?: dxElementWrapper,
+  ): dxElementWrapper;
+  _renderItemFrame(
+    index: number,
+    itemData: TItem,
+    $container: dxElementWrapper,
+    $itemToReplace?: dxElementWrapper,
   ): dxElementWrapper;
   _renderItemContent(args: {
     index: number;
@@ -51,12 +57,31 @@ declare class Base<
     args: { itemData: unknown }): void;
 
   _getItemData(item: Element | HTMLElement | dxElementWrapper): TItem;
+  _getItemContent($item: dxElementWrapper): dxElementWrapper;
   _getIndexByItem(item: TItem): number;
   _getIndexByItemData(item: TItem): number;
+  _getAvailableItems($items?: dxElementWrapper): dxElementWrapper;
+  _getSummaryItemsSize(dimension: string, items: TItem[], includeMargin: boolean): number;
+  _getActiveItem(last?: boolean): dxElementWrapper;
   _findItemElementByItem(item: TItem): dxElementWrapper;
 
   _itemOptionChanged(item: TItem, property: string, value: unknown, prevValue: unknown): void;
   _itemEventHandler($item: dxElementWrapper, eventName: string, eventData: unknown): void;
+  _itemIndexKey(): number;
+
+  _prevItem($items: dxElementWrapper): dxElementWrapper;
+  _nextItem($items: dxElementWrapper): dxElementWrapper;
+
+  _attachContextMenuEvent(): void;
+  _itemContextMenuHandler(event: unknown): void;
+  _itemPointerDownHandler(event: unknown): void;
+  _itemDXEventHandler(event: unknown, eventHandlerName: string, args: unknown, actionConfig: {
+    beforeExecute: (args?: unknown) => void;
+    afterExecute: () => void;
+  }): void;
+
+  _refreshActiveDescendant($target: dxElementWrapper): void;
+  _moveFocus(location: string, event?: unknown): void;
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

packages/devextreme/js/__internal/ui/collection/edit.ts

@@ -13,6 +13,8 @@ declare class Edit<
     TKey = any,
 > extends CollectionWidgetBase<TProperties> {
   _processSelectableItem($itemElement: dxElementWrapper, isSelected: boolean): void;
+  _setAriaSelectionAttribute($itemElement: dxElementWrapper, isSelected: string): void;
+  _clearSelectedItems(): void;
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

packages/devextreme/js/__internal/ui/collection/hierarchical.ts

@@ -0,0 +1,49 @@
+import type { dxElementWrapper } from '@js/core/renderer';
+import type { ItemLike } from '@js/ui/collection/ui.collection_widget.base';
+import type { HierarchicalCollectionWidgetOptions } from '@js/ui/hierarchical_collection/ui.hierarchical_collection_widget';
+import HierarchicalCollectionWidget from '@js/ui/hierarchical_collection/ui.hierarchical_collection_widget';
+
+import CollectionWidgetEdit from './edit';
+
+export interface TypedCollectionWidgetOptions<
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TComponent extends HierarchicalCollectionWidget<any, TItem, TKey>,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TItem extends ItemLike = any,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TKey = any,
+> extends HierarchicalCollectionWidgetOptions<TComponent, TItem, TKey> {
+}
+
+declare class Hierarchical<
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TProperties extends TypedCollectionWidgetOptions<any, TItem, TKey>,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TItem extends ItemLike = any,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    TKey = any,
+> extends CollectionWidgetEdit<TProperties> {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  _dataAdapter?: any;
+
+  _initDataAdapter(): void;
+
+  _getIconContainer(itemData: TItem): dxElementWrapper;
+  _getTextContainer(itemData: TItem): dxElementWrapper;
+  _getLinkContainer(
+    iconContainer: dxElementWrapper,
+    textContainer: dxElementWrapper,
+    itemData: TItem,
+  ): dxElementWrapper;
+  _addContent($container: dxElementWrapper, itemData: TItem): void;
+
+  _addWidgetClass(): void;
+
+  _getChildNodes(node: TItem): TItem[];
+  _hasChildren(node: TItem): number | undefined;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const TypedCollectionWidget: typeof Hierarchical = HierarchicalCollectionWidget as any;
+
+export default TypedCollectionWidget;