Size plots appropriately in R notebooks and Quarto inline output (#12539)

This change adds metadata to execution requests so that it is possible
for kernels to size plots to fit the viewport/DPI.

For Quarto, we add cell options (such as `fig-width` and `fig-height`)
to the execution metadata; for both Quarto inline outputs and Jupyter
editors, we add the width of the output field and the device pixel ratio
to the execution request.

In notebooks, this means that your plots render crisply on Retina
displays and are sized appropriately to your viewport:

<img width="768" height="831" alt="image"
src="https://github.com/user-attachments/assets/d2a5ac46-afb3-4a88-9b79-deab6d842b41"
/>

In Quarto inline outputs, this means that figure width/height are
respected, too, so you get a preview with the correct aspect ratio:

<img width="758" height="363" alt="image"
src="https://github.com/user-attachments/assets/98a1505a-8620-43b0-ba0a-bec65ec01daa"
/>


Requires posit-dev/ark#1119
Requires posit-dev/qa-example-content#116
Related to quarto-dev/quarto#938

Addresses #8104
Addresses #12150



### Release Notes

<!--
Optionally, replace `N/A` with text to be included in the next release
notes.
The `N/A` bullets are ignored. If you refer to one or more Positron
issues,
these issues are used to collect information about the feature or
bugfix, such
as the relevant language pack as determined by Github labels of type
`lang: `.
  The note will automatically be tagged with the language.

These notes are typically filled by the Positron team. If you are an
external
  contributor, you may ignore this section.
-->

#### New Features

- Quarto inline output for R now respects `fig-width` and `fig-height`
options (#12150)

#### Bug Fixes

- Plots in R notebooks are now sized correctly (#8104)


### QA Notes

This PR doesn't attempt to size Python plots, though it takes the first
step towards doing so by adding the right metadata. I added a hidden
magic you can use to see what is being sent to Python:

```python
%_positron_exec_metadata
```

The Ark equivalent is `.ps.internal(active_request())`.

It also doesn't apply to the Plots pane, just notebook-style execution.
We'll need to wait for a new Quarto extension to do that
(quarto-dev/quarto#938).

Test tags: `@:quarto` `@positron-notebooks` `@notebooks`

Author: jmcphers

extensions/positron-python/python_files/posit/positron/positron_ipkernel.py

@@ -222,6 +222,17 @@ def connection_show(self, line: str) -> None:
         except TypeError as e:
             raise UsageError(f"cannot show object of type '{get_qualname(info.obj)}'") from e
 
+    @line_magic
+    def _positron_exec_metadata(self, line: str) -> None:  # noqa: ARG002
+        """Print the positron execution metadata from the current execute_request as JSON."""
+        import json as _json
+
+        kernel = self.shell.kernel
+        parent = kernel.get_parent("shell")
+        content: dict = cast("dict", parent.get("content", {}))
+        positron_meta: dict = cast("dict", content.get("positron", {}))
+        print(_json.dumps(positron_meta, sort_keys=True))
+
 
 _traceback_file_link_re = re.compile(r"^(File \x1b\[\d+;\d+m)(.+):(\d+)")
 

extensions/positron-r/package.json

@@ -1094,7 +1094,7 @@
   },
   "positron": {
     "binaryDependencies": {
-      "ark": "0.1.242"
+      "ark": "0.1.244"
     },
     "minimumRVersion": "4.2.0",
     "minimumRenvVersion": "1.0.9"

src/vs/workbench/contrib/notebook/test/browser/testNotebookEditor.ts

@@ -254,7 +254,7 @@ export function setupInstantiationService(disposables: Pick<DisposableStore, 'ad
 function _createTestNotebookEditor(instantiationService: TestInstantiationService, disposables: DisposableStore, cells: MockNotebookCell[]): { editor: IActiveNotebookEditorDelegate; viewModel: NotebookViewModel } {
 
 	const viewType = 'notebook';
-	const notebook = disposables.add(instantiationService.createInstance(NotebookTextModel, viewType, URI.parse('test://test'), cells.map((cell): ICellDto2 => {
+	const notebook = disposables.add(instantiationService.createInstance(NotebookTextModel, viewType, URI.parse('test://test/notebook'), cells.map((cell): ICellDto2 => {
 		return {
 			source: cell[0],
 			mime: undefined,

src/vs/workbench/contrib/positronNotebook/browser/IPositronNotebookInstance.ts

@@ -18,6 +18,18 @@ import { IHoverManager } from '../../../../platform/hover/browser/hoverManager.j
 import { IPositronNotebookContribution } from './positronNotebookExtensions.js';
 import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
 
+/**
+ * Metadata about the editor layout that may be relevant for execution, such as
+ * output sizing.
+ */
+export interface EditorLayoutMetadata {
+	/** The width of the output area in pixels */
+	output_width_px: number;
+
+	/** The pixel ratio of the output area (monitor-dependent) */
+	output_pixel_ratio: number;
+}
+
 /**
  * Represents a deletion sentinel - a temporary placeholder shown where cells were deleted.
  * Sentinels display a red fade animation and provide a restore button.
@@ -439,6 +451,13 @@ export interface IPositronNotebookInstance extends IPositronNotebookEditor {
 	 */
 	getContribution<T extends IPositronNotebookContribution>(id: string): T | undefined;
 
+	/**
+	 * Computes the output area dimensions for execution metadata.
+	 * Returns undefined if the notebook is not connected to an editor or the
+	 * layout cannot be measured.
+	 */
+	getOutputLayoutInfo(): EditorLayoutMetadata | undefined;
+
 	/**
 	 * Fire the scroll event for the cells container.
 	 * Called by React when scroll or DOM mutations occur.

src/vs/workbench/contrib/positronNotebook/browser/PositronNotebookInstance.ts

@@ -25,7 +25,7 @@ import { IPositronNotebookCell } from './PositronNotebookCells/IPositronNotebook
 import { CellSelectionType, getActiveCell, getEditingCell, getSelectedCells, SelectionState, SelectionStateMachine, toCellRanges } from '../../../contrib/positronNotebook/browser/selectionMachine.js';
 import { PositronNotebookContextKeyManager } from './ContextKeysManager.js';
 import { IPositronNotebookService } from './positronNotebookService.js';
-import { IDeletionSentinel, IPositronNotebookInstance, KernelStatus, NotebookOperationType } from './IPositronNotebookInstance.js';
+import { EditorLayoutMetadata, IDeletionSentinel, IPositronNotebookInstance, KernelStatus, NotebookOperationType } from './IPositronNotebookInstance.js';
 import { POSITRON_NOTEBOOK_ASSISTANT_AUTO_FOLLOW_KEY } from '../common/positronNotebookConfig.js';
 import { getAssistantSettings } from '../common/notebookAssistantMetadata.js';
 import { NotebookCellTextModel } from '../../notebook/common/model/notebookCellTextModel.js';
@@ -652,6 +652,71 @@ export class PositronNotebookInstance extends Disposable implements IPositronNot
 		return this.currentContainer;
 	}
 
+	/**
+	 * Computes the output area dimensions for execution metadata.
+	 */
+	getOutputLayoutInfo(): EditorLayoutMetadata | undefined {
+		if (!this.connectedToEditor || !this.currentContainer) {
+			return undefined;
+		}
+
+		const domNode = this.currentContainer;
+		const win = DOM.getWindow(domNode);
+		const output_pixel_ratio = win.devicePixelRatio;
+
+		// Best case: measure an existing outputs-inner element directly.
+		const outputsInner = domNode.querySelector<HTMLElement>(
+			'.positron-notebook-code-cell-outputs-inner'
+		);
+		if (outputsInner && outputsInner.clientWidth > 0) {
+			const style = win.getComputedStyle(outputsInner);
+			const paddingLeft = parseFloat(style.paddingLeft) || 0;
+			const paddingRight = parseFloat(style.paddingRight) || 0;
+			return {
+				output_width_px: outputsInner.clientWidth - paddingLeft - paddingRight,
+				output_pixel_ratio,
+			};
+		}
+
+		// Fallback: compute from the cells container and intermediate
+		// elements by reading their computed CSS offsets.
+		const container = this.cellsContainer ?? domNode;
+		if (container.clientWidth > 0) {
+			const containerStyle = win.getComputedStyle(container);
+			const containerPadding = (parseFloat(containerStyle.paddingLeft) || 0)
+				+ (parseFloat(containerStyle.paddingRight) || 0);
+
+			const cell = container.querySelector<HTMLElement>('.positron-notebook-cell');
+			const cellMarginLeft = cell
+				? parseFloat(win.getComputedStyle(cell).marginLeft) || 0
+				: 0;
+
+			// The outputs-inner padding is defined but may not have a
+			// rendered element yet (first execution). Read from CSS if
+			// an element exists; otherwise approximate from the
+			// .positron-notebook-code-cell-outputs-inner rule (0.5rem
+			// inline = 8px each side at default font size).
+			const innerEl = container.querySelector<HTMLElement>(
+				'.positron-notebook-code-cell-outputs-inner'
+			);
+			const outputPadding = innerEl
+				? (parseFloat(win.getComputedStyle(innerEl).paddingLeft) || 0)
+				+ (parseFloat(win.getComputedStyle(innerEl).paddingRight) || 0)
+				: 16;
+
+			const output_width_px = container.clientWidth
+				- containerPadding - cellMarginLeft - outputPadding;
+			if (output_width_px > 0) {
+				return {
+					output_width_px,
+					output_pixel_ratio,
+				};
+			}
+		}
+
+		return undefined;
+	}
+
 	/**
 	 * Event fired when the notebook editor widget or a cell editor within it gains focus.
 	 */

src/vs/workbench/contrib/positronNotebook/browser/notebookCells/NotebookCodeCell.css

@@ -96,5 +96,12 @@
 		.show-hidden-output-button:focus-visible {
 			outline-offset: 2px !important;
 		}
+
+		/* Scale plot images to fit the output viewport without exceeding
+		   their natural size or changing their aspect ratio. */
+		& > img {
+			max-width: 100%;
+			height: auto;
+		}
 	}
 }

src/vs/workbench/contrib/positronQuarto/browser/quartoExecutionManager.ts

@@ -38,6 +38,9 @@ import { IRuntimeSessionService, ILanguageRuntimeSession } from '../../../servic
 import { ITerminalService } from '../../terminal/browser/terminal.js';
 import { TerminalCapability, ICommandDetectionCapability } from '../../../../platform/terminal/common/capabilities/capabilities.js';
 import { parseCellExecutionOptions, QuartoCellExecutionOptions, DEFAULT_CELL_EXECUTION_OPTIONS } from '../common/quartoExecutionOptions.js';
+import { isCodeEditor } from '../../../../editor/browser/editorBrowser.js';
+import { getWindow } from '../../../../base/browser/dom.js';
+import { EditorLayoutMetadata } from '../../runtimeNotebookKernel/browser/runtimeNotebookKernel.js';
 
 // Re-export for convenience
 export { IQuartoExecutionManager } from '../common/quartoExecutionTypes.js';
@@ -327,6 +330,9 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 		const documentModel = this._documentModelService.getModel(textModel);
 		const quartoCells = documentModel.cells;
 
+		// Compute layout metadata from the active editor for output sizing.
+		const layoutMetadata = this._getEditorLayoutMetadata();
+
 		// For each range, find the containing cell and prepare execution info
 		interface InlineExecution {
 			cell: QuartoCodeCell;
@@ -373,7 +379,7 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 
 			// Get the code content and parse execution options
 			const code = textModel.getValueInRange(clampedRange);
-			const { options, optionLineCount } = parseCellExecutionOptions(code);
+			const { options, optionLineCount, metadata } = parseCellExecutionOptions(code);
 
 			// Calculate effective code range (excluding option lines at the start)
 			let effectiveCodeRange = clampedRange;
@@ -386,12 +392,20 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 				);
 			}
 
+			// Merge metadata from layout, cell YAML options, and external sources.
+			// Cell YAML options take highest precedence, then external, then layout.
+			const cellMetadata = Object.keys(metadata).length > 0 ? metadata : undefined;
+			const externalMetadata = executionMetadata?.[rangeIdx];
+			const mergedMetadata = cellMetadata || externalMetadata || layoutMetadata
+				? { ...layoutMetadata, ...externalMetadata, ...cellMetadata }
+				: undefined;
+
 			executions.push({
 				cell: containingCell,
 				codeRange: clampedRange,
 				effectiveCodeRange,
 				options,
-				executionMetadata: executionMetadata?.[rangeIdx],
+				executionMetadata: mergedMetadata,
 			});
 		}
 
@@ -1646,7 +1660,7 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 
 		// Parse execution options from cell code
 		const code = textModel.getValueInRange(codeRange);
-		const { options, optionLineCount } = parseCellExecutionOptions(code);
+		const { options, optionLineCount, metadata } = parseCellExecutionOptions(code);
 
 		// Calculate effective code range (excluding option lines at the start)
 		let effectiveCodeRange = codeRange;
@@ -1663,8 +1677,14 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 		this._removeFromQueue(documentUri, cell.id);
 		await this._persistQueueState(documentUri);
 
-		// Delegate to the unified range execution with parsed options
-		const hadError = await this._executeRange(documentUri, currentCell, effectiveCodeRange, options, token);
+		// Delegate to the unified range execution with parsed options.
+		// Cell YAML options take highest precedence over layout metadata.
+		const cellMetadata = Object.keys(metadata).length > 0 ? metadata : undefined;
+		const layoutMetadata = this._getEditorLayoutMetadata();
+		const executionMetadata = cellMetadata || layoutMetadata
+			? { ...layoutMetadata, ...cellMetadata }
+			: undefined;
+		const hadError = await this._executeRange(documentUri, currentCell, effectiveCodeRange, options, token, executionMetadata);
 		return { hadError, options };
 	}
 
@@ -2036,6 +2056,23 @@ export class QuartoExecutionManager extends Disposable implements IQuartoExecuti
 		}
 	}
 
+	/**
+	 * Compute output layout metadata from the active text editor.
+	 * Returns dimensions used by the kernel to size outputs (e.g. plot
+	 * rendering). Uses the same formula as QuartoOutputViewZone._getWidth().
+	 */
+	private _getEditorLayoutMetadata(): EditorLayoutMetadata | undefined {
+		const editorControl = this._editorService.activeTextEditorControl;
+		if (isCodeEditor(editorControl)) {
+			const layoutInfo = editorControl.getLayoutInfo();
+			return {
+				output_width_px: layoutInfo.contentWidth - layoutInfo.verticalScrollbarWidth - 4,
+				output_pixel_ratio: getWindow(editorControl.getContainerDomNode()).devicePixelRatio,
+			};
+		}
+		return undefined;
+	}
+
 	/**
 	 * Restore queue state from ephemeral storage.
 	 * This is called on startup to restore queued cells that survived a reload.

src/vs/workbench/contrib/positronQuarto/common/quartoExecutionOptions.ts

@@ -3,7 +3,7 @@
  *  Licensed under the Elastic License 2.0. See LICENSE.txt for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { parse as parseYaml, YamlObjectNode } from '../../../../base/common/yaml.js';
+import { parse as parseYaml, YamlNode, YamlObjectNode } from '../../../../base/common/yaml.js';
 
 /**
  * Execution options parsed from cell YAML comments.
@@ -55,8 +55,35 @@ export interface ParsedCellOptions {
 	options: QuartoCellExecutionOptions;
 	/** Number of option lines at the start of the code */
 	optionLineCount: number;
+	/** All non-execution cell options as a plain key-value record */
+	metadata: Record<string, unknown>;
 }
 
+/**
+ * Recursively convert a YAML AST node to a plain JavaScript value.
+ */
+function yamlNodeToValue(node: YamlNode): unknown {
+	switch (node.type) {
+		case 'string': return node.value;
+		case 'number': return node.value;
+		case 'boolean': return node.value;
+		case 'null': return null;
+		case 'array': return node.items.map(yamlNodeToValue);
+		case 'object': {
+			const result: Record<string, unknown> = {};
+			for (const prop of node.properties) {
+				result[prop.key.value] = yamlNodeToValue(prop.value);
+			}
+			return result;
+		}
+	}
+}
+
+/**
+ * Keys that are handled as execution options and should not appear in metadata.
+ */
+const EXECUTION_OPTION_KEYS = new Set(['eval', 'error']);
+
 /**
  * Parse execution options from cell code content.
  *
@@ -75,7 +102,7 @@ export interface ParsedCellOptions {
  * @returns Parsed options and the number of option lines at the start
  */
 export function parseCellExecutionOptions(code: string): ParsedCellOptions {
-	const lines = code.split('\n');
+	const lines = code.replace(/\r\n?/g, '\n').split('\n');
 	const optionLines: string[] = [];
 	let optionLineCount = 0;
 
@@ -93,6 +120,7 @@ export function parseCellExecutionOptions(code: string): ParsedCellOptions {
 
 	// Start with defaults
 	const options: QuartoCellExecutionOptions = { ...DEFAULT_CELL_EXECUTION_OPTIONS };
+	const metadata: Record<string, unknown> = {};
 
 	if (optionLines.length > 0) {
 		// Parse accumulated option lines as YAML
@@ -112,11 +140,16 @@ export function parseCellExecutionOptions(code: string): ParsedCellOptions {
 				if (key === 'error' && value.type === 'boolean') {
 					(options as { error: boolean }).error = value.value;
 				}
+
+				// Collect non-execution options as metadata
+				if (!EXECUTION_OPTION_KEYS.has(key)) {
+					metadata[key] = yamlNodeToValue(value);
+				}
 			}
 		}
 	}
 
-	return { options, optionLineCount };
+	return { options, optionLineCount, metadata };
 }
 
 /**
@@ -127,7 +160,7 @@ export function parseCellExecutionOptions(code: string): ParsedCellOptions {
  */
 export function extractExecutableCode(code: string): string {
 	const { optionLineCount } = parseCellExecutionOptions(code);
-	const lines = code.split('\n');
+	const lines = code.replace(/\r\n?/g, '\n').split('\n');
 	return lines.slice(optionLineCount).join('\n');
 }