quarto-dev
diff --git a/‎claude-notes/plans/2026-07-06-issue-315-preview-printing.md‎
Lines changed: 420 additions & 0 deletions b/‎claude-notes/plans/2026-07-06-issue-315-preview-printing.md‎
Lines changed: 420 additions & 0 deletions
diff --git a/‎crates/quarto-core/tests/integration/main.rs‎
Lines changed: 1 addition & 0 deletions b/‎crates/quarto-core/tests/integration/main.rs‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎crates/quarto-core/tests/integration/printable_render.rs‎
Lines changed: 143 additions & 0 deletions b/‎crates/quarto-core/tests/integration/printable_render.rs‎
Lines changed: 143 additions & 0 deletions
diff --git a/‎crates/wasm-quarto-hub-client/Cargo.lock‎
Lines changed: 1 addition & 0 deletions b/‎crates/wasm-quarto-hub-client/Cargo.lock‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎crates/wasm-quarto-hub-client/src/lib.rs‎
Lines changed: 88 additions & 4 deletions b/‎crates/wasm-quarto-hub-client/src/lib.rs‎
Lines changed: 88 additions & 4 deletions
diff --git a/‎hub-client/changelog.md‎
Lines changed: 1 addition & 0 deletions b/‎hub-client/changelog.md‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎hub-client/src/components/Editor.tsx‎
Lines changed: 1 addition & 0 deletions b/‎hub-client/src/components/Editor.tsx‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎hub-client/src/components/FileSidebar.css‎
Lines changed: 42 additions & 2 deletions b/‎hub-client/src/components/FileSidebar.css‎
Lines changed: 42 additions & 2 deletions
@@ -34,6 +34,7 @@ pub mod navigation_e2e;
 pub mod navigation_merge;
 pub mod page_navigation_pipeline;
 pub mod preview_render_css_parity;
+pub mod printable_render;
 pub mod project_pipeline;
 pub mod project_resources;
 pub mod render_page_in_project;
 
