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.

Sign up for GitHub

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

Jump to bottom

fix: fix Tabs a11y issue #52677

Merged
merged 3 commits into from
Feb 7, 2025
Merged

fix: fix Tabs a11y issue #52677

merged 3 commits into from
Feb 7, 2025
+17 −151

Conversation

afc163
Copy link
Member

@afc163 afc163 commented Feb 7, 2025

中文版模板 / Chinese template

🤔 This is a ...

  • 🆕 New feature
  • 🐞 Bug fix
  • 📝 Site / documentation improvement
  • 📽️ Demo improvement
  • 💄 Component style improvement
  • 🤖 TypeScript definition improvement
  • 📦 Bundle size optimization
  • ⚡️ Performance optimization
  • ⭐️ Feature enhancement
  • 🌐 Internationalization
  • 🛠 Refactoring
  • 🎨 Code style optimization
  • ✅ Test Case
  • 🔀 Branch merge
  • ⏩ Workflow
  • ❓ Other (about what?)

🔗 Related Issues

  • Describe the source of related requirements, such as links to relevant issue discussions.
  • For example: close #xxxx, fix #xxxx

react-component/tabs#775

💡 Background and Solution

  • The specific problem to be addressed.
  • List the final API implementation and usage if needed.
  • If there are UI/interaction changes, consider providing screenshots or GIFs.

📝 Change Log

Language Changelog
🇺🇸 English Improve Tabs accessibility by fixing error Certain ARIA roles must contain particular children.
🇨🇳 Chinese 优化 Tabs 组件的可访问性，修复 Certain ARIA roles must contain particular children 的报错。

Sorry, something went wrong.

@stackblitz StackBlitz
Copy link

stackblitz bot commented Feb 7, 2025

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@cloudflare-workers-and-pages Cloudflare Workers and Pages
Copy link

cloudflare-workers-and-pages bot commented Feb 7, 2025 •
edited
Loading

Deploying ant-design with  Cloudflare Pages  Cloudflare Pages

Latest commit: 775110f
Status: ✅  Deploy successful!
Preview URL: https://ad9eb8e8.ant-design.pages.dev
Branch Preview URL: https://chore-upgrade-tabs.ant-design.pages.dev

View logs

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 7, 2025 •
edited by afc163
Loading

👁 Visual Regression Report for PR #52677 Failed ❌

🎯 Target branch: master (36c308c)
📖 View Full Report ↗︎
📊 Summary: 🔄 1 changed

Expected (Branch master) Actual (Current PR) Diff
input-group.compact.png input-group.compact.png input-group.compact.css-var.png input-group.compact.css-var.png

Important

There are 1 diffs found in this PR: 🔄 1 changed.
Please check all items:

  • Visual diff is acceptable

Sorry, something went wrong.

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 7, 2025 •
edited
Loading

Preview is ready

@petercat-assistant PeterCat-assistant
Copy link

Walkthrough

This pull request enhances the accessibility of the Tabs component by addressing an ARIA role compliance issue. The update ensures that specific ARIA roles contain the required children, improving the component's usability for assistive technologies.

Changes

Files Summary
components/card/tests/snapshots/demo-extend.test.ts.snap, components/card/tests/snapshots/demo.test.ts.snap Minor snapshot updates with 6 changes each.
components/card/tests/snapshots/index.test.tsx.snap Snapshot update with 4 changes.
components/config-provider/tests/snapshots/components.test.tsx.snap Snapshot update with 14 changes.
components/splitter/tests/snapshots/demo-extend.test.ts.snap, components/splitter/tests/snapshots/demo.test.ts.snap Minor snapshot updates with 2 changes each.
components/tabs/tests/snapshots/demo-extend.test.ts.snap, components/tabs/tests/snapshots/demo.test.ts.snap Significant snapshot updates with 61 and 63 changes respectively.
components/tabs/tests/snapshots/index.test.tsx.snap Snapshot update with 8 changes.
package.json Updated rc-tabs dependency version from ~15.5.0 to ~15.5.1.

petercat-assistant[bot]
petercat-assistant bot reviewed Feb 7, 2025
View reviewed changes
package.json
@@ -148,7 +146,7 @@
"rc-steps": "~6.0.1",
"rc-switch": "~4.1.0",
"rc-table": "~7.50.2",
"rc-tabs": "~15.5.0",
"rc-tabs": "~15.5.1",
Copy link

