Comments (10)
from markdown-to-jsx.
Hmm, you mean using the compiler in this library for all createElement
if the sole child is a string?
from markdown-to-jsx.
Ah nvm I understand. This appears to be a bug.
from markdown-to-jsx.
Looking into this further, it's a tough one. We're currently parsing the contents of html blocks as inline unless another HTML tag is detected. If we change that behavior, the whitespace of the HTML starts to matter.
For instance, if a nested HTML tag has 4 spaces in front of it, that technically makes it an indented code block. Things get progressively more complex from there with the various edge cases and now having to start being aware of what whitespace is worth paying attention to and what should be discarded...
This is one spot where the GFM markdown spec is somewhat incompatible with arbitrary HTML. I'm not sure there's a solution that will work for all use cases, so my inclination is to leave things as-is or disallow indented code blocks inside arbitrary HTML, which might be surprising. But, then again, block syntax didn't work inside this context before so it would be more of a partial mitigation I guess.
from markdown-to-jsx.
my inclination is to leave things as-is
you meant leave it to render 4 space indents as code blocks in any cases?
from markdown-to-jsx.
Yup. You can see the PR I made which fixes this use case, but it just introduces a new edge case of intentional indented code blocks not working inside HTML since we have to choose.
That being said, I’m open to merging the PR since HTML in markdown is a hack as-is and just add a note somewhere describing caveats.
from markdown-to-jsx.
yes that's what I would do and what others do (try stackedit.io)
from markdown-to-jsx.
Is there a way to disable this behavior? I need the MD syntax to stay untouched inside my component:
<MyOwnSyntax>
* Foo
* Bar
* Baz
**test**
</MyOwnSyntax>
It's get parsed to ul
before MyOwnSyntax
component gets a chance to handle it.
Tbh. nested markdown is kinda an anti-pattern and it's not enabled by default (if supported at all) in any other MD parser. Why? Well MD is whitespace sensitive and HTML is not. The mix of two mutually exclusive paradigms is basically a recipe for endless bugs and edge cases.
It's not limited to code blocks by far. Nested lists are whitespace sensitive.
this kind of title
--
is whitespace sensitive. And so on and so forth... :(
from markdown-to-jsx.
from markdown-to-jsx.
Each of them will add two lines to MD content. And I'll have multiple cases like this per file:
<Quiz>
* Option-1
* Option-2
* Option-3
</Quiz>
<Quiz>
* Option-1
* Option-2
* Option-3
</Quiz>
vs
<Quiz>
'''
* Option-1
* Option-2
* Option-3
'''
</Quiz>
<Quiz>
'''
* Option-1
* Option-2
* Option-3
'''
</Quiz>
– quite a burden.
from markdown-to-jsx.
Related Issues (20)
- Cannot render tag if formatted in a certain way. HOT 3
- Supply original string for special case processing HOT 3
- <blockquote> rendering is broken in Firefox after v7.4.0 HOT 2
- Version 7.4.1 has a strange consol.log in index.cjs and index.umd.js - console.log("AHHHHHHHH") HOT 4
- Slow Regex HTML_BLOCK_ELEMENT_R because of issue with self closing tags HOT 5
- Mutli-line bold/italic text not rendering correctly HOT 1
- Support multiline footnotes
- Firefox unable to render link tags HOT 1
- markdown-to-json refuses to work on some aspects HOT 9
- Can't disable HTML sanitization HOT 3
- Component is rendering too frequently, when dependencies have not changed HOT 1
- [Critical] Page freezes with this raw text HOT 4
- Reopen #568
- follow up on #520 HOT 1
- 在引用块第一位使用 kbd标签后面链接无法正常解析
- Unexpected nested list behavior
- Ordered list is not generated if there's no newline at the end
- Double line breaks (\n\n) are not converted properly HOT 2
- Error using divider with `---` HOT 1
- Empty `<style></style>` or `<style />` causes library to crash
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from markdown-to-jsx.