@@ -0,0 +1,143 @@
+/*
+ * tests/integration/printable_render.rs
+ * Copyright (c) 2026 Posit, PBC
+ *
+ * bd-vhdknrvl (issue #315): the "open printable version" feature renders
+ * the current preview document through the HTML pipeline so it can be
+ * opened as a self-contained, paginatable top-level tab.
+ */
+
+//! Render-level contract for the printable-export feature.
+//!
+//! The WASM `render_printable(path)` export coerces the document's
+//! *preview* format to its HTML-output equivalent (the inverse of
+//! `map_format_for_preview`): `q2-preview → html`, `q2-slides →
+//! revealjs`. It then renders through the HTML pipeline
+//! (`render_qmd_to_html`) with the document's real path.
+//!
+//! These tests pin the two load-bearing assumptions of that coercion,
+//! natively and in-process (the WASM crate itself is `cdylib`-only and
+//! not native-testable):
+//!
+//! 1. A document whose frontmatter literally says `format: q2-preview`
+//!    still renders to a **full HTML document** when driven with an
+//!    HTML [`Format`], and a relative user image's `src` survives
+//!    verbatim (so the JS `makeSelfContainedHtml` inliner can resolve
+//!    and inline it).
+//! 2. A `format: revealjs` document renders to a **standalone reveal
+//!    deck** (the `reveal`/`slides` shell) — i.e. the coercion target
+//!    `q2-slides → revealjs` reaches the deck assembler, not a bare
+//!    HTML page.
+
+use std::path::PathBuf;
+use std::sync::Arc;
+
+use quarto_core::format::Format;
+use quarto_core::pipeline::{HtmlRenderConfig, render_qmd_to_html};
+use quarto_core::project::{DocumentInfo, ProjectContext};
+use quarto_core::render::{BinaryDependencies, RenderContext};
+use quarto_system_runtime::{NativeRuntime, SystemRuntime};
+
+fn test_project() -> ProjectContext {
+    ProjectContext {
+        dir: PathBuf::from("/project"),
+        config: quarto_core::project::ProjectConfig::default(),
+        is_single_file: true,
+        files: vec![DocumentInfo::from_path("/project/test.qmd")],
+        output_dir: PathBuf::from("/project"),
+    }
+}
+
+fn fresh_runtime() -> Arc<dyn SystemRuntime> {
+    Arc::new(NativeRuntime::new())
+}
+
+/// Render `content` through the HTML pipeline with `format`, returning
+/// the full HTML string — mirroring what `render_printable` does after
+/// coercing the preview format to its HTML-output equivalent.
+fn render_html(content: &[u8], format: Format) -> String {
+    let project = test_project();
+    let doc = DocumentInfo::from_path("/project/test.qmd");
+    let binaries = BinaryDependencies::new();
+    let mut ctx = RenderContext::new(&project, &doc, &format, &binaries);
+    pollster::block_on(render_qmd_to_html(
+        content,
+        "test.qmd",
+        &mut ctx,
+        &HtmlRenderConfig::default(),
+        fresh_runtime(),
+    ))
+    .expect("html pipeline render")
+    .html
+}
+
+#[test]
+fn q2_preview_frontmatter_renders_as_html_with_image_preserved() {
+    // A document authored with the preview pseudo-format, referencing a
+    // relative image in a subdirectory. `render_printable` coerces
+    // `q2-preview → html`; here we drive `render_qmd_to_html` with the
+    // coerced HTML format directly.
+    let content = br#"---
+title: "Printable Doc"
+format: q2-preview
+---
+
+# Heading
+
+Some text and an image.
+
+![A plot](figures/plot.png)
+
+More text after the image.
+"#;
+
+    let html = render_html(content, Format::html());
+
+    // A full HTML document (not preview AST JSON).
+    assert!(
+        html.contains("<body") && html.contains("</html>"),
+        "expected a full HTML document, got:\n{html}"
+    );
+    // Document content is present.
+    assert!(html.contains("Heading"), "heading missing:\n{html}");
+    // The relative image src is preserved verbatim so the JS inliner can
+    // resolve and inline it against the document directory.
+    assert!(
+        html.contains(r#"src="figures/plot.png""#),
+        "relative image src not preserved:\n{html}"
+    );
+}
+
+#[test]
+fn revealjs_renders_standalone_deck() {
+    // The coercion target for slides is `q2-slides → revealjs`, which
+    // must reach the reveal deck assembler.
+    let content = br#"---
+title: "Printable Deck"
+format: revealjs
+---
+
+## Slide One
+
+Hello.
+
+## Slide Two
+
+- a
+- b
+"#;
+
+    let html = render_html(
+        content,
+        Format::from_format_string("revealjs").expect("revealjs format"),
+    );
+
+    assert!(
+        html.contains(r#"class="reveal"#),
+        "expected a reveal deck shell, got:\n{html}"
+    );
+    assert!(
+        html.contains(r#"class="slides"#),
+        "expected the reveal slides container, got:\n{html}"
+    );
+}
@@ -673,6 +673,24 @@ fn map_format_for_preview(format_str: &str) -> &str {
     }
 }
 
+/// Coerce a *preview* pseudo-format to the HTML-output format its
+/// printable version should render as — the inverse of
+/// [`map_format_for_preview`], used by [`render_printable`].
+///
+/// `q2-preview → html` (a normal HTML page) and `q2-slides → revealjs`
+/// (so the reveal deck **assembler** runs — note this is *not*
+/// `builtin_pseudo_format`'s `html` base, which would drop the deck).
+/// The developer views `q2-debug`/`q2-raw` fall back to `html`.
+/// Non-preview formats (including `revealjs` and `html` themselves)
+/// pass through unchanged so they render via their own HTML pipeline.
+fn coerce_format_for_print(format_str: &str) -> &str {
+    match format_str {
+        "q2-preview" | "q2-debug" | "q2-raw" => "html",
+        "q2-slides" => "revealjs",
+        other => other,
+    }
+}
+
 /// Detect the format string from QMD content's YAML frontmatter.
 /// Returns the format name (e.g., "q2-slides", "q2-debug", "html", "acm-html")
 /// or "html" as default when no format key is present.
@@ -1000,6 +1018,59 @@ pub async fn render_qmd(path: &str, user_grammars: Option<JsUserGrammars>) -> St
         false,
         Vec::new(),
         None,
+        None,
+    )
+    .await
+}
+
+/// Render the **printable** form of a document: a standalone HTML page
+/// (or reveal deck) suitable for opening as a bare top-level browser tab
+/// and printing (issue #315, bd-vhdknrvl).
+///
+/// The live preview renders `format: q2-preview` / `format: q2-slides`
+/// through the React/AST pipeline (no standalone document to print).
+/// This export instead **coerces the preview format to its HTML-output
+/// equivalent** (`q2-preview → html`, `q2-slides → revealjs`; see
+/// [`coerce_format_for_print`]) and renders through the HTML pipeline
+/// **with the document's real path**, so relative image `src`s resolve
+/// against the document directory (they are preserved verbatim in the
+/// output for the JS-side `makeSelfContainedHtml` inliner to embed).
+///
+/// The returned document still references its generated artifacts
+/// (theme CSS, reveal.js, fonts) as `/.quarto/project-artifacts/…` VFS
+/// URLs; the caller runs `makeSelfContainedHtml` to inline them before
+/// opening the tab.
+///
+/// # Returns
+/// JSON: `{ "success": true, "html": "...", "is_slides": <bool>, ... }`
+/// or `{ "success": false, "error": "...", "diagnostics": [...] }`.
+#[wasm_bindgen]
+pub async fn render_printable(path: &str, user_grammars: Option<JsUserGrammars>) -> String {
+    let runtime = get_runtime();
+    let path = Path::new(path);
+
+    let content = match runtime.file_read(path) {
+        Ok(bytes) => bytes,
+        Err(e) => return error_response(format!("Failed to read file: {}", e)),
+    };
+
+    let project = match ProjectContext::discover(path, runtime) {
+        Ok(p) => p,
+        Err(e) => return error_response(format!("Failed to discover project context: {}", e)),
+    };
+
+    let detected = detect_format_from_content(std::str::from_utf8(&content).unwrap_or(""));
+    let printable_format = coerce_format_for_print(&detected).to_string();
+
+    render_single_doc_to_response(
+        path,
+        &content,
+        &project,
+        user_grammars,
+        false,
+        Vec::new(),
+        None,
+        Some(&printable_format),
     )
     .await
 }
