`pagedown::chrome_print` produces warning with javascript exception

[dmkaplan2000]

I am having what seems to be the same problem as #242, but that issue is closed so I am opening another one to report the problem. I have a presentation that was generated by quarto using the revealjs format. I am trying to print that to PDF using pagedown::chrome_print using code that I have run 100 times for this purpose, but now returns a javascript error (though chrome_print does seem to produce appropriate PDF output). I have tried with both relative and absolute paths and both produce the same error. Specifically, the error is:

> pagedown::chrome_print("lecture.rmarkdown-quarto.html",wait=10)
Warning: A runtime exception has occured while executing JavaScript
  Runtime exception message:
    ReferenceError: $ is not defined
    at http://127.0.0.1:5056/lecture.rmarkdown-quarto.html:1071:11
Warning: A runtime exception has occured while executing JavaScript
  Runtime exception message:
    ReferenceError: $ is not defined
    at http://127.0.0.1:5056/lecture.rmarkdown-quarto.html?print-pdf:1071:11

Looking at line 1071 in the HTML file, it has the following code (the first line is line 1071, so I assume it is $(document) that is causing the problem):

  <script>$(document).ready(function(){
    if (typeof $('[data-toggle="tooltip"]').tooltip === 'function') {
        $('[data-toggle="tooltip"]').tooltip();
    }
    if ($('[data-toggle="popover"]').popover === 'function') {
        $('[data-toggle="popover"]').popover();
    }
});
</script>

I am not exactly sure what is generating this code or what it does, but other revealjs presentations I have made with nearly identical YAML headers do not have this code.

[yihui]

It's hard to tell without a reprex. $ is typically from jQuery. Has jQuery been loaded before line 1071?

Anyway, you may try to keep trimming the content of your presentation until the problem disappears. That might tell you where the problem came from.

[dmkaplan2000]

The first referent to jQuery occurs in line 3711 as:

    if (window.jQuery) {
      if (previous) {
        window.jQuery(previous).trigger("hidden");
      }
      if (current) {
        window.jQuery(current).trigger("shown");
      }
    }
  };

I have confirmed that if I remove the following block that the javascript error goes away:

  <script>$(document).ready(function(){
    if (typeof $('[data-toggle="tooltip"]').tooltip === 'function') {
        $('[data-toggle="tooltip"]').tooltip();
    }
    if ($('[data-toggle="popover"]').popover === 'function') {
        $('[data-toggle="popover"]').popover();
    }
});
</script>

however, as I did not manually develop this code nor am I sure what part of my presentation caused this code to be present, I am not sure what consequence this change might have when using the presentation in presentation mode (i.e., not to print to PDF).

[dmkaplan2000]

I have cut out pieces of my document step by step to identify the offending part of the document. The problem is caused by using kableExtra to generate a table. If I remove that part the javascript error goes away.

[dmkaplan2000]

More specifically, the following .qmd file:

---
format: revealjs
---

## kableextra

```{r}
#| include: false
library(kableExtra)
```

::: {#tbl-kbex}
```{r}
#| echo: false
kbl(data.frame(id=1:3,names=letters[1:3]))
```

A table.
:::

Produces the error:

> pagedown::chrome_print("test.html")
Warning: A runtime exception has occured while executing JavaScript
  Runtime exception message:
    ReferenceError: $ is not defined
    at http://127.0.0.1:6048/test_files/libs/kePrint-0.0.1/kePrint.js:1:1
Warning: A runtime exception has occured while executing JavaScript
  Runtime exception message:
    ReferenceError: $ is not defined
    at http://127.0.0.1:6048/test_files/libs/kePrint-0.0.1/kePrint.js:1:1

The entire contents of the file kePrint.js are:

$(document).ready(function(){
    if (typeof $('[data-toggle="tooltip"]').tooltip === 'function') {
        $('[data-toggle="tooltip"]').tooltip();
    }
    if ($('[data-toggle="popover"]').popover === 'function') {
        $('[data-toggle="popover"]').popover();
    }
});

[yihui]

It seems that this issue needs to be resolved in kableExtra: https://github.com/haozhu233/kableExtra/blob/master/inst/kePrint-0.0.1/kePrint.js I don't think there's anything we can do in pagedown. Perhaps these warnings are harmless and can be safely ignored.

Alternatively, you may try xfun::browser_print(), which is available only in the very latest version of xfun on CRAN (v0.55).

[dmkaplan2000]

Thanks, will give those a shot.

[dmkaplan2000]

FYI, I tried xfun::browser_print() and it does not show the javascript exception, but the title page in the print does not look correct and the pages are always in portrait instead of landscape mode no matter what window dimensions I give for the browser window. Specifically, I tried:

xfun::browser_print("test.html",browser="google-chrome",args=c('default', '--no-pdf-header-footer'),window_size = c(1050,700))

I imagine there are chrome command line arguments to fix the page orientation, but I looked here and never found the solution.

[yihui]

Thanks for trying it out! The window size is irrelevant to PDF printing (only applies to PNG/JPEG screenshots). The paper size and orientation should be defined in CSS: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@page

Edit: I realized that revealjs does have a print mode when you add the query ?view=print to the URL, e.g., https://quarto.org/docs/presentations/revealjs/demo/?view=print However, it doesn't seem to work with headless browsers, unfortunately.