fix(theme): allow empty code blocks and live playgrounds#9704
Conversation
✅ [V2]
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
@lebalz I understand your intent was likely to create an empty react-live playground (#9699) However, it seems that react-live does not support well an empty editor (cc @carloskelly13) Not sure what you would expect the empty editor to render, curious to know more about the use case you have in mind. |
⚡️ Lighthouse report for the deploy preview of this PR
|
|
Size Change: 0 B Total Size: 927 kB ℹ️ View Unchanged
|
|
The latest updates on your projects. Learn more about Argos notifications ↗︎
|
Co-authored-by: Joshua Chen <[email protected]> Co-authored-by: sebastienlorber <[email protected]> Co-authored-by: Sébastien Lorber <[email protected]> Co-authored-by: Ivan Mar (sOkam!) <[email protected]> Co-authored-by: c0h1b4 <[email protected]> Co-authored-by: Janessa Garrow <[email protected]> Co-authored-by: ozaki <[email protected]> Co-authored-by: axmmisaka <[email protected]> Co-authored-by: Tatsunori Uchino <[email protected]> Co-authored-by: Simen Bekkhus <[email protected]> fix(i18n): complete translations for theme-common.json Brazilian Portuguese (pt-BR) (#9477) fix(content-blog): add baseUrl for author.image_url (#9581) fix(type-aliases): add `title` prop for imported inline SVG React components (#9612) fix(utils): Markdown link replacement with <> but no spaces (#9617) fix(live-codeblock): stabilize react-live transformCode callback, fix editor/preview desync (#9631) fix(cli): output help when no conventional config + no subcommand (#9648) fix CI job (#9604) fix Lint Autofix workflow (#9632) fix(pwa-plugin): upgrade workbox (#9668) fix(create-docusaurus): fix init template code blocks, and little improvements (#9696) fix(theme): allow empty code blocks and live playgrounds (#9704)
|
Thanks @slorber for the fix 😍 Actually i'm using empty codeblocks for an education page where the students can write and execute python code in a similar manner as the live playground (with a custom python codeblock theme...). And i have a playground where the students find empty codeblocks to try stuff as turtle graphics and so on... https://ofi.gbsl.website/playground During the upgrad to docusaurus v3 this bug popped up and i thought the reported usecase would apply for live codeblocks too, but i didn"t try out the scenario - obviously it does not make sense in that usecase... sorry for that. |
Co-authored-by: Joshua Chen <[email protected]> Co-authored-by: Joey Clover <[email protected]> Co-authored-by: reece-white <[email protected]> Co-authored-by: Shreesh Nautiyal <[email protected]> Co-authored-by: Nick Gerleman <[email protected]> Co-authored-by: Chongyi Zheng <[email protected]> Co-authored-by: MCR Studio <[email protected]> Co-authored-by: sebastienlorber <[email protected]> Co-authored-by: Sébastien Lorber <[email protected]> Co-authored-by: Ivan Mar (sOkam!) <[email protected]> Co-authored-by: c0h1b4 <[email protected]> Co-authored-by: Janessa Garrow <[email protected]> Co-authored-by: ozaki <[email protected]> Co-authored-by: axmmisaka <[email protected]> Co-authored-by: Tatsunori Uchino <[email protected]> Co-authored-by: Simen Bekkhus <[email protected]> Co-authored-by: Sanjaiyan Parthipan <[email protected]> Co-authored-by: Jack Robson <[email protected]> Co-authored-by: dawei-wang <[email protected]> Co-authored-by: eitsupi <[email protected]> fix(create-docusaurus): fix readme docusaurus 2 ref (#9487) fix(theme): fix firefox CSS :has() support bug (#9530) fix(theme): docs html sidebar items should always be visible (#9531) fix: v3 admonitions should support v2 title syntax for nested admonitions (#9535) fix(theme-classic): fixed wrong cursor on dropdown menu in navbar, when window is small (#9398) fix(theme): upgrade prism-react-renderer, fix html script and style tag highlighting (#9567) fix: add v2 retrocompatible support for quoted admonitions (#9570) fix(i18n): complete translations for theme-common.json Brazilian Portuguese (pt-BR) (#9477) fix(content-blog): add baseUrl for author.image_url (#9581) fix(type-aliases): add `title` prop for imported inline SVG React components (#9612) fix(utils): Markdown link replacement with <> but no spaces (#9617) fix(live-codeblock): stabilize react-live transformCode callback, fix editor/preview desync (#9631) fix(cli): output help when no conventional config + no subcommand (#9648) fix CI job (#9604) fix Lint Autofix workflow (#9632) fix(pwa-plugin): upgrade workbox (#9668) fix(create-docusaurus): fix init template code blocks, and little improvements (#9696) fix(theme): allow empty code blocks and live playgrounds (#9704) fix(core): various broken anchor link fixes (#9732) fix: remove old useless mdx typedefs (#9733) fix(theme-common): fix missing code block MagicComments style in Visual Basic (.NET) 16 (#9727) fix(core): conditionally include `hostname` parameter when using… (#9407) fix(create-docusaurus): fix typo in init template sample docs (#9783) fix(mdx-loader): allow spaces before `mdx-code-block` info string (#9776) fix(core): links with target "_blank" should no be checked by the broken link checker (#9788) fix(core): broken links optimization behaves differently than non-optimized logic (#9791)

Motivation
An empty code block should render as a code block, not an inline code block
An empty code block can be a live playground
Fix #9699
Note: MDX will emit no children prop if the code block is empty or has a single line, which is kind-of surprising but we'll handle it.
Also extracts
CodeInlineto make it easier to swizzle and customize without ejecting<MDXCode/>(the RN website does that)(MDX v1 used to have a spacial
inlineCodecomponent but it was removed in v2: https://mdxjs.com/migrating/v2/)Test Plan
dogfood + deploy preview
Test links
https://deploy-preview-9704--docusaurus-2.netlify.app/tests/pages/code-block-tests#empty-code-blocks-edge-cases