fix(ui5-option): correct tooltip property forwarding (#9502)

As a side effect of #9015, an issue was introduced, making the tooltip property of the Option unused. This change allows customization of the attributes of the ListItemBase tempalte which the Option and OptionCustom classes implement to forward the tooltip property to the title attribute of the list item.

packages/main/src/ListItemBase.hbs

@@ -8,6 +8,7 @@
 	@keydown="{{_onkeydown}}"
 	draggable="{{movable}}"
 	@click="{{_onclick}}"
+	{{> listItemAttributes}}
 >
 	{{> listItemContent}}
 </li>
@@ -18,4 +19,7 @@
 			<span part="title" class="ui5-li-title"><slot></slot></span>
 		</div>
 	</div>
-{{/inline}}
+{{/inline}}
+
+{{#*inline "listItemAttributes"}}
+{{/inline}}

packages/main/src/Option.hbs

@@ -12,4 +12,8 @@
 			{{/if}}
 		</div>
 	</div>
-{{/inline}}
+{{/inline}}
+
+{{#*inline "listItemAttributes"}}
+	title="{{tooltip}}"
+{{/inline}}

packages/main/src/OptionCustom.hbs

@@ -3,3 +3,7 @@
 {{#*inline "listItemContent"}}
 	<slot></slot>
 {{/inline}}
+
+{{#*inline "listItemAttributes"}}
+	title="{{tooltip}}"
+{{/inline}}

packages/main/test/specs/Select.cy.js

@@ -0,0 +1,23 @@
+import { html } from 'lit';
+
+describe("Select - Accessibility", () => {
+	it("tests options tooltip is set displayed", () => {
+		const EXPECTED_TOOLTIP = "Tooltip";
+		cy.mount(html`
+			<ui5-select>
+				<ui5-option value="1" tooltip="${EXPECTED_TOOLTIP}">Option 1</ui5-option>
+				<ui5-option-custom value="2" tooltip="${EXPECTED_TOOLTIP}">Option 2</ui5-option-custom>
+			</ui5-select>
+		`);
+
+		cy
+			.get("[ui5-option][tooltip]")
+			.shadow()
+			.find("li.ui5-li-root")
+			.should("have.attr", "title", EXPECTED_TOOLTIP)
+			.get("[ui5-option-custom][tooltip]")
+			.shadow()
+			.find("li.ui5-li-root")
+			.should("have.attr", "title", EXPECTED_TOOLTIP);
+	});
+});