Update test and snapshot test for local use

Author: cderv

tests/docs/playwright/html/tables/markdown-tables-cap-bottom.qmd

@@ -0,0 +1,47 @@
+---
+title: Markdown Tables
+tbl-cap-location: bottom
+---
+
+They should be styled by Quarto 
+
+## labelled {#labelled}
+
+| Col1 | Col2 | Col3 |
+|------|------|------|
+| A    | B    | C    |
+| E    | F    | G    |
+| A    | G    | G    |
+
+: My Caption {#tbl-letters}
+
+See @tbl-letters.
+
+## non-labelled table {#non-labelled}
+
+| Col1 | Col2 | Col3 |
+|------|------|------|
+| A    | B    | C    |
+| E    | F    | G    |
+
+: A non-labelled table with a caption
+
+## Computational table {#computation}
+
+<!-- This is equivalent to intermediate markdown from a `knitr::kable()` output with `echo: false` -->
+
+:::: {.cell}
+::: {.cell-output-display}
+
+Table: A caption
+
+| Sepal.Length | Sepal.Width | Petal.Length | Petal.Width | Species |
+|-------------:|------------:|-------------:|------------:|:--------|
+|          5.1 |         3.5 |          1.4 |         0.2 | setosa  |
+|          4.9 |         3.0 |          1.4 |         0.2 | setosa  |
+|          4.7 |         3.2 |          1.3 |         0.2 | setosa  |
+|          4.6 |         3.1 |          1.5 |         0.2 | setosa  |
+|          5.0 |         3.6 |          1.4 |         0.2 | setosa  |
+|          5.4 |         3.9 |          1.7 |         0.4 | setosa  |
+:::
+::::

tests/docs/playwright/html/markdown-tables.qmd renamed to tests/docs/playwright/html/tables/markdown-tables.qmd

@@ -1,9 +1,12 @@
 ---
 title: Markdown Tables
+tbl-cap-location: bottom
 ---
 
 They should be styled by Quarto 
 
+## labelled {#labelled}
+
 | Col1 | Col2 | Col3 |
 |------|------|------|
 | A    | B    | C    |
@@ -14,12 +17,24 @@ They should be styled by Quarto
 
 See @tbl-letters.
 
-## Computational table
+## non-labelled table {#non-labelled}
+
+| Col1 | Col2 | Col3 |
+|------|------|------|
+| A    | B    | C    |
+| E    | F    | G    |
+
+: A non-labelled table with a caption
+
+## Computational table {#computation}
 
 <!-- This is equivalent to intermediate markdown from a `knitr::kable()` output with `echo: false` -->
 
-:::: cell
-::: cell-output-display
+:::: {.cell}
+::: {.cell-output-display}
+
+Table: A caption
+
 | Sepal.Length | Sepal.Width | Petal.Length | Petal.Width | Species |
 |-------------:|------------:|-------------:|------------:|:--------|
 |          5.1 |         3.5 |          1.4 |         0.2 | setosa  |

tests/integration/playwright/tests/__screenshots__/html-tables.spec.ts/win32/Markdown-tables-are-styled-correctly-1.png

@@ -1,10 +1,17 @@
 import { test, expect } from '@playwright/test';
 
-test('Markdown tables are styled correctly', async ({ page }) => {
-await page.goto('html/markdown-tables.html');
-await expect(page.getByRole('figure', { name: 'Table 1: My Caption' }).locator('table')).toHaveScreenshot()
-await expect(page.locator('a.quarto-xref[href="#tbl-letters"]')).toContainText('Table 1');
+async function testTables(page, path: string) {
+  await page.goto(`html/tables/${path}`);
+  await expect(page.locator('#labelled table')).toHaveScreenshot();
+  await expect(page.locator('a.quarto-xref[href="#tbl-letters"]')).toContainText('Table 1');
+  await expect(page.locator('#non-labelled table')).toHaveScreenshot();
+  await expect(page.locator('#computation table')).toHaveScreenshot();
+}
 
-await expect(page.locator('#computational-table table')).toHaveScreenshot()
+test('Markdown tables are styled correctly', async ({ page }) => {
+  // Test with default caption position
+  await testTables(page, 'markdown-tables.html');
 
+  // Test with bottom caption
+  await testTables(page, 'markdown-tables-cap-bottom.html');
 });