[Grid] Tooltip appears only if cell is fully visible.
Description
Hi, I have a grid that has several columns and it is wide enough to cause some horizontal scrolling. One of the columns has a tooltip. When I have scrolled the column into view and hover over the individual cells nothing appears, unless the whole column is visible. Please see the video below for how it appears.
https://github.com/user-attachments/assets/384cc267-e03f-4b9b-920c-f0e934688e10
Expected outcome
I would expect for the tooltip to appear even when the column is only partially visible.
Minimal reproducible example
Modification to "Grid with Filters" from https://start.vaadin.com/app/p
private Component createGrid() {
grid = new Grid<>(SamplePerson.class, false);
grid.addColumn("firstName").setAutoWidth(true);
grid.addColumn("lastName").setAutoWidth(true);
grid.addColumn("email").setAutoWidth(true);
grid.addColumn("phone").setAutoWidth(true);
grid.addColumn("dateOfBirth").setAutoWidth(true);
grid.addColumn("occupation").setTooltipGenerator(item -> "Occupation tooltip for " + item.getOccupation()).setAutoWidth(true);
grid.addColumn("role").setAutoWidth(true);
grid.setItems(query -> samplePersonService.list(VaadinSpringDataHelpers.toSpringPageRequest(query), filters)
.stream());
grid.addThemeVariants(GridVariant.LUMO_NO_BORDER);
grid.addClassNames(LumoUtility.Border.TOP, LumoUtility.BorderColor.CONTRAST_10);
return grid;
}
Steps to reproduce
You can use "Grid with Filters" example https://start.vaadin.com/app/p and set tooltip generation for one of the columns that can be hidden by scrolling
grid.addColumn("occupation").setTooltipGenerator(item -> "Occupation tooltip for " + item.getOccupation()).setAutoWidth(true);
- Open web app which has a grid
- Make window small enough so that the grid has horizontal scroll, and that the column with tooltips can be hidden.
- Scroll to fully reveal the column with tooltips
- Verify that you can see a tooltip when hovering over a cell in that column.
- Scroll to hide part of the column with tooltips
- Verify that you can no longer see tooltips when hovering over a cell in that column
Environment
Vaadin version(s): 24.6 OS: Linux Mint 22
Browsers
Chrome, Firefox
Thanks for the issue. We had another problem reported previously at https://github.com/vaadin/web-components/issues/7744 where tooltip wasn't shown correctly with not fully visible cell, so the current behavior is by design: https://github.com/vaadin/web-components/pull/7749
The https://github.com/vaadin/web-components/issues/6474 need to be addressed first in order to avoid this limitation.