Quarto doesn't recognize Mermaid erDiagram

[AndhikaWB]

Bug description

Quarto v1.5.56 doesn't recognize Mermaid erDiagram, even though the Mermaid code works well on Mermaid live editor

---
title: BigQuery Test
author: AndhikaWB
date: last-modified
date-format: long
format:
  gfm:
    output-file: README.md
knitr:
  opts_chunk:
    echo: true
    error: true
    cache: true
    results: hold
---

``` {mermaid er-diagram}
erDiagram

c[customer] {
  Int64 CustomerID PK
  Str FirstName
  Str LastName
  Str CustomerEmail
  Str CustomerPhone
  Str CustomerAddress
  Str CustomerCity
  Str CustomerState
  Int64 CustomerZip
}

o[order] {
    Int64 OrderID PK
    Date Date
    Int64 CustomerID FK
    Str ProdNumber
    Int64 Quantity
}

p[product] {
    Str ProdNumber PK
    Str ProdName
    Int64 Category
    Float64 Price
}

pc[productcategory] {
    Int64 CategoryID
    Str CategoryName
    Str CategoryAbbreviation
}
```

Steps to reproduce

1. Create a qmd file like above
2. Render the qmd file including the Mermaid code chunk (using VS Code Quarto preview button)
3. Wait till the render is done

Expected behavior

The ER diagram shows up properly (just like in Mermaid live editor)

Actual behavior

A syntax error image appear as seen below

Also, the Mermaid syntax highlighting doesn't work if I declare erDiagram at the beginning of the code chunk, but seems to work well on other types of diagram

Your environment

• IDE: VS Code v1.91.1
• OS: Windows 11
• Quarto: 1.5.56
• Quarto VS Code extension: v1.113.0

Quarto check output

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: C:\Users\Dhika\Apps\CommonFiles\Quarto\bin
      CodePage: 1252

[>] Checking tools....................OK
      TinyTeX: (not installed)
      Chromium: (not installed)

[>] Checking LaTeX....................OK
      Tex:  (not detected)

[>] Checking basic markdown render....OK

[>] Checking Python 3 installation....(None)

      Unable to locate an installed version of Python 3.
      Install Python 3 from https://www.python.org/downloads/

[>] Checking R installation...........OK
      Version: 4.4.1
      Path: C:/Users/Dhika/Apps/CommonFiles/R
      LibPaths:
        - C:/Users/Dhika/Apps/Visual Studio Code Portable/Data/misc/R/win-library/4.4
        - C:/Users/Dhika/Apps/CommonFiles/R/library
      knitr: 1.47
      rmarkdown: 2.27

[>] Checking Knitr engine render......OK

[mcanouil]

Are you sure it's a Merdaid 10.2 feature?

[AndhikaWB]

Somebody is using Mermaid erDiagram on #6363, and from what I conclude he seemed to successfully render it locally, but just not when publishing on confluence

However, it's indeed that Mermaid version supplied by Quarto is much older compared to current Mermaid version (1.0.9.1). Is there a way to update built-in Mermaid manually?

[mcanouil]

First, you are using invalid syntax, second you are talking about confluence but showed an example that output to GFM. Confluence is not plain HTML and as showed by the issue you linked, it's not working well but this is unrelated to your report wrongly stating or at least not accurately stating the issue

Entity Relationship Diagram works but not the syntax you used.

Mermaid.js as any JavaScript libraries is designed for HTML.

Input	Output
````qmd --- title: "Quarto Playground" format: html --- ``` {mermaid} erDiagram CUSTOMER ||--o{ ORDER : places ORDER ||--|{ LINE-ITEM : contains CUSTOMER }|..|{ DELIVERY-ADDRESS : uses ``` ````

The following syntax is not supported by Mermaid.js 10.2 and there is nothing to be done about that.

```{mermaid}
erDiagram
  c[customer] {
    Int64 CustomerID PK
    Str FirstName
    Str LastName
    Str CustomerEmail
    Str CustomerPhone
    Str CustomerAddress
    Str CustomerCity
    Str CustomerState
    Int64 CustomerZip
  }

[AndhikaWB]

My bad, I just searched more about it and it seems that the entity name alias (1.0.5.0+) is indeed the one causing error

However, the syntax highlighting still doesn't work correctly even after removing the name alias. But I guess you can close this issue if you think this isn't important enough