fix(ui5-side-navigation): collapsed parent items appear as selected if one of its child items is selected (#11400)

* fix(ui5-side-navigation): collapsed parent items appear as selected if a child items is selected

JIRA: BGSOFUIRODOPI-3383

Author: kskondov

packages/fiori/cypress/specs/SideNavigation.cy.tsx

@@ -122,8 +122,8 @@ describe("Side Navigation interaction", () => {
 		cy.mount(
 			<SideNavigation>
 				<SideNavigationItem id="item1" text="1" icon={group}>
-					<SideNavigationSubItem text="1.1" />
-					<SideNavigationSubItem text="1.2" />
+					<SideNavigationSubItem id="subItem1" text="1.1" />
+					<SideNavigationSubItem id="subItem2" text="1.2" />
 				</SideNavigationItem>
 			</SideNavigation>
 		);
@@ -135,10 +135,20 @@ describe("Side Navigation interaction", () => {
 		cy.get("#item1").should("have.attr", "expanded");
 
 		// act
+		cy.get("#subItem1").realClick();
 		cy.get("#item1").shadow().find(".ui5-sn-item-toggle-icon").realClick();
 
 		// assert
 		cy.get("#item1").should("not.have.attr", "expanded");
+		cy.get("#item1").shadow().find(".ui5-sn-item-level1").should("have.class", "ui5-sn-item-selected");
+		cy.get("#item1").should("not.have.attr", "selected");
+
+		// act
+		cy.get("#item1").shadow().find(".ui5-sn-item-toggle-icon").realClick();
+
+		// assert
+		cy.get("#item1").shadow().find(".ui5-sn-item-level1").should("not.have.class", "ui5-sn-item-selected");
+
 	});
 
 	it("Tests expanding and collapsing of unselectable items", () => {
@@ -845,7 +855,7 @@ describe("Side Navigation Accessibility", () => {
 			.shadow()
 			.find(".ui5-sn-item-group")
 			.should("have.attr", "role", "treeitem");
-		
+
 		cy.get("#group")
 			.shadow()
 			.find(".ui5-sn-item-group")

packages/fiori/src/SideNavigation.ts

@@ -601,7 +601,7 @@ class SideNavigation extends UI5Element {
 
 		this.overflowItems.forEach(item => {
 			if (isInstanceOfSideNavigationItem(item) && item.classList.contains(overflowClass)) {
-				 result.push(item);
+				result.push(item);
 			}
 		});
 

packages/fiori/src/SideNavigationItem.ts

@@ -172,7 +172,7 @@ class SideNavigationItem extends SideNavigationSelectableItemBase {
 	}
 
 	get _selected() {
-		if (this.sideNavCollapsed) {
+		if (this.sideNavCollapsed || !this.expanded) {
 			return this.selected || this.items.some(item => item.selected);
 		}