Table of contents highlight stops working when a heading id contains a percent sign

Aberta Para iniciantes
#15,297 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
2/5
Tempo estimado
1-3 horas
Facilidade para iniciantes
78/100
Tipo de issue
Bug
Clareza
Claramente especificada
Status de atividade
Ativa
Stack de tecnologia
javascript
Domínio
frontend

Direção de pesquisa

Comece pelo manipulador DOMContentLoaded em src/resources/formats/html/quarto.js, especialmente pela chamada a decodeURI nas linhas 145–152. Reproduza o problema com o documento Quarto fornecido que usa id="bad%zz" e, em seguida, verifique se a rolagem atualiza o índice e se o destino malformado deixa de lançar um URIError não capturado. O relato sugere usar o destino original quando a decodificação falhar.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

bug html
I have:
  • searched the issue tracker for similar issues
  • installed the latest version of Quarto CLI
  • formatted my issue following the Bug Reports guide
Bug description

quarto.js passes each table of contents data-scroll-target through decodeURI.
A heading id with a % that does not start a valid escape, such as {id="bad%zz"}, makes decodeURI throw URIError: URI malformed.
The error is not caught, so the rest of that DOMContentLoaded handler does not run.
The visible effect: the table of contents no longer follows the scroll position.

https://github.com/quarto-dev/quarto-cli/blob/089ba530b3ed4ec156a355d41b6b7de2db3e44ea/src/resources/formats/html/quarto.js#L145-L152

This is an edge case.
Only an explicit id="..." attribute triggers it.
Automatic ids drop the %, and Pandoc does not read {#bad%zz} as an attribute, so both are safe.
A valid escape such as id="bad%20ok" is also safe.
At render time, Quarto already warns: WARN: Invalid URI '#bad%zz' in attribute 'href' of element 'A'.

Steps to reproduce
---
title: "Repro"
format:
  html:
    toc: true
---

## Fine

Text.

## Bad target {id="bad%zz"}

Text.

## Last

Text.
  1. Run quarto render and serve the output over HTTP.
  2. Open the page and scroll down.
Actual behavior

The console shows Uncaught URIError: URI malformed from quarto.js.
After scrolling, the table of contents still highlights "Fine".

Expected behavior

The table of contents highlights the section in view, as it does when the id has no %.
A target that cannot be decoded could fall back to the raw value.

Your environment
  • IDE: none, command line.
  • OS: macOS 27.2.
  • Browser: Brave, Chromium 156.0.8078.80.
Quarto check output

Reproduced with a development build of main at 089ba530b.

Quarto 99.9.9
[✓] Checking environment information...
      Quarto cache location: /Users/mcanouil/Library/Caches/quarto
      Project: none found (single-file mode)
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.10.0: OK
      Dart Sass version 1.107.1: OK
      Deno version 2.9.8: OK
      Typst version 0.15.1: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 99.9.9
      commit: 089ba530b3ed4ec156a355d41b6b7de2db3e44ea
      Path: /Users/mcanouil/Projects/quarto-dev/quarto-cli/package/dist/bin
[✓] Checking tools....................OK
      TinyTeX: v2026.07
      Chrome Headless Shell: (not installed)
      VeraPDF: (not installed)
[✓] Checking LaTeX....................OK
      Using: TinyTex
      Path: /Users/mcanouil/Library/TinyTeX/bin/universal-darwin
      Version: 2026
[✓] Checking Chrome Headless....................OK
      Using: Chrome from QUARTO_CHROMIUM
      Path: /Applications/Brave Browser.app/Contents/MacOS/Brave Browser
[✓] Checking basic markdown render....OK
Linguagem predominante
JavaScript
Estrelas
6.1k
Forks
478
Merge médio
17h 58min
PRs com merge (30d)
135

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de quarto-dev/quarto-cli

Todas as issues de quarto-dev/quarto-cli

Issues semelhantes

Mais issues de JavaScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.