fix(ui5-shellbar-item): Update count properly (#2049)

Fixes #2048

Author: fifoosid

packages/fiori/src/ShellBar.js

@@ -180,6 +180,7 @@ const metadata = {
 		"default": {
 			propertyName: "items",
 			type: HTMLElement,
+			invalidateParent: true,
 		},
 
 		/**

packages/fiori/test/pages/ShellBar.html

@@ -221,6 +221,10 @@ <h3>ShellBar in Compact</h3>
 		<ui5-li id="mi-4"slot="menuItems" data-key="key4">App 4</ui5-li>
 	</ui5-shellbar>
 
+	<ui5-shellbar primary-title="UI5 Web Components" id="test-invalidation">
+		<ui5-shellbar-item icon="discussion" count="2" id="test-invalidation-item"/>
+	</ui5-shellbar>
+
 	<script>
 		mySearch.addEventListener("suggestionItemSelect", function (event) {
 			 console.log(event);

packages/fiori/test/specs/ShellBar.spec.js

@@ -31,6 +31,16 @@ describe("Component Behavior", () => {
 			const icon = shellbar.shadow$("ui5-button[data-count]");
 
 			assert.strictEqual(icon.getAttribute("data-count"), '42', "Count property propagates to ui5-button");
+		});
+
+		it("tests if shellbar item invalidates the shellbar", () => {
+			const shellbar = browser.$("#test-invalidation");
+			const item = browser.$("#test-invalidation-item");
+
+			item.setProperty("count", "3");
+
+			assert.strictEqual(shellbar.shadow$(".ui5-shellbar-custom-item").getAttribute("data-count"), "3");
+
 		})
 	});