Missing Site Nav Edit Link and Extraneous Icons

Another day, another weird SharePoint problem. We’re working on a client Intranet, and just launched it yesterday. Everything works great and the client is happy. But, as is often the case, we needed to make a few tweaks to the Site Nav based on user feedback. (An Intranet is never done, folks.)

If you look at the screenshot of the site banner below, you can see the issue. There are extraneous icons on the far right, and the Edit link is missing for the Site Nav. That means we can’t make any changes to the Site Nav. There’s no settings page for it and there’s no workaround that I could find.

That is, until I posted the quandary to my MVP channels and Cathy Dew (@catpaint1) gave me an obscure fix. (I shouldn’t need to know exactly who on the Product Team to contact when something like this happens. It’s a bug and it should be fixed. I feel for all of you out there who must go into support ticket hell to resolve these things.)

If you ever get yourself into this state – and if you use Edge, you may well get here – this will fix things for you. (Another option is to switch to Chrome, but that feels wrong.)

This may happen to you if the following things are true:

• You use Edge as your browser
• You’ve enabled Viva Connections
• You’ve opened the Intranet in Microsoft Teams in the browser
• You’re in any SharePoint site and want to edit the Site Nav

The people who manage the Intranet are the most likely to do all of these things, and in the sequence that causes the problem.

The fix is simple if you’re used to the tooling but may not be familiar to you if you haven’t used the Developer Tools. Trust me, it’s not as bad as it looks. Here are the steps.

• Open the Developer tools in your browser by hitting the F12 key
• If you haven’t ever done this before, you’ll get this dialog:

• Click the Open DevTools button. If you’d like to avoid this dialog in the future, check the Remember my decision box first.
• The Developer Tools will open on the right side of the screen (by default – if you’ve used them before, they will be wherever you last docked them).
• Click the Console tab. If your screen isn’t very big, you may need to click on the >> to see the tab.

• At the bottom of the panel, you’ll have a command prompt. (You may well see a whole bunch of errors and other junk in that panel. To be honest, Microsoft does a horrible job cleaning up their debugging messages and spurious errors. But that’s a diatribe for another day.)
• Type localStorage.hostedApp and hit Enter. If you see the 'viva1p' value like I do below, that’s the culprit.

• Type localStorage.hostedApp = null and hit Enter. You’ll see the value is now null.

• Refresh the browser and all shall be good with the world – until the next time you open Microsoft Teams in the browser and navigate to the Intranet. (I’ve been sitting here toggling this back and forth to test it.)

What’s happening here is Microsoft Teams – the Viva Connections app in Teams, actually – is setting a value in the localStorage of your browser. That value for hostedApp tells SharePoint to render the page in a Teams-friendly way, with those extra icons on the right. When we go to the site in SharePoint instead, that value is still set, and the page renders with those icons. It also happens to break the Edit link for the Site Nav.

This fix ONLY sets the localStorage.hostedApp value in your browser to null. It doesn’t do anything dangerous or scary.

Note that this is a BUG. Microsoft knows about it, and one might hope they will fix it – soon. Until then, we have this fix.