Backaction no longer works on page component

[bakura10]

Issue summary

I am trying to update one of our small app to new design.

However, starting from Polaris 11.12 (did not try on 11.11) with summerEditions flag enabled, backAction no longer work for Page component. Reverting to 11.10 fixes the issue.

Expected behavior

The link should work route to the proper link.

Actual behavior

Nothing happen.

Steps to reproduce the problem

Considering this:

<Page
      backAction={{content: 'Back', url: `/previous-url`}}
      title={'Inner page'}
    >

• Are you using the React components? (Y/N): Y
• Polaris version number: 11.12
• Browser: Chrome/Safari/Firefox
• Device: Desktop
• Operating System: OSX

[e-dewailly]

Hi!

I've got the same issue with the v12-beta.0 package. Also absultes URL works, only relative ones failed. Nothing happen when I click on the back icon.

Thanks

[e-dewailly]

It comes from the AppProvider linkComponent of a previous version of the Shopify React Template.

I've got something like that :

function AppBridgeLink({ url, children, external, ...rest }) {
    const navigate = useNavigate();
    const handleClick = useCallback(() => {
        navigate(url);
    }, [url]);

    const IS_EXTERNAL_LINK_REGEX = /^(?:[a-z][a-z\d+.-]*:|\/\/)/;

    if (external || IS_EXTERNAL_LINK_REGEX.test(url)) {
        return (
            <a target="_blank" rel="noopener noreferrer" href={url} {...rest}>
                {children}
            </a>
        );
    }

    return (
        <a onClick={handleClick} {...rest}>
            {children}
        </a>
    );
}

I just change {...rest} position like that and it works :

function AppBridgeLink({ url, children, external, ...rest }) {
    const navigate = useNavigate();
    const handleClick = useCallback(() => {
        navigate(url);
    }, [url]);

    const IS_EXTERNAL_LINK_REGEX = /^(?:[a-z][a-z\d+.-]*:|\/\/)/;

    if (external || IS_EXTERNAL_LINK_REGEX.test(url)) {
        return (
            <a {...rest} target="_blank" rel="noopener noreferrer" href={url}>
                {children}
            </a>
        );
    }

    return (
        <a {...rest} onClick={handleClick}>
            {children}
        </a>
    );
}

The new link props come with a onClick prop as undefined which override the default linkComponent method.

It's solved on my side. Have a good day!

[bakura10]

The issue is still reproducible on Polaris 11.13. Considering this is a BC compared to 11.11, can the priority of this bug be raised?

[bakura10]

In the interim, @e-dewailly your temporary fix works like a charm, thanks :).

[github-actions[bot]]

Hi! We noticed there hasn’t been activity on this issue in a while. After 30 days, it will close automatically.

If it’s still relevant, or you have updates, comment and let us know. And don’t worry, you can always re-open later if needed.