Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Astro wrongly process markdown code #9909

Closed
1 task
LunaticMuch opened this issue Jan 31, 2024 · 1 comment · Fixed by #10104
Closed
1 task

Astro wrongly process markdown code #9909

LunaticMuch opened this issue Jan 31, 2024 · 1 comment · Fixed by #10104
Labels
- P3: minor bug An edge case that only affects very specific usage (priority)

Comments

@LunaticMuch
Copy link
Contributor

LunaticMuch commented Jan 31, 2024 •
edited
Loading

Astro Info

❯ astro info
Re-optimizing dependencies because vite config has changed
Astro                    v4.2.7
Node                     v18.18.0
System                   Linux (x64)
Package Manager          unknown
Output                   static
Adapter                  none
Integrations             astro-expressive-code

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

It looks like Astro preprocesses the hast in a way that’s incompatible with this plugin (other rehype plugins). rehype-mermaidjs searches for <pre> and <code> elements, but Astro turns them into raw nodes. This is a bug in Astro. I suggest you open an issue there. Maybe you can work around it using rehype-raw.

This bug was initially coded as remcohaszing/remark-mermaidjs#23 and later identified in remcohaszing/rehype-mermaid#10

(Citing @remcohaszing )

What's the expected result?

The processed hast should allow for a further processing by any rehype plugin.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/withastro-astro-ekqekg

Participation

  • I am willing to submit a pull request for this issue.
@github-actions github-actions bot added the needs triage Issue needs to be triaged label Jan 31, 2024
@matthewp
Copy link
Contributor

matthewp commented Feb 1, 2024

Can you submit a PR that fixes this?

@matthewp matthewp added - P3: minor bug An edge case that only affects very specific usage (priority) and removed needs triage Issue needs to be triaged labels Feb 1, 2024
remcohaszing added a commit to remcohaszing/astro that referenced this issue Feb 13, 2024
@remcohaszing
fix(markdown): don’t generate mdast html nodes
fa2c442 
`html` nodes from mdast are converted to `raw` hast nodes. These nodes
are then not processed by proper rehype plugins. Typically if a remark
plugin generates `html` nodes, this indicates it should have actually
been a rehype plugin.

This changes the remark plugins that generate `html` nodes into rehype
nodes. These were `remarkPrism` and `remarkShiki`.

Closes withastro#9909
remcohaszing added a commit to remcohaszing/astro that referenced this issue Feb 13, 2024
@remcohaszing
fix(markdown): don’t generate mdast html nodes
e6846b6 
`html` nodes from mdast are converted to `raw` hast nodes. These nodes
are then not processed by proper rehype plugins. Typically if a remark
plugin generates `html` nodes, this indicates it should have actually
been a rehype plugin.

This changes the remark plugins that generate `html` nodes into rehype
nodes. These were `remarkPrism` and `remarkShiki`.

Closes withastro#9909
@remcohaszing remcohaszing mentioned this issue Feb 13, 2024
Merged
ematipico added a commit that referenced this issue Mar 8, 2024
@remcohaszing @ematipico
@bluwy @sarah11918
fix(markdown): don’t generate mdast html nodes (#10104)
a31bbd7 
* fix(markdown): don’t generate mdast html nodes

`html` nodes from mdast are converted to `raw` hast nodes. These nodes
are then not processed by proper rehype plugins. Typically if a remark
plugin generates `html` nodes, this indicates it should have actually
been a rehype plugin.

This changes the remark plugins that generate `html` nodes into rehype
nodes. These were `remarkPrism` and `remarkShiki`.

Closes #9909

* Apply suggestions from code review

* refactor(mdx): move user defined rehype plugins after syntax highlighting

* fix(mdx): fix issue in mdx rehype plugin ordering

* docs: explain why html/raw nodes are avoided in changeset

This also includes some hints on what users could do to upgrade of they
rely on these nodes.

* Fix MDX rehype plugin ordering

* refactor(remark): restore remarkPrism and remarkShiki

They aren’t used anymore, but removing would be a breaking change.

* chore: mark deprecated

* Apply suggestions from code review

Co-authored-by: Sarah Rainsberger <[email protected]>

* Update .changeset/thirty-beds-smoke.md

Co-authored-by: Sarah Rainsberger <[email protected]>

---------

Co-authored-by: Emanuele Stoppa <[email protected]>
Co-authored-by: Bjorn Lu <[email protected]>
Co-authored-by: Sarah Rainsberger <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
- P3: minor bug An edge case that only affects very specific usage (priority)
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(markdown): don’t generate mdast html nodes remcohaszing/astro
2 participants
@matthewp @LunaticMuch