Redirect to a new tab with Button component in the post-checkout extension?

Redirect to a new tab with Button component in the post-checkout extension?

crossify
Shopify Partner
4 0 3
In our post-checkout extension, we need to allow the customer to click on a button and be redirected to a new webpage in a new tab. This is possible using the Link component and setting the attribute of "external" to true. However, we need this functionality for the Button component. 
 
There is no "external" attribute on the button component, so when we set the "to" attribute to a URL, it redirects to the webpage WITHOUT opening a new tab.
 
How can I redirect the customer to a new tab using the Button component in the post-checkout extension UI?
Replies 2 (2)

bryzezipr
Shopify Partner
7 0 1

Any solution to this one? I am also currently experiencing every link always opening in a new tab, even with external set to false, any ideas on how to make sure it stays in the same tab?

den232
Shopify Partner
223 8 57

Can't necessarily help you, but I have the opposite issue: the link always goes to a new tab! 

 

Would you share your link code please?

 

My code looks like this:

 

import createApp from "@shopify/app-bridge";
import { Redirect } from "@shopify/app-bridge/actions"; 

const host = Buffer.from(`${shop}/admin`).toString("base64");
const app = createApp({
    apiKey: fConstants.SHOPIFY_API_KEY,
    host: host,
});

const redirect = Redirect.create(app);
const url1 = Redirect.Action.ADMIN_PATH;
const url2 = "/products/";
redirect.dispatch( url1, url2 );

Cheers jb