diff --git a/.vscode/settings.json b/.vscode/settings.json index 85dc9b1..89c1775 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,12 @@ { - "cSpell.words": ["doctypes", "rehype", "resumarkdown", "résumé", "spacebar", "tablist", "testid"] + "cSpell.words": [ + "doctypes", + "rehype", + "resumarkdown", + "résumé", + "spacebar", + "tablist", + "testid", + "textbox" + ] } diff --git a/tests/general.test.ts b/tests/general.test.ts index 298ce61..3171558 100644 --- a/tests/general.test.ts +++ b/tests/general.test.ts @@ -13,3 +13,23 @@ test('nav items work', async ({ page }) => { await expect(page.getByTestId(`${await tab.textContent()}-pane`)).toBeVisible(); } }); + +test('preview accepts content', async ({ page }) => { + await page.goto('/'); + await page.getByText('content').click(); + await page.getByRole('textbox').fill('# résumé'); + + const previewFrame = page.getByTitle('résumé preview').contentFrame(); + await expect(previewFrame.getByRole('heading')).toHaveText('résumé'); +}); + +test('preview accepts styles', async ({ page }) => { + await page.goto('/'); + await page.getByText('content').click(); + await page.getByRole('textbox').fill('# blah'); + await page.getByText('style', { exact: true }).click(); + await page.getByRole('textbox').fill('h1 { color: red; }'); + + const previewFrame = page.getByTitle('résumé preview').contentFrame(); + await expect(previewFrame.getByRole('heading')).toHaveCSS('color', 'rgb(255, 0, 0)'); +});