quarto-dev / quarto-dev/quarto

VSCode Extension : Preview not working as expected for websites

Open
#472 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
645
Forks
62
Avg merge
17h 42m
Merged PRs (30d)
13

Description

Bug description
  • quarto preview redirects browsers to the actively edited ('saved') document: for any page saved across website projects.
  • VSCode extension has a Preview button + a "Render on Save" option, but since the button initiates a quarto preview path/to/file.qmd in all cases, then it only ever reacts to saves to a single page (from which the button was clicked), as opposed to across pages - as quarto preview does

The extension Preview button doesn't correspond to what I expect from quarto preview (since it does quarto preview path/to/file.qmd)

I don't use the extension because quarto preview behavior is a better workflow for me when working with websites.

Perhaps Preview is an ambiguous UI and either behavior is arguably correct. But I am stating specifically what I expected, plus behavior from vanilla quarto preview. (and this despite the title - so feel free to close if you disagree)

I don't use the extension because I cannot reproduce the experience of quarto preview inside it when working with websites, which is my preferred workflow.

ref #6440

Steps to reproduce

First turn on Render on Save in extension

then

quarto create
# then select project, website, name: the-website
cd the-website
code .
# press Preview button on index.qmd
# edit abount.qmd
Expected behavior

Preview pane redirects to re-rendered about.qmd

Actual behavior

nothing: no render or redirect

Your environment

vscode 1.90.2

on ubuntu 22.04

Quarto check output
Quarto 1.5.47
[✓] 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

extension v1.113.0

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the workflow in a VSCode Quarto website: enable Render on Save, press Preview on index.qmd, then edit and save about.qmd. Compare the extension's behavior with quarto preview; done means saving another page re-renders it and redirects the preview as expected.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript, vscode
Domain
developer-experience, devtools, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.