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

HTML parser: Collapsible content #267

Closed
NorthDecoder opened this issue Jan 28, 2019 · 4 comments · Fixed by #563
Closed

HTML parser: Collapsible content #267

NorthDecoder opened this issue Jan 28, 2019 · 4 comments · Fixed by #563
Labels
🐛 type/bug This is a problem

Comments

@NorthDecoder
Copy link

NorthDecoder commented Jan 28, 2019 •
edited
Loading

Although react-markdown package claims to do Github Flavored
Markdown (GFM), the demo appears to implement the
syntax differently than the marked.js demo.

The following works in marked.js demo (and on github flavored markdown):

## collapsible markdown?

<details><summary>CLICK ME</summary>
<p>

#### yes, even hidden code blocks!

```python
print("hello world!")
```

</p>
</details>

By removing spacing you can coax the react-markdown
demo to sort of work, but the collapsed content loses
the markdown translation:

## collapsible markdown?

<details><summary>CLICK ME</summary>
<p>
#### yes, even hidden code blocks!
```python
print("hello world!")
```

</p>
</details>

The collapsible markdown works in GFM

CLICK ME

yes, even hidden code blocks!

print("hello world!")

Reference PrISM isssue (84)[https://github.com/NorthwestGreenChemistry/PrISM/issues/84]
@NorthDecoder NorthDecoder mentioned this issue Jan 28, 2019
Closed
@ChristianMurphy
Copy link
Member

This will be resolved by #428

implement the syntax differently than the marked.js

Right, because marked.js isn't commonmark or GFM compatible, see markedjs/marked#1202

@ChristianMurphy ChristianMurphy added the 🐛 type/bug This is a problem label Oct 9, 2020
@wooorm wooorm changed the title Collapsible content HTML parser: Collapsible content Oct 19, 2020
@wooorm wooorm mentioned this issue Apr 9, 2021
Merged
wooorm added a commit that referenced this issue Apr 12, 2021
@wooorm
Replace renderers w/ components, remove HTML parser from core (#563)
77c680f 
* Replace `renderers` w/ `components`
* Replace `allowNode` w/ `allowElement`, which is now given a hast element (as
  the first parameter)
* Replace `allowedTypes` w/ `allowedElements`
* Replace `disallowedTypes` w/ `disallowedElements`
* Change signature of `linkTarget` and `transformLinkUri`, which are now given
  hast children (as the second parameter)
* Change signature of `transformImageUri`, which is now given the `alt` string
  as the second parameter (instead of the fourth)
* Replace `plugins` w/ `remarkPlugins` (backwards compatible change)
* Add `rehypePlugins`
* Change `includeNodeIndex` to `includeElementIndex`: it still sets an `index`,
  but that value now represents the number of preceding elements, it also sets a
  `siblingCount` (instead of `parentChildCount`) with the number of sibling
  elements in the parent
* The `columnAlignment` prop is no longer given to table elements: it’s
  available as `style` on `th` and `td` elements instead
* The `spread` prop is no longer given to list elements: it’s already handled

Remove buggy HTML parsers from core

* If you want HTML, add [`rehype-raw`](https://github.com/rehypejs/rehype-raw)
  to `rehypePlugins` and it’ll work without bugs!
* Remove `allowDangerousHtml` (previously called `escapeHtml`) option: pass
  `rehype-raw` in `rehypePlugins` to allow HTML instead
* Remove `with-html.js`, `plugins/html-parser.js` entries from library
* Remove naïve HTML parser too: either use `rehype-raw` to properly support
  HTML, or don’t allow it at all

Closes GH-549.
Closes GH-563.

The following issues are solved as rehype is now available:

Closes GH-522.
Closes GH-465.
Closes GH-427.
Closes GH-384.
Closes GH-356.

The following issues are solved as a proper HTML parser (`rehype-raw`) is now
available:

Closes GH-562.
Closes GH-460.
Closes GH-454.
Closes GH-452.
Closes GH-433.
Closes GH-386.
Closes GH-385.
Closes GH-345.
Closes GH-320.
Closes GH-302.
Closes GH-267.
Closes GH-259.

The following issues are solved as docs are improved:

Closes GH-251.
@wooorm
Copy link
Member

wooorm commented Apr 12, 2021

This should be solved by landing GH-563 today, which will soon be released in v6.0.0!

@murugaratham
Copy link

Does it work just by adding GFM? when i add GFM plug-in, it just render them as text

@wooorm
Copy link
Member

wooorm commented Jul 2, 2021

<details> has nothing to do with GFM. It is an HTML feature. So see the HTML in markdown section in the readme.

@remarkjs remarkjs locked as resolved and limited conversation to collaborators Jul 2, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
🐛 type/bug This is a problem
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Replace renderers w/ components, remove HTML parser from core remarkjs/react-markdown
4 participants
@murugaratham @wooorm @ChristianMurphy @NorthDecoder