Choose a reason for hiding this comment

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

The update of rc-tabs from version ~15.5.0 to ~15.5.1 should be verified to ensure it resolves the ARIA role compliance issue without introducing new issues. Please ensure that all related components are tested for compatibility.

@socket-security Socket Security
Copy link

New, updated, and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package New capabilities Transitives Size Publisher
npm/@ant-design/colors@7.2.0 None 0 32.7 kB afc163
npm/@ant-design/compatible@5.1.4 environment 0 390 kB afc163
npm/@ant-design/cssinjs-utils@1.1.3 environment 0 92 kB yumoimer
npm/@ant-design/cssinjs@1.23.0 environment 0 290 kB zombiej
npm/@ant-design/fast-color@2.0.6 None 0 43.9 kB zombiej
npm/@ant-design/happy-work-theme@1.0.0 None 0 30.9 kB zombiej
npm/@ant-design/icons@5.6.0 environment 0 8.77 MB zombiej
npm/@ant-design/react-slick@1.1.2 environment 0 832 kB afc163
npm/@ant-design/tools@18.0.3 filesystem 0 66.5 kB zombiej
npm/@ant-design/v5-patch-for-react-19@1.0.3 None 0 9.33 kB zombiej
npm/@antfu/eslint-config@4.1.1 environment 0 825 kB antfu
npm/@antv/g6@4.8.24 None 0 7.99 MB iaaron
npm/@biomejs/biome@1.9.4 shell 0 210 kB dominionl
npm/@codecov/webpack-plugin@1.8.0 None 0 65.3 kB codecov-devops
npm/@codesandbox/sandpack-react@2.19.11 None 0 1.21 MB alexnm, christianalfoni, compuives, ...1 more
npm/@dnd-kit/core@6.3.1 environment 0 1.07 MB clauderic
npm/@dnd-kit/modifiers@9.0.0 environment 0 49 kB clauderic
npm/@dnd-kit/sortable@10.0.0 environment 0 234 kB clauderic
npm/@dnd-kit/utilities@3.2.2 environment 0 88.5 kB clauderic
npm/@emotion/css@11.13.5 None 0 273 kB emotion-release-bot
npm/@emotion/server@11.11.0 environment 0 48.7 kB emotion-release-bot
npm/@eslint-react/eslint-plugin@1.26.2 None 0 306 kB rel1cx
npm/@ianvs/prettier-plugin-sort-imports@4.4.1 environment, unsafe 0 115 kB ianvs
npm/@inquirer/prompts@7.3.1 None 0 23.9 kB sboudrias
npm/@madccc/duplicate-package-checker-webpack-plugin@1.0.0 None 0 19 kB madccc
npm/@microflash/rehype-figure@2.1.2 None 0 6.71 kB naiyer
npm/@npmcli/run-script@9.0.2 environment 0 18.3 kB npm-cli-ops
npm/@octokit/rest@21.1.0 None 0 8.28 kB gr2m, kfcampbell, nickfloyd, ...1 more
npm/@qixian.cs/github-contributors-list@2.0.2 network 0 19.6 kB chenshuai2144
npm/@rc-component/color-picker@2.0.1 environment 0 83.1 kB afc163
npm/@rc-component/mutate-observer@1.1.0 environment 0 16.7 kB zombiej
npm/@rc-component/qrcode@1.0.0 None 0 146 kB zombiej
npm/@rc-component/tour@1.15.1 None 0 68.3 kB afc163
npm/@rc-component/trigger@2.2.6 environment 0 184 kB zombiej
npm/@size-limit/file@11.1.6 None 0 3.43 kB ai
npm/@stackblitz/sdk@1.11.0 None 0 186 kB tsulkowski
npm/@testing-library/dom@10.4.0 environment 0 2.43 MB testing-library-bot
npm/@testing-library/jest-dom@6.6.3 None 0 282 kB testing-library-bot
npm/@testing-library/react@16.2.0 None 0 337 kB brrianalexis, cmckinstry, dfcook, ...13 more
npm/@testing-library/user-event@14.6.1 None 0 438 kB brrianalexis, cmckinstry, dfcook, ...13 more
npm/@types/adm-zip@0.5.7 None 0 24.6 kB types
npm/@types/ali-oss@6.16.11 None 0 42.2 kB types
npm/@types/cli-progress@3.11.6 None 0 13.1 kB types
npm/@types/fs-extra@11.0.4 None 0 36.8 kB types
npm/@types/gtag.js@0.0.20 None 0 9.1 kB types
npm/@types/http-server@0.12.4 None 0 4.58 kB types
npm/@types/isomorphic-fetch@0.0.39 None 0 2.77 kB types
npm/@types/jest-axe@3.5.9 None 0 6.62 kB types
npm/@types/jest-environment-puppeteer@5.0.6 None 0 6.09 kB types
npm/@types/jest-image-snapshot@6.4.0 None 0 9.68 kB types
npm/@types/jest@29.5.14 None 0 78.8 kB types
npm/@types/jquery@3.5.32 None 0 1.12 MB types
npm/@types/jsdom@21.1.7 None 0 21.9 kB types
npm/@types/lodash@4.17.15 None 0 868 kB types
npm/@types/minimist@1.2.5 None 0 6.27 kB types
npm/@types/node@22.13.1 None 0 2.31 MB types
npm/@types/nprogress@0.2.3 None 0 4.83 kB types
npm/@types/pixelmatch@5.2.6 None 0 7.87 kB types
npm/@types/pngjs@6.0.5 None 0 5.47 kB types
npm/@types/prismjs@1.26.5 None 0 19.4 kB types
npm/@types/progress@2.0.7 None 0 6.51 kB types
npm/@types/qs@6.9.18 None 0 7.46 kB types
npm/@types/react-copy-to-clipboard@5.0.7 None 0 4.36 kB types
npm/@types/react-dom@19.0.3 None 0 20.6 kB types
npm/@types/react-highlight-words@0.20.0 None 0 5.75 kB types
npm/@types/react-resizable@3.0.8 None 0 7.36 kB types
npm/@types/react@19.0.8 None 0 800 kB types
npm/@types/semver@7.5.8 None 0 23.3 kB types
npm/@types/spinnies@0.5.3 None 0 8.22 kB types
npm/@types/tar@6.1.13 None 0 30.8 kB types
npm/@types/throttle-debounce@5.0.2 None 0 6.48 kB types
npm/@types/warning@3.0.3 None 0 2.71 kB types
npm/adm-zip@0.5.16 filesystem 0 121 kB cthackers
npm/ali-oss@6.22.0 filesystem 0 2.74 MB fengmk2
npm/antd-img-crop@4.24.0 None 0 47.9 kB nanxiaobei
npm/antd-style@3.7.1 environment 0 191 kB arvinxx
npm/antd-token-previewer@2.0.8 None 0 1.22 MB madccc
npm/axios@1.7.9 network 0 2.13 MB jasonsaayman
npm/chalk@5.4.1 None 0 44.2 kB sindresorhus
npm/cheerio@1.0.0 None 0 1.25 MB feedic
npm/circular-dependency-plugin@5.2.2 None 0 10.5 kB theron
npm/cli-progress@3.12.0 None 0 62.2 kB andidittrich
npm/cross-env@7.0.3 environment 0 29.1 kB kentcdodds
npm/cross-fetch@4.1.0 network 0 93.3 kB lquixada
npm/dekko@0.2.1 filesystem 0 8.91 kB benjycui
npm/dotenv@16.4.7 environment, filesystem 0 75.8 kB motdotla
npm/dumi-plugin-color-chunk@1.1.2 None 0 38.7 kB wxh16144
npm/dumi@2.4.17 environment, eval, filesystem 0 2.92 MB yifankakaxi
npm/env-paths@3.0.0 None 0 9.81 kB sindresorhus
npm/eslint-plugin-compat@6.0.2 filesystem +1 202 kB amilajack
npm/eslint-plugin-jest@28.11.0 None 0 350 kB aaronabramov, jeysal, jsonp, ...6 more
npm/eslint-plugin-jsx-a11y@6.10.2 None 0 753 kB ljharb
npm/eslint-plugin-react-hooks@5.2.0-canary-ff628334-20250205 environment 0 180 kB react-bot
npm/eslint-plugin-react-refresh@0.4.18 None 0 18.1 kB arnaud-barre
npm/eslint@9.19.0 None 0 3.38 MB eslintbot, openjsfoundation
npm/fetch-jsonp@1.3.0 None 0 12.4 kB camsong
npm/rc-cascader@3.33.0 environment 0 180 kB zombiej
npm/rc-checkbox@3.5.0 None 0 20.5 kB zombiej
npm/rc-collapse@3.9.0 None 0 52.4 kB afc163
npm/rc-dialog@9.6.0 environment 0 77.4 kB afc163
npm/rc-drawer@7.2.0 environment 0 59.6 kB zombiej
npm/rc-dropdown@4.2.1 None 0 43.1 kB zombiej
npm/rc-field-form@2.7.0 environment 0 292 kB zombiej
npm/rc-image@7.11.0 environment 0 159 kB afc163
npm/rc-input-number@9.4.0 None 0 81.5 kB afc163, madccc, paranoidjk, ...5 more
npm/rc-input@1.7.2 None 0 73.8 kB afc163, madccc, zombiej
npm/rc-mentions@2.19.1 None 0 78.5 kB afc163, madccc, zombiej
npm/rc-menu@9.16.0 environment 0 256 kB zombiej
npm/rc-motion@2.9.5 None 0 107 kB 07akioni, afc163, madccc, ...1 more
npm/rc-notification@5.6.2 environment 0 88.3 kB madccc
npm/rc-pagination@5.1.0 environment 0 166 kB zombiej
npm/rc-picker@4.9.2 None 0 907 kB 07akioni, afc163, lixuan, ...3 more
npm/rc-progress@4.0.0 environment 0 52.3 kB afc163
npm/rc-rate@2.13.0 None 0 40.6 kB madccc
npm/rc-resize-observer@1.4.3 environment 0 36.5 kB afc163
npm/rc-segmented@2.7.0 environment 0 50.3 kB afc163
npm/rc-select@14.16.6 None 0 347 kB afc163, chenshuai2144, madccc, ...6 more
npm/rc-slider@11.1.8 None 0 173 kB afc163, benjycui, jljsj33, ...6 more
npm/rc-steps@6.0.1 None 0 48.3 kB zombiej
npm/rc-switch@4.1.0 None 0 20.5 kB afc163
npm/rc-table@7.50.2 environment 0 404 kB zombiej
npm/rc-tabs@15.5.1 None 0 175 kB afc163, benjycui, madccc, ...4 more
npm/rc-textarea@1.9.0 None 0 63.5 kB afc163, lixuan, madccc, ...1 more
npm/rc-tooltip@6.3.2 None 0 55.2 kB zombiej
npm/rc-tree-select@5.27.0 environment 0 179 kB zombiej
npm/rc-tree@5.13.0 None 0 359 kB zombiej
npm/rc-upload@4.8.1 None 0 80.3 kB afc163
npm/rc-util@5.44.3 Transitive: environment +1 267 kB afc163
npm/react-dom@19.0.0 None 0 0 B
npm/scroll-into-view-if-needed@3.1.0 None 0 44.8 kB stipsan
npm/throttle-debounce@5.0.2 🔁 npm/throttle-debounce@2.3.0 None 0 68.6 kB niksy

