quarto-dev / quarto-dev/quarto-cli
Mermaid href click interaction does not work
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 6k
- Forks
- 458
- Avg merge
- 1d 9h
- Merged PRs (30d)
- 41
Description
Bug description
With Quarto CLI 1.4.510 through 1.5.56, my Mermaid diagram's click functionality doesn't work. The text appears clickable, but actually clicking has no effect. Tested in HTML and RevealJS format.
```{mermaid}
%%{init:{'securityLevel':'loose'}}%%
gantt
dateFormat YYYY-MM
axisFormat %Y
Foo :done, foo, 2000-01, 2001-01
click foo href "https://example.com/"
```
My first thought was that securityLevel needed to be set, but the setting had no effect.
Steps to reproduce
- Create
index.qmdwith the content above quarto preview index.qmd- The text is bold and blue. If the
clickinstruction is removed from the mermaid code, the text returns to plain black. Mermaid seems to be receiving the instruction to render the clickable element. - Hover over the text "Foo" or the bar. The cursor shows that this is a clickable element by turning into a pointer finger.
- Click the element. Nothing happens!
Expected behavior
On clicking the element, my browser is redirected to https://example.com
Actual behavior
On clicking the element, nothing happens
Your environment
- vim
- Pop!_OS 22
Quarto check output
$ quarto check
Quarto 1.5.56
[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.2.0: OK
Dart Sass version 1.70.0: OK
Deno version 1.41.0: OK
Typst version 0.11.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 1.5.56
Path: /opt/quarto/bin
[✓] Checking tools....................OK
TinyTeX: v2023.11
Chromium: (not installed)
[✓] Checking LaTeX....................OK
Using: TinyTex
Path: /home/robatt/.TinyTeX/bin/x86_64-linux
Version: 2023
[✓] Checking basic markdown render....OK
[✓] Checking Python 3 installation....OK
Version: 3.10.14 (Conda)
Path: /home/robatt/.local/share/miniforge3/bin/python
Jupyter: (None)
Jupyter is not available in this Python installation.
Install with conda install jupyter
[✓] Checking R installation...........(None)
Unable to locate an installed version of R.
Install R from https://cloud.r-project.org/
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the report from index.qmd with quarto preview index.qmd, using the Mermaid gantt example and testing both HTML and RevealJS output. Trace the rendered click interaction in the browser and verify that selecting Foo redirects to https://example.com without breaking the expected styling or behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 50/100