feat(buttons): add button disability changes#2589
Open
Vishala230531 wants to merge 1 commit intopaypal:mainfrom
Hidden character warning
The head ref may contain hidden characters: "Code-change-for-Disabling-buttons""
Open
feat(buttons): add button disability changes#2589Vishala230531 wants to merge 1 commit intopaypal:mainfrom
Vishala230531 wants to merge 1 commit intopaypal:mainfrom
Conversation
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #2589 +/- ##
==========================================
- Coverage 54.51% 54.19% -0.32%
==========================================
Files 162 164 +2
Lines 16365 17703 +1338
Branches 1083 1211 +128
==========================================
+ Hits 8922 9595 +673
- Misses 7330 7982 +652
- Partials 113 126 +13
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
nikrom17
reviewed
Jan 27, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR addresses the accessibility issue reported by TPG/Vodafone, where focus navigation was still moving to the PayPal button even when it was disabled. The fix ensures that when the PayPal button is disabled, it is no longer focusable via keyboard navigation, improving accessibility compliance.
Implement disabled button functionality with onInit callback for dynamic enable/disable control.
Add disabled prop to ButtonProps type with onInit callback
Add disabled state management in Button component
Add disabled CSS class and ARIA attributes for accessibility
Implement onInit callback in prerender with disable/enable actions
Add DISABLED class constant for styling
Jira Ticket:
(https://paypal.atlassian.net/browse/LI-134276)
Reproduction Steps
Build both csnw and scnw packages to ensure all dependencies are up to date:
Run the build commands for both csnw and scnw in your local environment.
Alias the paypal-checkout components to point to your local changes:
Run npm run storybook to test in local and verify all button stories render correctly
Navigate to react-paypal-js/Buttons/DisabledButtons - verify checkbox enables button
Navigate to testing/onInit/DisabledButtons - verify vanilla JS disabled button works
we can verify these changes in testing environment-points to local
(https://www.te-sdktestingnodeweb.qa.paypal.com/sdktestingnodeweb/storybook?path=/story/react-paypal-js-buttons--disabled-buttons&globals=sdkEnvironment:local)
Vanilla JS SDk
Screen.Recording.2026-01-27.at.2.12.16.PM.mov
React SDk
Screen.Recording.2026-01-27.at.2.13.46.PM.mov