S-link breadcrumb-actions slot inside s-page not redirecting

Polaris
1 
// URL: settings/general

<s-page heading="General Settings" inlineSize="small">
    <s-link slot="breadcrumb-actions" href="/settings">Settings</s-link>
    <s-section>
        // Contents
    </s-section>
</s-page>

When I try to click on settings breadcrumb link It did not redirect to settings page and does nothing

2

It acutally has to be a and not a for it to work. This should be documented somewhere though.

3

I am able to replicate this, and it’s impacting my app as well. You can replicate it easily in the react-router template. The code below does this:
output

Using <a> or react router Link does not work – it seems it has to be s-link to show the breadcrumb, but the nav is broken. @Anthony_Frehner

export default function Demo() {
  return (
    <s-page heading="Additional page">
      <s-link slot="breadcrumb-actions" href="/app">
        Home
      </s-link>
      Additional page content
    </s-page>
  );
}
4

Hi all,

Thanks for bringing this issue to our attention!

I’ve added to our backlog to resolve, but not able to provide a timeline for when a fix will be out. I’ll provide an update here as more information comes available :slight_smile:

5

Hey! There should be a fix released for this. Could you check if this is still happening for you?

1 Like
6

Still happening, recently been migrating to web components, problem mentioned above is still present.