summaryrefslogtreecommitdiff
path: root/packages/integrations/markdoc/src
diff options
context:
space:
mode:
authorGravatar Matt Kane <m@mk.gg> 2024-12-02 14:37:00 +0000
committerGravatar GitHub <noreply@github.com> 2024-12-02 14:37:00 +0000
commitfa07002352147d45da193f28fd6e02d2d42dc67a (patch)
tree66492ef4ace0908eecbce5e2f85283acca055cb8 /packages/integrations/markdoc/src
parent15f000c3e7bc5308c39107095e5af4258c2373a5 (diff)
downloadastro-fa07002352147d45da193f28fd6e02d2d42dc67a.tar.gz
astro-fa07002352147d45da193f28fd6e02d2d42dc67a.tar.zst
astro-fa07002352147d45da193f28fd6e02d2d42dc67a.zip
fix(markdoc): correctly render boolean HTML attributes (#12584)
Diffstat (limited to 'packages/integrations/markdoc/src')
-rw-r--r--packages/integrations/markdoc/src/html/tagdefs/html.tag.ts39
1 files changed, 39 insertions, 0 deletions
diff --git a/packages/integrations/markdoc/src/html/tagdefs/html.tag.ts b/packages/integrations/markdoc/src/html/tagdefs/html.tag.ts
index 92d086d1a..0c094227d 100644
--- a/packages/integrations/markdoc/src/html/tagdefs/html.tag.ts
+++ b/packages/integrations/markdoc/src/html/tagdefs/html.tag.ts
@@ -1,6 +1,37 @@
import type { Config, Schema } from '@markdoc/markdoc';
import Markdoc from '@markdoc/markdoc';
+const booleanAttributes = new Set([
+ 'allowfullscreen',
+ 'async',
+ 'autofocus',
+ 'autoplay',
+ 'checked',
+ 'controls',
+ 'default',
+ 'defer',
+ 'disabled',
+ 'disablepictureinpicture',
+ 'disableremoteplayback',
+ 'download',
+ 'formnovalidate',
+ 'hidden',
+ 'inert',
+ 'ismap',
+ 'itemscope',
+ 'loop',
+ 'multiple',
+ 'muted',
+ 'nomodule',
+ 'novalidate',
+ 'open',
+ 'playsinline',
+ 'readonly',
+ 'required',
+ 'reversed',
+ 'selected',
+]);
+
// local
import { parseInlineCSSToReactLikeObject } from '../css/parse-inline-css-to-react.js';
@@ -18,6 +49,14 @@ export const htmlTag: Schema<Config, never> = {
// pull out any "unsafe" attributes which need additional processing
const { style, ...safeAttributes } = unsafeAttributes as Record<string, unknown>;
+ // Convert boolean attributes to boolean literals
+ for (const [key, value] of Object.entries(safeAttributes)) {
+ if (booleanAttributes.has(key)) {
+ // If the attribute exists, ensure its value is a boolean
+ safeAttributes[key] = value === '' || value === true || value === 'true';
+ }
+ }
+
// if the inline "style" attribute is present we need to parse the HTML into a react-like React.CSSProperties object
if (typeof style === 'string') {
const styleObject = parseInlineCSSToReactLikeObject(style);