From dde34fc2d700ec337b787c2839b9026e16c26bfe Mon Sep 17 00:00:00 2001
From: Dobrin Dimchev <dobrin.dimchev@sap.com>
Date: Wed, 17 Jul 2024 16:09:27 +0300
Subject: [PATCH] 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    |  6 +++++-
 packages/main/src/Option.hbs          |  6 +++++-
 packages/main/src/OptionCustom.hbs    |  4 ++++
 packages/main/test/specs/Select.cy.js | 23 +++++++++++++++++++++++
 4 files changed, 37 insertions(+), 2 deletions(-)
 create mode 100644 packages/main/test/specs/Select.cy.js

diff --git a/packages/main/src/ListItemBase.hbs b/packages/main/src/ListItemBase.hbs
index 23970f42ebb5..3b4353049271 100644
--- a/packages/main/src/ListItemBase.hbs
+++ b/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}}
\ No newline at end of file
+{{/inline}}
+
+{{#*inline "listItemAttributes"}}
+{{/inline}}
diff --git a/packages/main/src/Option.hbs b/packages/main/src/Option.hbs
index 6443717d7a12..ce8e0b0956d1 100644
--- a/packages/main/src/Option.hbs
+++ b/packages/main/src/Option.hbs
@@ -12,4 +12,8 @@
 			{{/if}}
 		</div>
 	</div>
-{{/inline}}
\ No newline at end of file
+{{/inline}}
+
+{{#*inline "listItemAttributes"}}
+	title="{{tooltip}}"
+{{/inline}}
diff --git a/packages/main/src/OptionCustom.hbs b/packages/main/src/OptionCustom.hbs
index fb649c1cafd5..cfd1eccea9d8 100644
--- a/packages/main/src/OptionCustom.hbs
+++ b/packages/main/src/OptionCustom.hbs
@@ -3,3 +3,7 @@
 {{#*inline "listItemContent"}}
 	<slot></slot>
 {{/inline}}
+
+{{#*inline "listItemAttributes"}}
+	title="{{tooltip}}"
+{{/inline}}
diff --git a/packages/main/test/specs/Select.cy.js b/packages/main/test/specs/Select.cy.js
new file mode 100644
index 000000000000..64d4f09cd862
--- /dev/null
+++ b/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);
+	});
+});
\ No newline at end of file