Opting out of Astro's `children` optimization in MDX

[pomber]

What version of astro are you using?

2.0.2

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

Stackblitz

Describe the Bug

If I have this React component:

export function LogChildren({ children }) {
  console.log({ children });
  return children;
}

And this MDX:

## Hi

<LogChildren client:load>
  <a>1</a>
  <b />
</LogChildren>

Using Astro the component will log:

{
  children: {
    '$$typeof': Symbol(react.element),
    type: [Function: StaticHtml] {
      shouldComponentUpdate: [Function (anonymous)]
    },
    key: null,
    ref: null,
    props: { value: [SlotString [HTMLString]] },
    _owner: null,
    _store: {}
  }
}

where props.value is the static HTML string "<a>1</a><b></b>"

While any other MDX framework logs the original children array:

{
  children: [
    {
      '$$typeof': Symbol(react.element),
      type: 'a',
      key: null,
      ref: null,
      props: [Object],
      _owner: null,
      _store: {}
    },
    {
      '$$typeof': Symbol(react.element),
      type: 'b',
      key: null,
      ref: null,
      props: {},
      _owner: null,
      _store: {}
    }
  ]
}

---

According to the docs, this is by design. And it makes sense for most cases.

But this also sacrifices some of the flexibility from MDX (see this talk), and breaks some assumptions that other tools may rely on.

In particular, this is the biggest issue blocking the integration between Code Hike and Astro. For examples like this one to work, keeping the original children is crucial.

I ask for a way of opting out of this optimization. I haven't used Astro too much, so maybe there's a workaround or a more idiomatic approach to issues like this one.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-z5pumo?file=src/content/blog/using-mdx.mdx

Participation

• I am willing to submit a pull request for this issue.

[bholmesdev]

Hey @pomber! Thanks for raising a detailed use case here. This sounds more like a feature request than a bug, so I'd ask you copy that issue description into a roadmap discussion with the proposal tag. Our core team is making an effort to review proposals regularly to decide on future improvements. Closing for now!

[pomber]

Moved here