Skip to content

fix(data-grid/text-cell): pass accessibilityTitle to prefix and suffix icons#2487

Open
Ricardo-Tele wants to merge 2 commits intotelekom:mainfrom
Ricardo-Tele:fix/data-grid-icon-accessibility
Open

fix(data-grid/text-cell): pass accessibilityTitle to prefix and suffix icons#2487
Ricardo-Tele wants to merge 2 commits intotelekom:mainfrom
Ricardo-Tele:fix/data-grid-icon-accessibility

Conversation

@Ricardo-Tele
Copy link
Copy Markdown
Contributor

Fixes #2194
The accessibilityTitle is now forwarded to prefix and suffix icons rendered in data grid text cells. This improves accessibility for screen reader users. Regression tests were added to cover the updated behavior.

Copilot AI review requested due to automatic review settings April 22, 2026 14:24
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses issue #2194 by ensuring accessibilityTitle values are forwarded to prefix/suffix icons rendered in Data Grid text cells, improving screen-reader support for icon-only affordances in cells.

Changes:

  • Extend the Data Grid text cell renderer to pass accessibility-title to prefix/suffix icon components (with label as fallback).
  • Add unit tests verifying explicit and fallback accessibility titles for text-cell prefix/suffix icons.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.

File Description
packages/components/src/components/data-grid/cell-handlers/text-cell.tsx Forwards accessibility-title to dynamically-rendered prefix/suffix icon tags, falling back to the field label.
packages/components/src/components/data-grid/data-grid.spec.ts Adds regression tests for forwarding and fallback behavior for text cell icon accessibility titles.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +49 to +53
expect(icons).toHaveLength(2);
expect(icons[0].getAttribute('accessibility-title')).toBe('Status');
expect(icons[0].querySelector('title').textContent).toBe('Status');
expect(icons[1].getAttribute('accessibility-title')).toBe('Status');
expect(icons[1].querySelector('title').textContent).toBe('Status');
Comment thread packages/components/src/components/data-grid/data-grid.spec.ts
Comment on lines +6 to +12
beforeEach(() => {
(global as any).ResizeObserver = class {
observe() {}
unobserve() {}
disconnect() {}
};
});
Comment on lines +25 to +30
expect(icons[0].getAttribute('accessibility-title')).toBe(
'Download attachment'
);
expect(icons[0].querySelector('title').textContent).toBe(
'Download attachment'
);
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses issue #2194 by ensuring accessibilityTitle information is forwarded to prefix/suffix icons rendered inside data grid text cells, improving screen-reader support.

Changes:

  • Forward iconPrefixAccessibilityTitle / iconSuffixAccessibilityTitle to the rendered scale-icon-* elements in TextCell, with a fallback to the column label.
  • Add Stencil spec tests validating the forwarded icon accessibility titles and the label fallback behavior.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File Description
packages/components/src/components/data-grid/cell-handlers/text-cell.tsx Passes accessibility-title to prefix/suffix icons, defaulting to the field label.
packages/components/src/components/data-grid/data-grid.spec.ts Adds regression tests covering the new forwarding behavior and fallback behavior.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +87 to +89
{h(`scale-icon-${iconPrefix}`, {
'accessibility-title': iconPrefixAccessibilityTitle ?? label,
})}
Comment on lines +95 to +97
{h(`scale-icon-${iconSuffix}`, {
'accessibility-title': iconSuffixAccessibilityTitle ?? label,
})}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Accessibility | Data grid Component text cell icon add accessibilityTitle

2 participants