Colour scheme choice on one website changes every other Quarto site on the same origin

Đang mở
  • Có gì không ổn?
#15,305 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
58/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
javascript
Lĩnh vực
frontend

Hướng nghiên cứu

Start with src/resources/formats/html/templates/quarto-html-before-body.ejs, linked in the issue, and inspect how the colour scheme preference is read and stored. Reproduce with two rendered sites under one local HTTP origin using the supplied steps. Done means changing the colour scheme on one site leaves the other site's choice unchanged; the reader mode and tabset keys are noted as related but are not confirmed by the reporter.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

bug dark-mode 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

Quarto stores the reader's colour scheme choice under one fixed localStorage key, quarto-color-scheme.
localStorage is per origin, so every Quarto site served from the same origin reads and writes the same value.
This is the usual layout for project sites on GitHub Pages, where user.github.io/site-a/ and user.github.io/site-b/ share the origin user.github.io.

A reader who switches site-a to dark finds site-b dark on their next visit, although they never touched its toggle.

The reader mode (quarto-reader-mode) and tabset (quarto-persistent-tabsets-data) keys are fixed in the same way.
I only tested the colour scheme.

Related: #15296 (the same code throws when storage is blocked).

Steps to reproduce

Two website projects, site-a and site-b, each with this _quarto.yml (only the title differs):

project:
  type: website
website:
  title: "site-a"
  navbar:
    left:
      - index.qmd
format:
  html:
    theme:
      light: flatly
      dark: darkly

index.qmd:

---
title: "site-a"
---

Hello.
  1. Run quarto render in each folder.
  2. Serve the parent folder over HTTP, for example python3 -m http.server, so both sites share one origin.
  3. Open /site-b/_site/index.html: it is light.
  4. Open /site-a/_site/index.html and click the colour scheme toggle.
  5. Open /site-b/_site/index.html again.
Actual behavior

site-b opens dark.
State read in Chromium 156 with a light system preference:

site-b first visit:   {'body': 'quarto-light', 'stored': None}
site-a before toggle: {'body': 'quarto-light', 'stored': None}
site-a after toggle:  {'body': 'quarto-dark',  'stored': 'alternate'}
site-b next visit:    {'body': 'quarto-dark',  'stored': 'alternate'}

https://github.com/user-attachments/assets/af5995a0-b13e-4eab-ac2d-2155ce1c39b8

Expected behavior

Each site keeps its own choice.
One option is a key that includes the site path, for example the site-url path or the site root that Quarto already knows at render time.

Your environment
  • IDE: none, command line.
  • OS: macOS 27.2.
  • Browser: Chromium 156.0.8078.4 (Playwright).
Quarto check output

Reproduced with a development build of main at 089ba530b.
The template is the same at the v1.11.9 tag.

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
Ngôn ngữ chính
JavaScript
Star
6.2k
Fork
482
Merge trung bình
17 giờ 46 phút
Pull request đã merge (30 ngày)
135

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của quarto-dev/quarto-cli

Tất cả issue của quarto-dev/quarto-cli

Issue tương tự

Thêm issue về JavaScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.