@@ -1032,6 +1103,7 @@ pub async fn render_qmd_content(
         false,
         Vec::new(),
         None,
+        None,
     )
     .await
 }
@@ -1164,6 +1236,7 @@ pub async fn render_page_in_project_with_attribution(
             false,
             captures,
             attribution_json,
+            None,
         )
         .await;
     }
@@ -1257,6 +1330,7 @@ pub async fn render_page_for_preview(
             true,
             captures,
             None,
+            None,
         )
         .await;
     }
@@ -1352,16 +1426,26 @@ async fn render_single_doc_to_response(
     // `q2 render` natively runs engines instead).
     captures: Vec<quarto_trace::EngineCapture>,
     attribution_json: Option<String>,
+    // When `Some`, use this format string verbatim instead of detecting
+    // it from the content (and instead of `prefer_preview_format`
+    // mapping). Used by `render_printable`, which coerces a preview
+    // pseudo-format to its HTML-output equivalent so the HTML branch
+    // runs. `None` preserves the detect-and-maybe-map behavior.
+    format_override: Option<&str>,
 ) -> String {
     let doc = DocumentInfo::from_path(path);
     let binaries = BinaryDependencies::new();
 
     let content_str = std::str::from_utf8(content).unwrap_or("");
-    let detected = detect_format_from_content(content_str);
-    let format_str = if prefer_preview_format {
-        map_format_for_preview(&detected).to_string()
+    let format_str = if let Some(ov) = format_override {
+        ov.to_string()
     } else {
-        detected
+        let detected = detect_format_from_content(content_str);
+        if prefer_preview_format {
+            map_format_for_preview(&detected).to_string()
+        } else {
+            detected
+        }
     };
     let format = match Format::from_format_string(&format_str) {
         Ok(f) => f,
 
@@ -17,6 +17,7 @@ be in reverse chronological order (latest first).
 
 ### 2026-07-06
 
+- [`5aa3ee0a`](https://github.com/quarto-dev/q2/commits/5aa3ee0a): Added an "Open printable version" (🖨 Print) button to the Files panel — it opens a standalone, self-contained copy of the current document (or slide deck) in a new tab so you can Print / Save-as-PDF with correct pagination, working around the broken in-frame print behavior.
 - [`550aaeb8`](https://github.com/quarto-dev/q2/commits/550aaeb8): Fixed a rich-text editor bug where committing with Cmd/Ctrl+Enter while text was selected (for example, select-all then bold) could delete the block's content.
 
 ### 2026-07-01
 
@@ -1000,6 +1000,7 @@ export default function Editor({ project, files, fileContents, onDisconnect, onC
                       onRenameFile={handleRenameFile}
                       onOpenInNewTab={handleOpenInNewTab}
                       onCopyLink={handleCopyLink}
+                      currentFormat={currentFormat}
                       searchFiles={searchFiles}
                       fileContents={fileContents}
                     />
 
@@ -15,29 +15,69 @@
   display: flex;
   align-items: center;
   justify-content: flex-end;
+  flex-wrap: wrap;
   gap: 6px;
   padding: 8px 12px;
   border-bottom: 1px solid var(--sidebar-border);
 }
 
 .sidebar-header .new-file-btn,
-.sidebar-header .upload-asset-btn {
+.sidebar-header .upload-asset-btn,
+.sidebar-header .print-file-btn {
   padding: 4px 10px;
   background: var(--editor-accent-bg);
   border: 1px solid var(--editor-accent-border);
   border-radius: 4px;
   color: var(--editor-text-muted);
   font-size: 12px;
+  /* Fixed line-height so an emoji glyph's taller line box (e.g. ⬆)
+     doesn't make one button taller than the others. */
+  line-height: 1.5;
   cursor: pointer;
   transition: all 0.2s;
+  /* Keep every button a single line so all three are the same height;
+     when the header is too narrow for all of them, they wrap as whole
+     buttons to a second row rather than one squeezing to two lines. */
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 .sidebar-header .new-file-btn:hover,
-.sidebar-header .upload-asset-btn:hover {
+.sidebar-header .upload-asset-btn:hover,
+.sidebar-header .print-file-btn:hover:not(:disabled) {
   background: var(--editor-accent-border);
   color: var(--editor-text);
 }
 
+.sidebar-header .print-file-btn:disabled {
+  cursor: default;
+  opacity: 0.6;
+}
+
+.sidebar-printable-error {
+  position: relative;
+  margin: 6px 12px;
+  padding: 8px 26px 8px 10px;
+  background: #b3261e;
+  color: #fff;
+  font-size: 12px;
+  line-height: 1.35;
+  border-radius: 4px;
+}
+
+.sidebar-printable-error-dismiss {
+  position: absolute;
+  top: 4px;
+  right: 4px;
+  background: transparent;
+  border: none;
+  color: #fff;
+  font-size: 12px;
+  cursor: pointer;
+  padding: 2px 4px;
+  line-height: 1;
+}
+
 .file-list {
   flex: 1;
   overflow-y: auto;