Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: TableHeaderCell should not render button when not sortable #28097

Merged

Conversation

ling1726
Copy link
Member

@ling1726 ling1726 commented Jun 1, 2023

Using the approach with the smallest impact to API and slot rendering.

Previous Behavior

The slot rendered a native button always, but with role="presentation" when it was not interactive.

New Behavior

The slot renders a div by default but with ARIA button semantics when it is interactive

Related Issue(s)

Fixes #27633

Using the approach with the smallest impact to API and slot rendering.

The slot rendered a native `button` always, but with
role="presentation" when it was not interactive.

The slot always renders a `div` but with ARIA button semantics when it
is interactive

Fixes microsoft#27633
@ling1726 ling1726 marked this pull request as ready for review June 1, 2023 15:47
@ling1726 ling1726 requested a review from a team as a code owner June 1, 2023 15:47
@size-auditor
Copy link

size-auditor bot commented Jun 1, 2023

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 1a277b9c4d55bc1b7c65a73383425b1934ec1dad (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Jun 1, 2023

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
FluentProviderWithTheme virtual-rerender-with-unmount 65 65 10 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 597 582 5000
Button mount 297 296 5000
Field mount 1036 1034 5000
FluentProvider mount 684 656 5000
FluentProviderWithTheme mount 76 85 10
FluentProviderWithTheme virtual-rerender 68 59 10
FluentProviderWithTheme virtual-rerender-with-unmount 65 65 10 Possible regression
InfoButton mount 9 11 5000
MakeStyles mount 859 831 50000
Persona mount 1674 1595 5000
SpinButton mount 1265 1323 5000

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jun 1, 2023

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit ffc1fd1:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@fabricteam
Copy link
Collaborator

fabricteam commented Jun 1, 2023

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-table
DataGrid
156.269 kB
42.766 kB
156.306 kB
42.785 kB
37 B
19 B
react-table
Table (Primitives only)
44.615 kB
12.472 kB
44.652 kB
12.468 kB
37 B
-4 B
react-table
Table as DataGrid
131.923 kB
33.783 kB
131.96 kB
33.791 kB
37 B
8 B
react-table
Table (Selection only)
77.524 kB
19.166 kB
77.561 kB
19.178 kB
37 B
12 B
react-table
Table (Sort only)
76.854 kB
18.976 kB
76.891 kB
18.989 kB
37 B
13 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
65.162 kB
17.952 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
210.365 kB
58.697 kB
react-components
react-components: FluentProvider & webLightTheme
36.395 kB
11.996 kB
react-portal-compat
PortalCompatProvider
6.473 kB
2.196 kB
🤖 This report was generated against 1a277b9c4d55bc1b7c65a73383425b1934ec1dad

@fabricteam
Copy link
Collaborator

fabricteam commented Jun 1, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

@ling1726 ling1726 merged commit 93620cf into microsoft:master Jun 20, 2023
@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-docsite-components@v8.12.24 has been released which incorporates this pull request.:tada:

Handy links:

@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-monaco-editor@v1.7.101 has been released which incorporates this pull request.:tada:

Handy links:

marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Jun 20, 2023
* master: (32 commits)
  applying package updates
  feat(react-tags): add styles for size (microsoft#28229)
  docs(react-dialog): update DialogTriggerOutsideDialog to include focus behavior (microsoft#28176)
  bugfix: Ensures dialog actions stretches on breakpoints (microsoft#28258)
  applying package updates
  fix: TableHeaderCell should not render button when not sortable (microsoft#28097)
  fix(react-file-type-icons): Map mhtml extension to html icon (microsoft#28112)
  Fix overlapping axis labels on smaller viewports (microsoft#28239)
  useArrowNavigationGroup grid-linear axis (microsoft#28253)
  applying package updates
  fix: Alert example missing aria-label for icon (microsoft#28234)
  Overflow divider fix (microsoft#28011)
  feat(tools): implement `cypress-component-configuration` generator (microsoft#28115)
  chore: migrate to TS 4.7 (microsoft#28067)
  fix(scripts-tasks): make generate-api work in deterministic way (microsoft#28215)
  feat(react-tags): add overflow story (microsoft#28012)
  Structure and slots for SearchBox, using Input as a slot (microsoft#28090)
  feat(tokens): Add/update theme tokens (microsoft#27791)
  feat(react-tags): add a11y role and best practices guide (microsoft#28075)
  fix: Toast intent should always be present in the context (microsoft#28226)
  ...
@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-table@v9.4.0 has been released which incorporates this pull request.:tada:

Handy links:

@msft-fluent-ui-bot
Copy link
Collaborator

🎉@fluentui/react-components@v9.22.0 has been released which incorporates this pull request.:tada:

Handy links:

marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Jun 22, 2023
* master: (95 commits)
  docs(react-drawer): improve drawer stories examples (microsoft#28283)
  bugfix: adds grid-template-columns to DialogBody styles to ensure grid template layout (microsoft#28272)
  Doc: Tree Infinite Scrolling (microsoft#28197)
  fix(react-card): infer a11y id from immediate header element (microsoft#28266)
  Fixed bugs and added more stories to the Breadcrumb (microsoft#28267)
  refactor: Keep vanillajs code only where needed (microsoft#28278)
  fix: correcting focus behavior of react-search (microsoft#28241)
  Tooltip : updated tooltip styles (microsoft#28264)
  applying package updates
  feat(react-tags): add styles for size (microsoft#28229)
  docs(react-dialog): update DialogTriggerOutsideDialog to include focus behavior (microsoft#28176)
  bugfix: Ensures dialog actions stretches on breakpoints (microsoft#28258)
  applying package updates
  fix: TableHeaderCell should not render button when not sortable (microsoft#28097)
  fix(react-file-type-icons): Map mhtml extension to html icon (microsoft#28112)
  Fix overlapping axis labels on smaller viewports (microsoft#28239)
  useArrowNavigationGroup grid-linear axis (microsoft#28253)
  applying package updates
  fix: Alert example missing aria-label for icon (microsoft#28234)
  Overflow divider fix (microsoft#28011)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

v9 Table headers contain presentational buttons / allowed role conflict
6 participants