Merge pull request #8634 from quarto-dev/bugfix/8614

Article Layout - column forwarding

news/changelog-1.5.md

@@ -58,6 +58,10 @@ All changes included in 1.5:
 
 - ([#8388](https://github.com/quarto-dev/quarto-cli/issues/8388)): add `QUARTO_PROJECT_ROOT` and `QUARTO_DOCUMENT_PATH` to the environment when invoking execution engines.
 
+## Article Layout
+
+- ([#8614](https://github.com/quarto-dev/quarto-cli/issues/8614)): Don't improperly forward column classes onto grids.
+
 ## Other Fixes
 
 - ([#8119](https://github.com/quarto-dev/quarto-cli/issues/8119)): More intelligently detect when ejs templates are modified during development, improving quality of life during preview.

src/format/html/format-html-bootstrap.ts

@@ -1456,6 +1456,8 @@ const figCapInCalloutMarginProcessor: MarginNodeProcessor = {
   },
 };
 
+const kPreviewFigColumnForwarding = [".grid"];
+
 const processFigureOutputs = (doc: Document) => {
   // For any non-margin figures, we want to actually place the figure itself
   // into the column, and leave the caption as is, if possible
@@ -1478,6 +1480,18 @@ const processFigureOutputs = (doc: Document) => {
     // See if this is a code cell with a single figure output
     const columnEl = columnNode as Element;
 
+    // See if there are any classes which should prohibit forwarding
+    // the column information
+    if (
+      kPreviewFigColumnForwarding.some((sel) => {
+        return columnEl.querySelector(sel) !== null;
+      })
+    ) {
+      // There are matching ignore selectors, just skip
+      // this column
+      continue;
+    }
+
     // If there is a single figure, then forward the column class onto that
     const figures = columnEl.querySelectorAll("figure img.figure-img");
     if (figures && figures.length === 1) {

tests/docs/smoke-all/article-layout/grid.qmd

@@ -0,0 +1,49 @@
+---
+title: Bug 8614
+format:
+  html:
+    page-layout: article
+_quarto:
+  tests:
+    html:
+      ensureHtmlElements:
+        - [".column-page > div.grid"]
+        - [".grid.page-columns"]
+---
+
+
+The below two computational chunks are expected to produce a table and a plot side-by-side, by using `::: {.grid}` with `::: {.g-col-6}` underneath `::: {column-page}`.
+
+::::: {.column-page}
+
+::::: {.grid}
+
+::: {.g-col-6}
+
+```{r}
+#| label: tbl-iris
+
+"there was a table here...but it was unnecessary for the reprex."
+
+```
+:::
+
+::: {.g-col-6}
+
+```{r}
+#| label: fig-plot
+#| fig-cap: "my caption"
+#| fig-cap-location: bottom
+#| out-width: "30%"
+#| echo: true
+
+data(iris)
+hist(iris$Sepal.Length)
+
+
+```
+:::
+
+:::::
+
+:::::