quarto-dev / quarto-dev/quarto-cli

Dashboard with first page as `scrolling="true"` does not scroll until navigating away

Open
#11,672 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug dashboards
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

I have created a dashboard where the first page has the scrolling="true" property. The first time I visit the dashboard, the first page does not have the scrolling layout. If I navigate to some other page and return to the first page, the scrolling layout is enabled. This behavior is consistent across multiple web browsers on multiple operating systems.

Steps to reproduce

This document exhibits the behavior. When visiting the rendered html for the first time, the first page does not scroll.

--- 
title: "Dashboard"
format: dashboard
--- 

```{r}
library(ggplot2)
my_plot <- ggplot(mpg, aes(displ, hwy)) + 
  geom_point(aes(color = class))
```

# Scrolling Page {scrolling="true"}

```{r}
my_plot
```

```{r}
my_plot
```


```{r}
my_plot
```

# Non-scrolling Page

```{r}
my_plot
```

```{r}
my_plot
```


```{r}
my_plot
```


Expected behavior

The first page should have the scrolling layout when it is loaded for the first time.

Actual behavior

The first page does not have the scrolling layout when it is loaded for the first time. Navigating to another page and then revisiting the first page causes the scrolling layout to work.

Your environment

Issue persists on Windows with VSCode IDE and Edge browser, as well as macOS with RStudio and Safari browser.

Quarto check output
Quarto 1.6.39
[✓] Checking environment information...
      Quarto cache location: /Users/damon/Library/Caches/quarto
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.4.0: OK
      Dart Sass version 1.70.0: OK
      Deno version 1.46.3: OK
      Typst version 0.11.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.6.39
      Path: /Applications/quarto/bin

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

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

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

[✓] Checking Python 3 installation....OK
      Version: 3.13.0
      Path: /opt/homebrew/opt/python@3.13/bin/python3.13
      Jupyter: (None)

      Jupyter is not available in this Python installation.
      Install with python3 -m pip install jupyter

[✓] Checking R installation...........OK
      Version: 4.4.2
      Path: /Library/Frameworks/R.framework/Versions/4.4-arm64/Resources
      LibPaths:
        - /Users/damon/Library/R/arm64/4.4/library
        - /Library/Frameworks/R.framework/Versions/4.4-arm64/Resources/library
      knitr: 1.49
      rmarkdown: 2.29

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

Contributor guide

Open the contributing guide

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

Start by rendering the supplied .qmd dashboard with Quarto and compare the initial first-page load with navigating away and back in a browser. Trace the dashboard initialization for the scrolling="true" page and verify that the first page has the scrolling layout immediately while subsequent pages still behave correctly.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, r
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 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.