fix(ui5-segmented-button-item): adopt inherited tooltip property (#4843)

The tooltip property, inherited from the Button has not been adopted. As a result we have a property in the API that does not have any effect. This is now fixed with the current PR.

FIXES: #4840

Author: ilhan007

packages/main/src/Button.js

@@ -113,9 +113,9 @@ const metadata = {
 		},
 
 		/**
-		 * Defines the tooltip of the button.
+		 * Defines the tooltip of the component.
 		 * <br>
-		 * <b>Note:</b> Tooltips should only be set to icon-only buttons.
+		 * <b>Note:</b> We recommend setting tooltip to icon-only components.
 		 * @type {string}
 		 * @defaultvalue: ""
 		 * @public

packages/main/src/SegmentedButtonItem.hbs

@@ -20,7 +20,7 @@
 		@touchend="{{_ontouchend}}"
 		tabindex={{tabIndexValue}}
 		aria-label="{{ariaLabelText}}"
-		title="{{title}}"
+		title="{{tooltip}}"
 >
 	{{#if icon}}
 		<ui5-icon

packages/main/test/pages/SegmentedButton.html

@@ -32,7 +32,7 @@ <h2>Segmentedbutton example</h2>
 
 				<section>
 					<ui5-segmented-button id="segButton1">
-						<ui5-segmented-button-item icon="employee" pressed></ui5-segmented-button-item>
+						<ui5-segmented-button-item tooltip="Employee" icon="employee" pressed></ui5-segmented-button-item>
 						<ui5-segmented-button-item>SegmentedButtonItem</ui5-segmented-button-item>
 						<ui5-segmented-button-item>Item</ui5-segmented-button-item>
 					</ui5-segmented-button>

packages/main/test/specs/SegmentedButton.spec.js

@@ -6,12 +6,16 @@ describe("SegmentedButton general interaction", () => {
 		await browser.url(`http://localhost:${PORT}/test-resources/pages/SegmentedButton.html`);
 	});
 
-	it("tests if pressed attribute is applied", async () => {
+	it("tests if pressed and tooltip attributes are applied", async () => {
 		const segmentedButtonItem =  await browser.$("#segButton1 > ui5-segmented-button-item:first-child");
+		const segmentedButtonItemInner = await segmentedButtonItem.shadow$(".ui5-button-root");
 
 		assert.ok(await segmentedButtonItem.getProperty("pressed"), "SegmentedButtonItem has property pressed");
+		assert.strictEqual(await segmentedButtonItemInner.getProperty("title"), "Employee",
+			"SegmentedButtonItem root element has property title");
 	});
 
+
 	it("tests if pressed attribute is switched to the newly pressed item when selected with enter key", async () => {
 		const firstSegmentedButtonItem =  await browser.$("#segButton1 > ui5-segmented-button-item:first-child");
 		const secondSegmentedButtonItem =  await browser.$("#segButton1 > ui5-segmented-button-item:nth-child(2)");