primeng icon indicating copy to clipboard operation
primeng copied to clipboard

v16.9.0: p-megaMenu title property of each item in the [model]="items" does not work

Open eXpertise7 opened this issue 1 year ago • 3 comments

Describe the bug

In the [email protected] (and probably every primeng 16 version - did not test before) title property which is filled in the TypeScript while initializing items array list is not working.

Environment

Windows 10, Google Chrome Version 119.0.6045.160 (Official Build) (64-bit) up to date, Angular 16

Reproducer

https://stackblitz.com/edit/5lxh8n-drmabs?file=src%2Fapp%2Fdemo%2Fwrapper.component.ts

Angular version

16.2.0

PrimeNG version

16.9.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.18.0

Browser(s)

No response

Steps to reproduce the behavior

  1. Hover with the mouse on the any p-megaMenu item

Expected behavior

Tooltip title should be appearing. This had worked in the PrimeNG 15.2.0 (confirmed) which I've used in the development and production environment.

eXpertise7 avatar Nov 27 '23 15:11 eXpertise7

Hi,

You can use itemTemplate to customize the menu item as you wish. Besides, I've checked the v14 and the title is missing as you mentioned but it only used in anchors to append HTML attribute of title, it wasn't a visible thing. Title attribute removed from the anchors with the accessibility update since it was redundant in the anchor.

cetincakiroglu avatar Nov 28 '23 08:11 cetincakiroglu

I generate megamenu items fully in the typescript file - items array bound to the [model] input of p-megaMenu, I won't use pTemplate="item". Not sure why did you guys think it was redundant in the anchor.

That was the only way to show some kind of tooltip in the p-megaMenu for each item.

[email protected] - title tooltip: image

eXpertise7 avatar Nov 28 '23 13:11 eXpertise7

At the risk of being a "me too" post...

I ran into this issue as well during a recent upgrade from a 15.x version the 17.x release. I also have a menu configured completely in the .ts file which has title defined for certain items. I am using PanelMenu, but it is consistent with the other menu components.

I also confirmed with the stackblitz example from the documentation page, adding a title to the configuration does not have any effect on the final output..

What is interesting is that I see in the default itemTemplate defined in panelmenu.ts there is a provision for setting it:

[attr.title]="getItemProp(processedItem, 'title')"

However in the actual HTML that is rendered it just doesn't include this attribute 🤷‍♂️

djohle avatar Apr 26 '24 21:04 djohle