DataGrid/TreeList: The click area on the separator must be at least 24 x 24 px by markallenramirez · Pull Request #35413 · DevExpress/DevExtreme

markallenramirez · 2026-09-30T09:09:57Z

No description provided.

Copilot

Copilot review overview

🟡 Changes recommended

An existing touch-resizing QUnit assertion is incompatible with the new final separator position.

Review effort: Balanced
Findings: 1

Open (1)

Update touch resizing test for separator position and hit area · New

What changed in this PR

Expands the DataGrid/TreeList column-resize target to 24px.

Changes:

Enlarges and centers the transparent separator hit area.
Manages pointer events and separator positioning during resizing.

File	Description
`m_columns_resizing_reordering.ts`	Updates resize hit detection and separator state.
`_index.scss`	Sets the transparent separator width to 24px.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Copilot

Copilot review overview

🔵 Needs a closer look

The new final separator repositioning leaves an existing touch-start QUnit assertion stale and guaranteed to fail.

Review effort: Balanced
Findings: 1

Open (1)

Update touch resizing test for separator position and hit area

Copilot

Copilot review overview

🟡 Changes recommended

Separator positioning breaks an existing assertion, and overlapping targets can make narrow-column boundaries unreachable.

Review effort: Balanced
Findings: 1

Open (1)

Resolve overlapping hit regions by nearest boundary · New

Resolved since last review (1)

Update touch resizing test for separator position and hit area

        that._targetPoint = that._getTargetPoint(
          that.pointsByColumns(),
          eventData,
-          columnsSeparatorWidth,
+          deltaX,
        );


Copilot

Copilot review overview

🟡 Changes recommended

The new method calls break existing QUnit tests whose shared separator mock lacks the method.

Review effort: Balanced
Findings: 1 · 1

Open (2)

Add changePointerEvents to MockColumnsSeparatorView · New
Resolve overlapping hit regions by nearest boundary

        that._isReadyResizing = false;

        if (that._targetPoint) {
+          that._columnsSeparatorView.changePointerEvents('auto');


Copilot

Copilot review overview

🟡 Changes recommended

Grid coverage must use Jest, and the changed touch boundary currently lacks regression tests.

Review effort: Balanced
Findings: 1 · 1 · 1

Open (3)

Add changePointerEvents to MockColumnsSeparatorView
Resolve overlapping hit regions by nearest boundary
Move grid coverage from QUnit to the Jest integration suite · New

Previously missed (1)

In code that hasn't changed since last review

Add Jest boundary tests for the 12px touch hit range

packages/devextreme/js/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts:970

The new touch hit range is not covered at its changed boundary. Existing touch tests start directly on the separator or 10 px away, while the added TestCafe test exercises mouse input, so reverting this calculation to the old 10 px constant would still pass. Add Jest touch-start cases at 12 px (accepted) and just beyond 12 px (rejected).

        assert.equal(columnsSeparator.element().css('cursor'), 'col-resize', 'cursor');
    });

+    QUnit.test('changePointerEvents', function(assert) {


Copilot

🟢 Approval recommended

The shared grid implementation, styling, mocks, and regression coverage consistently implement the expanded resize target.

3 open findings

Add changePointerEvents to MockColumnsSeparatorView
Resolve overlapping hit regions by nearest boundary
Move grid coverage from QUnit to the Jest integration suite

🧠 Review effort: Balanced

Copilot

🟡 Changes recommended

Overlapping targets select the wrong separator for narrow columns, and a debug directive is unmatched.

4 open findings

Add missing #DEBUG opener for test-only field · New
Add changePointerEvents to MockColumnsSeparatorView
Resolve overlapping hit regions by nearest boundary
Move grid coverage from QUnit to the Jest integration suite

🧠 Review effort: Balanced

markallenramirez self-assigned this Sep 30, 2026

markallenramirez added the 26_2 label Sep 30, 2026

markallenramirez requested a review from a team as a code owner September 30, 2026 09:09

Copilot AI balanced review requested due to automatic review settings September 30, 2026 09:09

Copilot started reviewing on behalf of markallenramirez September 30, 2026 09:10 View session

Copilot AI reviewed Sep 30, 2026

View reviewed changes

Comment thread ...e/js/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts Outdated

Copilot AI balanced review requested due to automatic review settings October 2, 2026 11:43

Copilot started reviewing on behalf of markallenramirez October 2, 2026 11:44 View session

Copilot AI reviewed Oct 2, 2026

View reviewed changes

Copilot AI balanced review requested due to automatic review settings October 6, 2026 13:07

markallenramirez force-pushed the a11y_grids_separator/main branch from be54652 to a2c1123 Compare October 6, 2026 13:07

Copilot started reviewing on behalf of markallenramirez October 6, 2026 13:08 View session

Copilot AI reviewed Oct 6, 2026

View reviewed changes

Comment thread ...e/js/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts

Comment on lines 877 to 881

that._targetPoint = that._getTargetPoint(

that.pointsByColumns(),

eventData,

columnsSeparatorWidth,

deltaX,

);

Copilot AI balanced review requested due to automatic review settings October 6, 2026 14:35

Copilot started reviewing on behalf of markallenramirez October 6, 2026 14:35 View session

Copilot AI reviewed Oct 6, 2026

View reviewed changes

Comment thread ...e/js/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts

that._isReadyResizing = false;

if (that._targetPoint) {

that._columnsSeparatorView.changePointerEvents('auto');

Copilot AI balanced review requested due to automatic review settings October 6, 2026 14:57

Copilot started reviewing on behalf of markallenramirez October 6, 2026 14:58 View session

Copilot AI reviewed Oct 6, 2026

View reviewed changes

Comment thread ...xtreme/testing/tests/DevExpress.ui.widgets.dataGrid/columnsResizingReorderingModule.tests.js

assert.equal(columnsSeparator.element().css('cursor'), 'col-resize', 'cursor');

});

QUnit.test('changePointerEvents', function(assert) {

Copilot AI balanced review requested due to automatic review settings October 7, 2026 14:52

Copilot started reviewing on behalf of markallenramirez October 7, 2026 14:52 View session

markallenramirez added 6 commits October 7, 2026 18:53

fix

376a1bc

test

ecbe9e4

extend existing test

7f302b8

fix2

faa1a80

test2

9607981

extending existing test2

b37441b

markallenramirez force-pushed the a11y_grids_separator/main branch from 32b6b64 to b37441b Compare October 7, 2026 14:54

Copilot AI reviewed Oct 7, 2026

View reviewed changes

Copilot AI balanced review requested due to automatic review settings October 7, 2026 14:55

Copilot started reviewing on behalf of markallenramirez October 7, 2026 14:55 View session

Copilot AI reviewed Oct 7, 2026

View reviewed changes

Comment thread ...e/js/__internal/grids/grid_core/columns_resizing_reordering/m_columns_resizing_reordering.ts

Navigation Menu

Repository navigation

DataGrid/TreeList: The click area on the separator must be at least 24 x 24 px - #35413

DataGrid/TreeList: The click area on the separator must be at least 24 x 24 px#35413
markallenramirez wants to merge 6 commits into
DevExpress:mainfrom
markallenramirez:a11y_grids_separator/main

markallenramirez commented Sep 30, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

This branch has not been deployed

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

markallenramirez commented Sep 30, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🔵 Needs a closer look

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Copilot review overview

🟡 Changes recommended

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟢 Approval recommended

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Uh oh!

Uh oh!

This branch has not been deployed

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants