Navigation Issue Description
I’m having trouble with Spotify app navigation when dealing with nested sections. I have three main tabs called Section1, Section2, and Section3. Section1 has a subsection called List.
When I navigate normally like Section1 → Section2 → Section3 → Section1, everything works fine with these URLs:
spotify:app:myapp:Section1
spotify:app:myapp:Section2
spotify:app:myapp:Section3
spotify:app:myapp:Section1
But problems start when I go Section1 → Section1:List → Section3 → Section1 → Section2. I expect this URL sequence:
spotify:app:myapp:Section1
spotify:app:myapp:Section1:List
spotify:app:myapp:Section3
spotify:app:myapp:Section1
spotify:app:myapp:Section2
Instead, when I check sp.core.getArguments(), I get:
spotify:app:myapp:Section1
spotify:app:myapp:Section1:List
spotify:app:myapp:Section3
spotify:app:myapp:Section1:List
spotify:app:myapp:Section2
Main Problems
Problem 1: My event handler gets confused because it thinks I’m still on the List subsection:
sp.core.addEventListener("argumentsChanged", handleNavigation);
function handleNavigation(event) {
var currentArgs = sp.core.getArguments();
switch(currentArgs[0]) {
case "Section1":
displaySection1(currentArgs);
break;
case "Section2":
displaySection2();
break;
case "Section3":
displaySection3();
break;
}
}
Problem 2: When using browser back/forward buttons, the display shows wrong content. Instead of showing Section2 → Section1 → Section3 → Section1:List → Section1, it shows Section2 → Section1 → Section3 → Section1 → Section1.
Anyone know how to fix this navigation bug? I can create a demo app if needed.