Navbar `logo-alt` is ignored when `logo` uses the `light`/`dark` form

Aperta Adatta ai principianti
  • Qualcosa non va?
#15,165 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
78/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript, yaml
Ambito
accessibility, frontend

Direzione di ricerca

Leggi src/project/types/website/website-shared.ts, dove logo-alt viene gestito prima di resolveLogo(), poi controlla src/resources/projects/website/templates/navbrand.ejs e i test vicini per il rendering dei loghi chiari e scuri. Riproduci il caso con la configurazione YAML nell’issue e ispeziona gli elementi navbar <img> generati. Il lavoro è concluso quando entrambe le varianti usano logo-alt se non hanno un proprio testo alternativo, mentre il testo alternativo esplicito delle varianti viene mantenuto.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

accessibility bug website-navigation websites
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

website.navbar.logo-alt only takes effect when logo is a plain string.
With logo: {light, dark}, the value is dropped silently and both <img> elements render with alt="".
The navbar logo link then has no accessible name.

website-shared.ts wraps the string into { path, alt } before calling resolveLogo(), and does nothing for the object form.
The sidebar has the same shape for sidebar.logo-alt.

navbrand.ejs reads alt from each variant and falls back to an empty string.

Neither the schema nor the documentation says that logo-alt only applies to the string form.
This is different from #14660, which is about the default when no alt text is given at all.

Steps to reproduce
---
title: "Logo alt test"
---

Content.

_quarto.yml:

project:
  type: website
website:
  navbar:
    logo:
      light: light.svg
      dark: dark.svg
    logo-alt: "Site name"

quarto render
grep -o '<img[^>]*navbar-logo[^>]*>' _site/index.html
Actual behavior
<img src="./light.svg" alt="" class="navbar-logo light-content">
<img src="./dark.svg" alt="" class="navbar-logo dark-content">

With logo: light.svg and the same logo-alt, the output is alt="Site name".
With logo: {light: {path: light.svg, alt: "Light alt"}, dark: {path: dark.svg, alt: "Dark alt"}}, each variant gets its own alt.

Expected behavior

logo-alt is applied to both variants when they have no alt of their own.
If that is not wanted, rendering should warn that logo-alt is ignored for the light/dark form, and the schema description should say so.

Your environment
  • IDE: none, terminal only
  • OS: macOS (Darwin 27.0.0, Apple Silicon)
Quarto check output
Quarto 99.9.9
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.10.0: OK
      Dart Sass version 1.101.0: OK
      Deno version 2.7.14: OK
      Typst version 0.15.1: OK
[✓] Checking Quarto installation......OK
      Version: 99.9.9
      commit: 69592e5c1718d3e1b2f3d11e757d32e23a16af67
Lingua principale
JavaScript
Stelle
6.1k
Fork
478
Merge medio
17h 26m
PR unite (30g)
126

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di quarto-dev/quarto-cli

Tutte le issue di quarto-dev/quarto-cli

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.