Though there is currently no keyboard shortcut to advertise with
these icons, both the star and the @ icons now have informational
tooltips, to match other icons in the condensed view.
Fixes: #25902
By replacing `<span>` tags with `<div>` tags inside the tooltip's inner
content we remove the redundancy of having to use break tags to
separate the tooltip's title and it's content.
We also replace any `<p>` tags with `<div>` tags for the following
reasons:
- Since what we want to achieve are just block elements in order to
avoid the break tags, using `<div>` tags provide use with a wider
scope of use cases.
- We don't want the pause, screen readers often introduce after reading
the contents of a paragraph.
- The `<p>` tag cannot contain tables and other block-level elements.
- The semantic meaning of the <p> tag doesn't apply to the commonly
used tooltip content.
Commit 903dbda79b (#25370) introduced a
cross-site scripting vulnerability in the tooltips for the stream and
topic in the recipient bar. An attacker who can send messages could
maliciously craft a topic for the message, such that a victim who
hovers the tooltip for that topic in their message feed triggers
execution of JavaScript code controlled by the attacker.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Added hotkey hint to Narrow to stream/topic/DM tooltips by creating
new tippy for `tippy-narrow-tooltip` with LONG_HOVER_DELAY which
appends `S` hotkey to the existing tippy content set by
data-tippy-content attribute on the element.
Using this approach instead of a <template> with
data-tooltip-template-id avoids issues with context, where
{display_recipient}/{topic}/{display_reply_to} inside <template>
would always show the same stream/topic name regardless of the
actual stream/topic being hovered over.