Skip to content

Refactor scroll-and-highlight to use React context instead of direct DOM manipulation (4272)#4255

Open
danieldudzic wants to merge 105 commits intodev/developfrom
dev/PCP-4272-refactor-highlighting-to-use-react-rather-than-direct-dom-manipulation
Open

Refactor scroll-and-highlight to use React context instead of direct DOM manipulation (4272)#4255
danieldudzic wants to merge 105 commits intodev/developfrom
dev/PCP-4272-refactor-highlighting-to-use-react-rather-than-direct-dom-manipulation

Conversation

@danieldudzic
Copy link
Copy Markdown
Collaborator

This PR is dependent on changes from https://github.com/woocommerce/woocommerce-paypal-payments/tree/dev/release/4.0.2

Description

Refactors the scroll-and-highlight system from direct DOM manipulation (classList.add/remove, document.getElementById) to a React context-based approach using ScrollHighlightProvider, useScrollTarget, and useScrollTo hooks.

Steps to Test

  1. Go to WooCommerce → Settings → PayPal Payments → Payment Methods tab
  2. Find a payment method with a dependency message (e.g. one that requires another method to be enabled/disabled)
  3. Click the dependency link - verify it scrolls to the target element and highlights it with a blue border that fades out over 2 seconds
  4. Go to the Overview tab and click a feature's "Configure" / action button — verify it switches tabs and scrolls to the correct section
  5. Navigate to the settings page with a ?highlight=ppcp-save-paypal-and-venmo URL parameter — verify it scrolls to "Save PayPal and Venmo" and highlights it
  6. Verify the highlight parameter is cleaned from the URL after scrolling
  7. Keyboard-test the dependency message links — verify they are focusable and activatable with Enter/Space

Dinamiko and others added 30 commits March 17, 2026 14:21
…les-from-build

ACDC eligible merchant onboarded as BCDC on fresh install (6055)
…ly-crypto

Improve Pay with Crypto visibility and messaging across the plugin settings and checkout (6059)
…pansion-card-fields

Derive card-fields country matrix from DCC matrix (5840)
Exclude development-only files in  .distignore
The issue itself was fixed in commit 2e5547a
…ui-and-oxxo-do-not-persist-after-upgrade-from-2-9-6-to-4-0-0

Migration - PUI and OXXO do not persist after upgrade from 2.9.6 to 4.0.0 (6046 v2)
…er-remove-text-us-only-related-to-fastlane

Migration banner — remove Fastlane US-only text (6056)
…e_for_virtual_only

Migrate "capture for virtual only" (6026)
…h-site-after-payment-with-pui-orders-stuck-on-status-on-hold-as-webhook-are-not-registered

On fresh site after payment with PUI orders stuck on status on hold as webhook are not registered (6062)
…-errors

Harden plugin init to prevent errors during update (6063)
…pal-title-and-description-not-saved-after-migration

Migration - PayPal title and description not saved after migration (6068)
Dinamiko and others added 24 commits March 31, 2026 09:58
…-references

Remove UI flag references (6067)
…or-new-merchant

Do not migrate New-UI-Only merchants (6096)
…ocations-disabled-after-updating-to-4-0-0

Fix smart button locations being disabled after updating (6096)
Fix missing Online Card Payments section after upgrade from 2.9.x
Update release dates for 4.0.2 in changelog.txt and readme.txt
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.

7 participants