Bibliography doesn't show up with format: revealjs

[postylem]

I have the following files

1. test.bib:

@article{nymous84,
    author  = {Ann O. Nymous},
    title   = {Exemplar},
    year    = {1984}
}

2. test.md:

---
title: Bib test
author: Me
bibliography: test.bib
---

## Introduction

Please refer to @nymous84.

### References

::: {#refs}
:::

When I run quarto render test.md --to html , I get a nice HTML page which has a reference inline (with hyperlink), a "References" section at the end, containing my bibliography. ✅

When I run quarto render test.md --to revealjs, I get a revealjs slides HTML which has the inline reference exactly as it should, and a "References" header section at the end, but it is empty. ❌

I tried playing with removing the #refs section from my .md file, adding suppress-bibliography: false, adding/changing reference-section-title, and it stays the same. No bibliography in revealjs slides, but yes bibliography in HTML (or other formats I tried, such as beamer).

I think this must have to do with the default revealjs style not specifying how to format the bibliography? Could I change that easily? In any case, I am quite new to Quarto (and I'm very impressed!), and don't know where to look to debug further, but this doesn't seem like the desired behaviour.

[jjallaire]

We currently disable end of presentation references and footnotes in revealjs (rather, they are displayed on hover). The original reason we did this was because Reveal was clipping slides so once you hit 4 or 5 references or footnotes they'd be invisible. That said, we have subsequently introduced the ability to scroll slide output (https://quarto.org/docs/presentations/revealjs/#content-overflow) which I think means that we can turn back on references and footnotes. We'll do this soon.

[postylem]

Ah, I see.

I was originally hoping there would be a way to let it flow onto multiple vertical slides (similar to setting allowframebreaks in on the references slide in beamer), but it does seem that enabling scrollable: true by default (perhaps for the references slide only) should make it quite usable, and better than just not displaying, it seems to me. The hover is great, but as a user I'd love to have the bibliography page show the refs as well (also it would be good for similarity with other output formats, like beamer, or html).

Would this be as simple as removing the line where .reveal-references is set to display: none; here: src/resources/formats/revealjs/styles.html?

[jjallaire]

You could probably get it to work by:

(1) Providing your own CSS that overrides the display: none for reveal-references

(2) Adding the .scrollable class to your references slide

That's "in-theory" -- I'm not sure if there are other things that would need tweaking but it's certainly possible that those two things would do it.

[postylem]

I have tried overwriting that line (requiring a custom css file that sets it to display: inline for instance), and setting the references slide to have the scrollable class, but the bibliography items are not displayed on the slide (I think they're not rendered in the right place somehow, and get rendered off the edge of the slide somewhere). I'll have to dig around more to see what's going on. It creates a div with id="refs" class="references csl-bib-body" role="doc-bibliography", within which all the references are in separate divs of their own. But I'm not sure what contols how that is getting rendered, or how to make it get rendered on the slide.

I don't know quite what's going on, but I imagine it's related to what is being done here, right?

quarto-cli/src/format/reveal/format-reveal.ts

Lines 530 to 543 in 3798006

	// create hidden reveal-references div at the bottom of the document
	// and move pandoc generated footnotes and bibliography into it
	// (it will be used as the content source by reference popups)
	const referencesDiv = doc.createElement("div");
	referencesDiv.classList.add("reveal-references");
	doc.body.appendChild(referencesDiv);
	const endnotes = doc.querySelectorAll('section[role="doc-endnotes"]');
	for (const endnoteSection of endnotes) {
	referencesDiv.appendChild(endnoteSection);
	}
	const refs = doc.querySelector("#refs");
	if (refs) {
	referencesDiv.appendChild(refs);
	}

[jjallaire]

Yes, we are actually lifting the references and footnotes entirely out of the main flow into a hidden div so they definitely won't show up on any slides (I had forgotten about this).

We will definitely work on this soon so if you want to wait for us to sort it out that might be the best path.

[postylem]

Sure. I was hoping I could help, but it seems a little more involved than I can manage without more knowledge.

[jjallaire]

We've got this working hopefully as expected with this commit: 539e78e

Both References and Footnotes have the .smaller and .scrollable classes set on them by default.

As with documents in other formats, you need to insert a ## References or ## Bibliography header explicitly at the end of the document (the ## Footnotes header is included automatically).

[postylem]

This is great!

One thing I noticed: if the header level of is above slide-level, the content doesn't scroll. (I think this might be a different issue: that top-level slides in general can't be made scrollable. I'm not sure if that is by design or not; I'm quite possibly missing something.)

For instance, with slide-level: 2 (default), with References being a top-level slide (as seems natural to me, though that might be subjective),

# Introduction
Blah blah.

# Experiment
Blah Blah.

## Subsection
Blah. Please refer to @nymous84.

# Conclusion
Blah.

# References

or explicitly with

# References
::: {#refs}
:::

the bibliography content shows up on the last horizontal/top-level slide, but doesn't scroll, though the footnotes slide shows up as a horizontal/top-level slide, and does scroll.

I suppose a workaround is to have the references in a vertical slide, under some section, as below (then it does scroll), but I'm not sure this is the desired behaviour.

# Conclusion
Blah

## References

[jjallaire]

Re-opened to investigate the horizontal/vertical slides difference.

[jjallaire]

Okay, scrolling should work properly even for # References with this commit b85ce46