Fix callout title option rendered as HTML title attribute

news/changelog-1.11.md

@@ -45,6 +45,7 @@ All changes included in 1.11:
 - ([#14684](https://github.com/quarto-dev/quarto-cli/issues/14684)): Add a "Skip to main content" link to Bootstrap-themed HTML output (documents, websites, books, dashboards) so keyboard users can bypass the navbar and sidebars.
 - ([#14973](https://github.com/quarto-dev/quarto-cli/issues/14973)): Fix Safari sometimes opening pages with a light and dark theme at the top instead of at the URL fragment target, and toggling the color scheme scrolling back to the top of the page.
 - ([#14976](https://github.com/quarto-dev/quarto-cli/pull/14976)): Fix KaTeX math not rendering on pages with Jupyter widgets when `html-math-method` is set with the object form (`method: katex` and `url`).
+- ([#15051](https://github.com/quarto-dev/quarto-cli/pull/15051)): Fix a callout's `title` option also rendering as an HTML `title` attribute in html, revealjs and epub output, which showed the title as a tooltip over the whole callout.
 
 ### `pdf`
 

src/resources/filters/customnodes/callout.lua

@@ -56,6 +56,7 @@ function _callout_main()
       div.attr.attributes["appearance"] = nil
       div.attr.attributes["collapse"] = nil
       div.attr.attributes["icon"] = nil
+      div.attr.attributes["title"] = nil
       local callout_type = calloutType(div)
       div.attr.classes = div.attr.classes:filter(function(class) return not _quarto.modules.classpredicates.isCallout(class) end)
       return quarto.Callout({

tests/docs/smoke-all/callouts/title-attribute.qmd

@@ -0,0 +1,40 @@
+---
+title: Callout title option is not rendered as an HTML title attribute
+format:
+  html: default
+  revealjs: default
+_quarto:
+  tests:
+    html:
+      ensureHtmlElements:
+        -
+          - div.callout.callout-titled#with-id
+          - div.callout.callout-titled.test-data-attr[data-foo="bar"]
+        -
+          - div.callout[title]
+    revealjs:
+      ensureHtmlElements:
+        -
+          - section > div.callout.callout-titled#with-id # no wrapper needed
+          - div[data-foo="bar"] > div.callout.callout-titled
+        -
+          - div.callout[title]
+          - div[title] > div.callout # wrapper
+---
+
+The `title` option of a callout is rendered as the callout heading.
+It must not also be passed through as an HTML `title` attribute, which browsers show as a tooltip over the whole callout.
+In html the leftover attributes are copied onto the `.callout` div; in revealjs they go on a wrapper div, so a titled callout with only an id needs no wrapper.
+Other leftover attributes such as `data-*` are still passed through.
+
+## Titled callout with an id
+
+::: {#with-id .callout-note title="Titled"}
+Body.
+:::
+
+## Titled callout with a data attribute
+
+::: {.callout-tip .test-data-attr title="Plain" data-foo="bar"}
+Body.
+:::