🚮 Removed packages: npm/immer@10.1.1, npm/lodash@4.17.21, npm/prismjs@1.29.0, npm/regenerator-runtime@0.14.1

View full report↗︎

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 7, 2025 •
edited
Loading

size-limit report 📦

Path Size
dist/antd.min.js 441.72 KB
dist/antd-with-locales.min.js 509.96 KB

@pkg-pr-new pkg.pr.new
Copy link

pkg-pr-new bot commented Feb 7, 2025 •
edited
Loading

Open in Stackblitz

More templates

npm i https://pkg.pr.new/ant-design/ant-design/antd@52677

commit: 775110f

@codecov Codecov
Copy link

codecov bot commented Feb 7, 2025 •
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (36c308c) to head (775110f).
Report is 1 commits behind head on master.

Additional details and impacted files 
@@            Coverage Diff            @@
##            master    #52677   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          763       763           
  Lines        13781     13781           
  Branches      3610      3610           
=========================================
  Hits         13781     13781

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@afc163 afc163 merged commit 755cde5 into master Feb 7, 2025
44 checks passed
@afc163 afc163 deleted the chore/upgrade-tabs branch February 7, 2025 03:50
@MadCcc MadCcc mentioned this pull request Feb 10, 2025
Merged
16 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@petercat-assistant petercat-assistant[bot]

@zombieJ zombieJ

@yoyo837 yoyo837

@MadCcc MadCcc

@li-jia-nan li-jia-nan

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
5 participants
@afc163 @zombieJ @yoyo837 @MadCcc @li-jia-nan