How to display incomplete PHP code outside of a code block

[charliematters]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

Remark@10, Rehype@9

Link to runnable example

https://stackblitz.com/edit/github-uzm7cu?file=src%2Fmain.ts

Steps to reproduce

We have some users unfamiliar with markdown who are adding snippets of code in without code blocks. In one case, they are adding an incomplete php section:

Before
<?php
// PHP code
After

And reporting that it is not working as expected:

Before

I realise this is an education issue, however the first google result for a markdown editor (StackEdit) handles this case in a more expected way, outputting this:

Before

<?php // PHP code After

Expected behavior

The valid markdown after the PHP tag should still be shown, along with the incomplete PHP

Actual behavior

The PHP start tag stops any further output

Runtime

Node v17

Package manager

npm 8

OS

Windows

Build and bundle tools

Webpack

[ChristianMurphy]

Welcome @charliematters! 👋

TL;DR
There is no bug, what you describe is how CommonMark works, the best approach would be to educate content authors on how standard markdown works.

Long version
<?php triggers the start of an HTML block, and everything inside is interpreted as HTML attributes. (CommonMark reference implementation https://spec.commonmark.org/dingus/?text=Before%0A%3C%3Fphp%0A%2F%2F%20PHP%20code%0AAfter)

If authors aim is to show what PHP syntax looks like, they should use a code block

Before
```php
<?php
// PHP code
```
After

If the intent is to show the PHP content as plain text, escape it

Before
\<?php
// PHP code
After

Or if the intent is to use the PHP as a pre-processor for markdown, run it through the pre-processor first.

---

Reading between the lines of your issue a bit, it sounds like content author may have an interest in adding interactive content or database backed content to the page?
If so consider leveraging https://github.com/mdx-js/mdx/ or https://github.com/remarkjs/remark-directive

[wooorm]

Also: we support plugins. If you write a plugin, you can turn html into text, making it visible.

react-markdown at least has an option for it.

Perhaps you can share your actual setup so that we can practically help you.

[charliematters]

Thanks for the offer, and your answers have been really helpful.

I hate to be that person, but it's a proprietary codebase so can't share it.

We do actually have a bunch of plugins in our pipeline (some of which are hand-made), so I'm going to report back to the user that that's how (our) markdown works and add a low-priority ticket to work on a plugin which grabs those text nodes and renders them in a basic way