Open footer social links in a new tab FEDEV-4007#2624
Open
qwinndev wants to merge 2 commits into
Open
Conversation
Deploying gmx-interface-home with
|
| Latest commit: |
bbe107f
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://7c30c33a.gmx-interface-home.pages.dev |
| Branch Preview URL: | https://footer-social-new-tab-fedev.gmx-interface-home.pages.dev |
Deploying gmx-interface with
|
| Latest commit: |
bbe107f
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://693d5c22.gmx-interface.pages.dev |
| Branch Preview URL: | https://footer-social-new-tab-fedev.gmx-interface.pages.dev |
Footer social icons navigated in the same tab: the Button used `href` (which Button ignores unless `to` is set), so it rendered a plain `<button>`, and TrackingLink hijacked the click with a same-tab `window.location.href` navigation. Render the social Button as a real external link via `to` so ButtonLink applies `target="_blank" rel="noopener"`, and let TrackingLink skip its manual navigation for new-tab links — the browser opens the new tab natively while tracking still fires.
b083e58 to
280cbf9
Compare
Playwright Component Test ReportAll tests passed. Commit bbe107f |
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.
Problem
Footer social icons (X, Substack, Github, Telegram, Discord) opened the external site in the same browser tab, taking the user away from the GMX app.
Two things combined to cause this:
<Button>was givenhref— butButtononly renders a real anchor (viaButtonLink, which appliestarget="_blank" rel="noopener") whentois set. Withhrefplus theonClickinjected byTrackingLink, it rendered a plain<button>, sonewTabwas ignored.TrackingLinkoverrode the child'sonClick, callede.preventDefault(), and then navigated withwindow.location.href = children.props.href— always in the same tab.Fix
Footer.tsx: render the socialButtonwithtoinstead ofhref, so it renders a proper external link withtarget="_blank" rel="noopener".TrackingLink.tsx: for new-tab children, don'tpreventDefault/navigate manually — fire tracking and let the browser open the new tab natively. (Doingwindow.openafter anawaitwould be popup-blocked; relying on the anchor's native default action isn't.) Same-tab links keep the previous behavior.Both the desktop footer and the mobile side-nav footer render the same
Footercomponent, so both are fixed. Non-social footer links are untouched, and social click tracking still fires for each icon.https://linear.app/gmx-io/issue/FEDEV-4007/bug-footer-social-icons-open-in-the-same-tab-instead-of-a-new-tab