The group-html-cell-outputs Quarto extension adds a filter to group the outputs of a cell
by wrapping them with a parent div when rendering to HTML.
When Quarto renders a code cell to HTML,
it creates separate div elements for the code block, standard output (stdout) and error output (stderr).
These output divs are rendered as direct siblings of the code block div.
For certain input formats (notably, Jupyter notebooks),
there can be multiple, interleaved stdout and stderr divs.
The rendering behaviour described above presents two main issues:
-
Each output
divhas its own independent styling. Hence, for long outputs, there may be multiple, separate scrollbars for individual output blocks. This looks awkward and makes the cell output hard to read. -
Since outputs are fragmented across different sibling
divs, it is difficult to treat them as a single unit. For example, you cannot easily scroll or collapse all cell outputs together. Furthermore, when you have an extremely long list of suchdivs, it becomes difficult to limit their max height and show a scrollbar without accidentally hiding part of the code block.
This filter resolves these issues by wrapping the outputs of a cell
with a parent div element.
By default, the parent div is given the cell-output-container class.
To install the group-html-cell-outputs extension for a project,
run the following in your shell:
quarto add dixslyf/quarto-group-html-cell-outputsSee Quarto's documentation on Managing Extensions for more information.
In your _quarto.yml file or document's YAML header, add group-html-cell-outputs to filters:
filters:
- group-html-cell-outputsWhen this filter is used with the default configuration,
all outputs of a cell are automatically wrapped in a shared parent div
with the cell-output-container class.
Some default styles are applied to cell-output-container to
adjust padding and prevent each child output element from having its own scrollbar
so that the output container looks like a single output block.
For additional configuration, please refer to the documentation.