Skip to content

Parse weirdly if nested html elements (like a figure element in an anchor) are in one line #27

Closed as not planned
@talatkuyuk

Description

@talatkuyuk

Initial checklist

Affected package

hast-util-raw

Steps to reproduce

Here is a markdown input containing simple nested html elements are in one line:

const md = `<a href="https://example.com"><figure><img src="image.png" alt=""></figure></a>`;

const unified = require('unified');
const remarkParse = require('remark-parse');
const remarkRehype = require('remark-rehype');
const rehypeRaw = require('rehype-raw');
const rehypeStringify = require('rehype-stringify');

const html = unified()
  .use(remarkParse)
  .use(remarkRehype, { allowDangerousHtml: true })
  .use(rehypeRaw)
  .use(rehypeStringify)
  .processSync(md);

console.log(html);

Actual behavior

If the html elements are in one line, it produces weird anchor behavior and empty paragraph at the end:

<p><a href="https://example.com"></a></p><figure><a href="https://example.com"><img src="image.png" alt=""></a></figure><p></p>

But if the input is like:

const md = `<a href="https://example.com">
<figure><img src="image.png" alt=""></figure>
</a>`;

it behaves normal and produces the expected result.

Expected behavior

I expect it can handle this kind of simple nested html input in one line and the result to be:

<p><a href="https://example.com"><figure><img src="image.png" alt=""></figure></a></p>

I mean hast-util-raw should handle nested html elements even if they are in one line.

Runtime

node

Package manager

npm

Operating system

macos

Build and bundle tools

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    👀 no/externalThis makes more sense somewhere else👎 phase/noPost cannot or will not be acted on

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions