Skip to content

Fix modal deep-link not opening when CTA hash includes #_button-XX modifier#5993

Open
jsandland wants to merge 2 commits into
stagefrom
fix-modal-deep-link-button-hash
Open

Fix modal deep-link not opening when CTA hash includes #_button-XX modifier#5993
jsandland wants to merge 2 commits into
stagefrom
fix-modal-deep-link-button-hash

Conversation

@jsandland
Copy link
Copy Markdown
Contributor

@jsandland jsandland commented May 28, 2026

Summary

  • modal.js init() is called before decorateButtons() in decorate.js strips #_button-fill (and similar style modifiers) from data-modal-hash
  • When a page loads with #watch-video in the URL, init() sees data-modal-hash="#watch-video#_button-fill" and the comparison window.location.hash !== modalHash fails — modal never opens on direct/cross-page navigation
  • Clicking the in-page CTA works because by then decorateButtons() has already run and href is just #watch-video, triggering a clean hashchange

Fix

Normalize modalHash in init() by stripping /#_button-[a-zA-Z-]+/g before comparing against window.location.hash. This mirrors what decorateButtons() does later, without changing the decoration order.

Test links

Bug (prod - modal does not open on direct hash navigation):
https://business.adobe.com/products/journey-optimizer.html#watch-video

Fixed (stage with Milo branch - modal opens on direct hash navigation):
https://stage--da-bacom--adobecom.aem.live/drafts/jsandlan/journey?milolibs=fix-modal-deep-link-button-hash#watch-video

Test plan

  • Direct navigation to page with #watch-video - modal opens on load
  • Clicking in-page CTA still opens modal (hashchange path unaffected)
  • Closing modal removes hash from URL
  • All 28 existing modal unit tests pass

Modal init() runs before decorateButtons() strips style modifiers like
#_button-fill from data-modal-hash, causing a hash mismatch against
window.location.hash on direct/cross-page navigation.
@jsandland jsandland requested a review from a team as a code owner May 28, 2026 19:52
@aem-code-sync
Copy link
Copy Markdown
Contributor

aem-code-sync Bot commented May 28, 2026

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-sync branch
Commits

@github-actions
Copy link
Copy Markdown
Contributor

This pull request is not passing all required checks. Please see this discussion for information on how to get all checks passing. Inconsistent checks can be manually retried. If a test absolutely can not pass for a good reason, please add a comment with an explanation to the PR.

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.

1 participant