Make Badge implement HasTooltip

[ngonzalezpazFC]

It would be useful if each Badge could display a tooltip when hovering over it.

As a workaround I made it work with this code:

                    Span span = new Span(i);
                    Tooltip.forComponent(span).withText(getTranslation(
                            "snaplets.usermanager.viewsview.hardcodedroles.tooltip"))
                            .withPosition(Tooltip.TooltipPosition.TOP_START);

                    Badge b = new Badge(span);
                    b.addThemeName(BadgeVariant.CONTRAST.getVariantName());
                    b.getStyle().setCursor("pointer");

[paodb]

I've been investigating this and according to the HasTooltip interface documentation I don't think adding the implementation od the interface is the right way to go here. It says "Components that implement this interface get a element added inside thecomponent's light DOM and are expected to handle it appropriately on theclient-side. Use this interface ONLY if you are implementing a new component that also has a Web Component counterpart with a custom tooltip support. Otherwise, use Tooltip.forComponent(Component) instead". This is not the case of the Badge class, as it is only a extension of Span class thus it has no web-component counterpart, meaning that it has no support for the HasTooltip interface.
Taking that into account, using Tooltip.forComponent(Component) is okay in this scenario. In the shared example, there's no need to define a Span as the Badge class is already a Span, so, it should be like this:

      Badge b = new Badge();
      b.addThemeName(BadgeVariant.CONTRAST.getVariantName());
      b.getStyle().setCursor("pointer");
      Tooltip.forComponent(badge)
          .withText(getTranslation("snaplets.usermanager.viewsview.hardcodedroles.tooltip"))
          .withPosition(Tooltip.TooltipPosition.TOP_START);

If the implementation of the HasTooltip interface it's still required, then a refactor of the Badge class should be needed in order to have a web-component part that could give support to vaadin-tooltip.

[javier-godoy]

The following works (24.2.2):

public class SpanWithTooltip extends Span implements HasTooltip {

    private static final String TOOLTIP_DATA_KEY = "my_tooltip";
   
    @Override
    public Tooltip setTooltipText(String text) {
      var tooltip = getForComponent(this);
      if (tooltip == null) {
        tooltip = Tooltip.forComponent(this);
        setForComponent(this, tooltip);
      }
      tooltip.setText(text);
      return tooltip;
    }

    @Override
    public Tooltip getTooltip() {
      var tooltip = getForComponent(this);
      if (tooltip == null) {
        tooltip = setTooltipText(null);
      }
      return tooltip;
    }

    private static Tooltip getForComponent(Component component) {
      return (Tooltip) ComponentUtil.getData(component, TOOLTIP_DATA_KEY);
    }

    private static void setForComponent(Component component, Tooltip tooltip) {
      ComponentUtil.setData(component, TOOLTIP_DATA_KEY, tooltip);
    }

  }

After vaadin/flow-components#5676 is merged the following should also work:

public class SpanWithTooltip extends Span implements HasTooltip {

    @Override
    public Tooltip setTooltipText(String text) {
      var tooltip = Tooltip.forComponent(this);
      tooltip.setText(text);
      return tooltip;
    }

    @Override
    public Tooltip getTooltip() {
      return Tooltip.forComponent(this);
    }
	
}

NOTE WELL I'm not suggesting that we must implement it in this manner. Rather, it's a response to the argument that, "if the implementation of the HasTooltip interface is still necessary, then a refactoring of the Badge class would be required to include a web-component part that could provide support for vaadin-tooltip."