Conflict in backend.js causing nav anchor tag to not append to URL

[digitalredefned]

I created a tab section of a page for a view using the backend app blade and noticed that when clicking the tabs, the anchors were not being appended to the URL of the account page on the front end.

To debug

• I broke down the page to just the tabs and still had the issue
• Used the tab code from the account page on a back-end page.
• Replaced the account tab with the one from the back end and it worked correctly
• In the back end app.blade.js I swapped the backend.js reference with frontend.js and the tab anchor was correctly appended to the URL

The code that performs this looks the same in both files so I'm assuming something else in the file may be causing a conflict.

[poseso]

Try this:

// Change Tab on load
let hash = window.location.hash;
hash && $('ul.nav a[href="' + hash + '"]').tab('show');

$('.nav-tabs li > a').on('click', function (e) {
    $(this).tab('show');
    history.pushState(null,null, this.hash);
});

$(window).bind('hashchange', function(){
    $('ul.nav a[href^="' + document.location.hash + '"]').click();
});

if (document.location.hash.length) {
    $(window).trigger('hashchange');
}

[digitalredefned]

This worked with the modification below since these links aren't nested in a list:
$('.nav-tabs > a.nav-link').on('click', function (e) {
$(this).tab('show');
history.pushState(null,null, this.hash);
});

Appreciate the response and hope you're safe in the DR!

[poseso]

Glad it helped you and worked with the modification, and thanks for your concern of me in the DR :D