syntax-tree / hast-util-raw Goto Github PK

View Code? Open in Web Editor NEW

10.0 10.0 4.0 225 KB

utility to reparse a hast tree

Home Page: https://unifiedjs.com

License: MIT License

JavaScript 100.00%

hast html util raw syntax-tree hast-util

hast-util-raw's Introduction

hast-util-raw

hast utility to parse the tree and semistandard raw nodes (strings of HTML) again, keeping positional info okay.

What is this?
When should I use this?
Install
Use
API
- Options
- raw(tree, options)
Types
Compatibility
Security
Related
Contribute
License

What is this?

This package is a utility to parse a document again. It passes each node and embedded raw HTML through an HTML parser (parse5), to recreate a tree exactly as how a browser would parse it, while keeping the original data and positional info intact.

When should I use this?

This utility is particularly useful when coming from markdown and wanting to support HTML embedded inside that markdown (which requires passing allowDangerousHtml: true to mdast-util-to-hast). Markdown dictates how, say, a list item or emphasis can be parsed. We can use that to turn the markdown syntax tree into an HTML syntax tree. But markdown also dictates that things that look like HTML, are passed through untouched, even when it just looks like XML but doesn’t really make sense, so we can’t normally use these strings of “HTML” to create an HTML syntax tree. This utility can. It can be used to take those strings of HTML and include them into the syntax tree as actual nodes.

If your final result is HTML and you trust content, then “strings” are fine (you can pass allowDangerousHtml: true to hast-util-to-html, which passes HTML through untouched). But there are two main cases where a proper syntax tree is preferred:

hast utilities need a proper syntax tree as they operate on actual nodes to inspect or transform things, they can’t operate on strings of HTML
other output formats (React, MDX, etc) need actual nodes and can’t handle strings of HTML

The plugin rehype-raw wraps this utility at a higher-level (easier) abstraction.

Install

This package is ESM only. In Node.js (version 16+), install with npm:

npm install hast-util-raw

In Deno with esm.sh:

import {raw} from 'https://esm.sh/hast-util-raw@9'

In browsers with esm.sh:

<script type="module">
  import {raw} from 'https://esm.sh/hast-util-raw@9?bundle'
</script>

Use

import {h} from 'hastscript'
import {raw} from 'hast-util-raw'

const tree = h('div', [h('h1', ['Foo ', h('h2', 'Bar'), ' Baz'])])

const reformatted = raw(tree)

console.log(reformatted)

Yields:

{ type: 'element',
  tagName: 'div',
  properties: {},
  children:
   [ { type: 'element',
       tagName: 'h1',
       properties: {},
       children: [Object] },
     { type: 'element',
       tagName: 'h2',
       properties: {},
       children: [Object] },
     { type: 'text', value: ' Baz' } ] }

API

`Options`

Configuration.

Fields

file? (VFile | null | undefined) — corresponding virtual file representing the input document (optional)
passThrough? (Array<string> | null | undefined)

List of custom hast node types to pass through (as in, keep) (optional).

If the passed through nodes have children, those children are expected to be hast again and will be handled.

`raw(tree, options)`

Pass a hast tree through an HTML parser, which will fix nesting, and turn raw nodes into actual nodes.

Parameters

tree (Root | RootContent) — original hast tree to transform
options? (Options | null | undefined) — configuration (optional)

Returns

Parsed again tree (Root | RootContent).

Types

This package is fully typed with TypeScript. It exports the additional type Options.

The Raw node type is registered by and exposed from mdast-util-to-hast.

Compatibility

Projects maintained by the unified collective are compatible with maintained versions of Node.js.

When we cut a new major release, we drop support for unmaintained versions of Node. This means we try to keep the current release line, hast-util-raw@^9, compatible with Node.js 16.

Security

Use of hast-util-raw can open you up to a cross-site scripting (XSS) attack as raw nodes are unsafe. The following example shows how a raw node is used to inject a script that runs when loaded in a browser.

raw(u('root', [u('raw', '<script>alert(1)</script>')]))

Yields:

<script>alert(1)</script>

Either do not use this utility in combination with user input, or use hast-util-santize.

mdast-util-to-hast — transform mdast to hast
rehype-raw — rehype plugin

Contribute

See contributing.md in syntax-tree/.github for ways to get started. See support.md for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

License

MIT © Titus Wormer

hast-util-raw's People

Contributors

Stargazers

Watchers

Forkers

arobase-che christianmurphy haze methuselah96

hast-util-raw's Issues

Add types

Subject of the feature

Add typescript types

Problem

hast-util-from-parse5 and hast-util-to-parse5 recently got types, which are both in this project.
Updating them will cause a major.
So, it’s a good idea to, if we’re doing a major, add types now too.

/cc @ChristianMurphy @remcohaszing @Rokt33r

Hoes does HTML in Markdown work?

rehypejs/rehype-raw#8

BUG: newlines are added before tables

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

9.0.4

Link to runnable example

No response

Steps to reproduce

> mkdir repro && cd repro
> npm init
> npm i "hast-util-from-html" "hast-util-raw" "hast-util-to-html"
> editor index.mjs # Paste contents from below
> node index.mjs

// index.mjs
import { fromHtml } from "hast-util-from-html";
import { raw } from "hast-util-raw";
import { toHtml } from "hast-util-to-html";

const contents = `<table>
      <thead>
        <tr><th>Column</th></tr>
      </thead>
      <tbody>
        <tr><td>foo</td></tr>
        <tr><td>bar</td></tr>
      </tbody>
    </table>`;
const hast = fromHtml(contents, { fragment: true });
const reformatted = raw(hast);

console.log("Without util-raw:");
console.log(toHtml(hast));
console.log("With util-raw:");
console.log(toHtml(reformatted));

Expected behavior

hast-util-raw shouldn't add whitespace lines at the start.

This was discussed in rehypejs/rehype-raw#22 and they decided it wasn't a bug since ordinarily browsers parse it the same, however, when using non-default values of the CSS property white-space (such as pre or pre-wrap) this issue appears.

Actual behavior

A text node with whitespace is added:

{
   // ...,
   {
      type: 'text',
      value: '\n      \n        \n      \n      \n        \n        \n      \n    '
    },
    // ...
}

Affected runtime and version

[email protected]

Affected package manager and version

[email protected]

Affected OS and version

Arch Linux (Rolling)

Build and bundle tools

No response

Exception on malformed HTML

Subject of the issue

It throws an error while processing text as follows:

<h4><code style="border-radi

us: 5px;"><br>

Your environment

OS: macOS 11.0
Packages: hast-util-raw v6.0.1
Env: node.js 12

Steps to reproduce

const md = `<h4><code style="border-radi

us: 5px;"><br>`;

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);

Preserve tag name cases

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)

Problem

Add an option to preserve the case of HTML tags. This is similar to issue #18, but for HTML tags in general.

Currently, this

{
      "type": "raw",
      "value": "<TabGroup><Tab lang='js' title='JavaScript' /></TabGroup>",     
}

will yield

 {
      "type": "element",
      "tagName": "tabgroup",
      // ...
 }

Solution

TabGroup and Tab should be cased.
It should produce this output instead

 {
      "type": "element",
      "tagName": "TabGroup",
      // ...
 }

Field position is being removed

Using hast-util-raw directly from this package or thru rehype-raw removes position fields when using a combination of proc.runSync(proc.parse(text))

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: v6+

Steps to reproduce

Use unified with remark-parse, remark-rehype and hast-util-raw to create a processor.
Use the processor to create a tree with parse and pass it to runSync.

Here is a failing test case using the same data from the tests suite in the repo:

Link to code example:

When using unified with remark-parse, remark-rehype and hast-util-raw (and rehyper-raw) the position is removed as noted in the next test case. I added a first check to ensure position is present after the transform to rehype.

1..3
# tests 3
# pass  1
# fail  2

I used the data in the current test suite to create a failing case:

test('runSync position removed', function (t) {
  const text = [
    '<i>Some title</i>',
    '',
    '<p>Hello, world!',
    '',
    '*   This',
    '*   Is',
    '*   A',
    '*   List',
    '',
    'A mix of *markdown* and <em>HTML</em>.',
    '',
    '***',
    '',
    '![an image](https://example.com/favicon.ico "title")',
    '',
    '<svg><rect/></svg>',
    '',
    '<div id="foo" class="bar baz"><img src="a" alt=bar>alfred</div>',
    '',
    '<p>Hello, world!',
    ''
  ].join('\n')

  const expected = {
    type: 'root',
    children: [
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'element',
            tagName: 'i',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'Some title',
                position: {
                  start: {line: 1, column: 4, offset: 3},
                  end: {line: 1, column: 14, offset: 13}
                }
              }
            ],
            position: {
              start: {line: 1, column: 1, offset: 0},
              end: {line: 1, column: 18, offset: 17}
            }
          }
        ],
        position: {
          start: {line: 1, column: 1, offset: 0},
          end: {line: 1, column: 18, offset: 17}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'text',
            value: 'Hello, world!\n',
            position: {
              start: {line: 3, column: 4, offset: 22},
              end: null
            }
          }
        ],
        position: {
          start: {line: 3, column: 1, offset: 19},
          end: {line: 5, column: 1, offset: 37}
        }
      },
      {
        type: 'element',
        tagName: 'ul',
        properties: {},
        children: [
          {type: 'text', value: '\n'},
          {
            type: 'element',
            tagName: 'li',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'This',
                position: {
                  start: {line: 5, column: 5, offset: 41},
                  end: {line: 5, column: 9, offset: 45}
                }
              }
            ],
            position: {
              start: {line: 5, column: 1, offset: 37},
              end: {line: 5, column: 9, offset: 45}
            }
          },
          {type: 'text', value: '\n'},
          {
            type: 'element',
            tagName: 'li',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'Is',
                position: {
                  start: {line: 6, column: 5, offset: 50},
                  end: {line: 6, column: 7, offset: 52}
                }
              }
            ],
            position: {
              start: {line: 6, column: 1, offset: 46},
              end: {line: 6, column: 7, offset: 52}
            }
          },
          {type: 'text', value: '\n'},
          {
            type: 'element',
            tagName: 'li',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'A',
                position: {
                  start: {line: 7, column: 5, offset: 57},
                  end: {line: 7, column: 6, offset: 58}
                }
              }
            ],
            position: {
              start: {line: 7, column: 1, offset: 53},
              end: {line: 7, column: 6, offset: 58}
            }
          },
          {type: 'text', value: '\n'},
          {
            type: 'element',
            tagName: 'li',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'List',
                position: {
                  start: {line: 8, column: 5, offset: 63},
                  end: {line: 8, column: 9, offset: 67}
                }
              }
            ],
            position: {
              start: {line: 8, column: 1, offset: 59},
              end: {line: 8, column: 9, offset: 67}
            }
          },
          {type: 'text', value: '\n'}
        ],
        position: {
          start: {line: 5, column: 1, offset: 37},
          end: {line: 8, column: 9, offset: 67}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'text',
            value: 'A mix of ',
            position: {
              start: {line: 10, column: 1, offset: 69},
              end: {line: 10, column: 10, offset: 78}
            }
          },
          {
            type: 'element',
            tagName: 'em',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'markdown',
                position: {
                  start: {line: 10, column: 11, offset: 79},
                  end: {line: 10, column: 19, offset: 87}
                }
              }
            ],
            position: {
              start: {line: 10, column: 10, offset: 78},
              end: {line: 10, column: 20, offset: 88}
            }
          },
          {
            type: 'text',
            value: ' and ',
            position: {
              start: {line: 10, column: 20, offset: 88},
              end: {line: 10, column: 25, offset: 93}
            }
          },
          {
            type: 'element',
            tagName: 'em',
            properties: {},
            children: [
              {
                type: 'text',
                value: 'HTML',
                position: {
                  start: {line: 10, column: 29, offset: 97},
                  end: {line: 10, column: 33, offset: 101}
                }
              }
            ],
            position: {
              start: {line: 10, column: 25, offset: 93},
              end: {line: 10, column: 38, offset: 106}
            }
          },
          {
            type: 'text',
            value: '.',
            position: {
              start: {line: 10, column: 38, offset: 106},
              end: {line: 10, column: 39, offset: 107}
            }
          }
        ],
        position: {
          start: {line: 10, column: 1, offset: 69},
          end: {line: 10, column: 39, offset: 107}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'hr',
        properties: {},
        children: [],
        position: {
          start: {line: 12, column: 1, offset: 109},
          end: {line: 12, column: 4, offset: 112}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'element',
            tagName: 'img',
            properties: {
              src: 'https://example.com/favicon.ico',
              alt: 'an image',
              title: 'title'
            },
            children: [],
            position: {
              start: {line: 14, column: 1, offset: 114},
              end: {line: 14, column: 53, offset: 166}
            }
          }
        ],
        position: {
          start: {line: 14, column: 1, offset: 114},
          end: {line: 14, column: 53, offset: 166}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'element',
            tagName: 'svg',
            properties: {},
            children: [
              {
                type: 'element',
                tagName: 'rect',
                properties: {},
                children: [],
                position: {
                  start: {line: 16, column: 6, offset: 173},
                  end: {line: 16, column: 13, offset: 180}
                }
              }
            ],
            position: {
              start: {line: 16, column: 1, offset: 168},
              end: {line: 16, column: 19, offset: 186}
            }
          }
        ],
        position: {
          start: {line: 16, column: 1, offset: 168},
          end: {line: 16, column: 19, offset: 186}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'div',
        properties: {id: 'foo', className: ['bar', 'baz']},
        children: [
          {
            type: 'element',
            tagName: 'img',
            properties: {src: 'a', alt: 'bar'},
            children: [],
            position: {
              start: {line: 18, column: 31, offset: 218},
              end: {line: 18, column: 52, offset: 239}
            }
          },
          {
            type: 'text',
            value: 'alfred',
            position: {
              start: {line: 18, column: 52, offset: 239},
              end: {line: 18, column: 58, offset: 245}
            }
          }
        ],
        position: {
          start: {line: 18, column: 1, offset: 188},
          end: {line: 18, column: 64, offset: 251}
        }
      },
      {type: 'text', value: '\n'},
      {
        type: 'element',
        tagName: 'p',
        properties: {},
        children: [
          {
            type: 'text',
            value: 'Hello, world!',
            position: {
              start: {line: 20, column: 4, offset: 256},
              end: {line: 20, column: 17, offset: 270}
            }
          }
        ],
        position: {
          start: {line: 20, column: 1, offset: 253},
          end: {line: 20, column: 17, offset: 270}
        }
      }
    ],
    data: {quirksMode: false},
    position: {
      start: {line: 1, column: 1, offset: 0},
      end: {line: 21, column: 1, offset: 270}
    }
  }

  const proc = unified()
    .use(remarkParse)
    .use(remarkRehype, {allowDangerousHtml: true})
    .use(function () {
      return transformer
      function transformer(/** @type {import('unist').Node} */ tree) {
        t.ok(tree.position, 'should have position')
        return tree
      }
    })
    .use(function () {
      // @ts-ignore hast is more specific than unist.
      return (tree, file) => raw(tree, file)
    })
    .use(function () {
      return transformer
      function transformer(/** @type {import('unist').Node} */ tree) {
        t.deepEqual(tree, expected, 'should equal the fixture tree')
      }
    })

  proc.runSync(proc.parse(text))

  t.end()
})

Expected behavior

The position fields should not be removed.

Actual behavior

The position fields are being removed

RAWTEXT/RCDATA elements are closed inconsistently

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

7.2.3

Link to runnable example

No response

Steps to reproduce

import {raw} from 'hast-util-raw'
import {u} from 'unist-builder'

let test1 = u('root', [
	u('raw', '<xmp><b>bold</b>after</xmp>'),
])

let test2 = u('root', [
	u('raw', '<xmp>'),
	u('raw', '<b>'),
	u('text', 'bold'),
	u('raw', '</b>'),
	u('text', 'after'),
	u('raw', '</xmp>'),
])

console.log(raw(test1))
console.log(raw(test2))

Expected behavior

The output tree should contain:

root
- element: xmp
  - text: "<b>bold</b>after"

(note: <xmp> is parsed in RAWTEXT mode, so tags/escapes aren't parsed inside it, and it only ends when the parser reaches </xmp>)

Actual behavior

root
- element: xmp
  - text: "<b>bold"
- text: "after"

the <xmp> element is being closed by the </b> tag
This affects all elements whose contents are parsed as RAWTEXT/SCRIPT_DATA (<style>, <iframe>, <noembed>, <noframes>, <script>) or RCDATA (<title>, <textarea>)

This can be seen in remark/rehype (with allowDangerousHtml enabled), in cases like:

<xmp><b>one</b><b>two</b></xmp>

which renders as:

<b>onetwo

Affected runtime and version

[email protected]

Affected package manager and version

[email protected]

Affected OS and version

Debian

Build and bundle tools

Rollup

extra < being added by raw parser

When a single word boundary character exists between tags, an extra < is added to the text value.

<p class='stage'>Ser på <b class='character'>kaptejnen</b>.</p>

yields:

<p class='stage'>Ser på <b class='character'>kaptejnen</b>.<</p>

As soon as there are multiple characters, or the character between the tags is no word boundary character, the extra < is not being added.

I assume this is because of the nature of the word boundary \b in regexes, not indicating a real character unless it is followed by another character. In this case the next character is the opening < f the closing tag.

Tag name cases for SVG in HTML

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

latest

Link to runnable example

No response

Steps to reproduce

import assert from 'node:assert/strict'
import {toHtml} from 'hast-util-to-html'
import {toHast} from 'mdast-util-to-hast'
import {raw} from './index.js'

/** @type {import('mdast').Root} */
const mdast = {
  type: 'root',
  children: [
    {
      type: 'paragraph',
      children: [],
      data: {
        hChildren: [
          // The root element here doesn’t affect the output.
          // {
          //   type: 'root',
          //   children: [
          {
            type: 'element',
            tagName: 'svg',
            children: [
              {
                type: 'element',
                tagName: 'foreignObject',
                properties: {},
                children: [
                  {
                    type: 'element',
                    tagName: 'div',
                    children: []
                  }
                ]
              }
            ]
          }
          //   ],
          // },
        ]
      }
    }
  ]
}

const hast = toHast(mdast)
assert(hast)
console.dir(hast, {depth: null})
const hast2 = raw(hast)
console.dir(hast2, {depth: null})

const doc = toHtml(hast2)
console.log(doc)

Expected behavior

foreignObject should be cased

Actual behavior

lowercased

Affected runtime and version

latest

Affected package manager and version

No response

Affected OS and version

No response

Build and bundle tools

No response

code data fields be removed

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

latest

Link to runnable example

https://node-rqtpry.stackblitz.io

Steps to reproduce

Expected behavior

Do not remove this field.

Actual behavior

data field be removed.

Runtime

Node v16

Package manager

npm v7

OS

macOS

Build and bundle tools

No response

`Failed to parse source map from 'node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js.map' file: Error: ENOENT: no such file or directory`

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

9.0.3

Link to runnable example

No response

Steps to reproduce

package.json:

{
  "name": "my-app",
  "version": "0.1.0",
  "proxy2": "http://localhost:8080",
  "proxy": "https://extras.carusosignature.com",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.11.4",
    "@emotion/styled": "^11.11.5",
    "@fontsource/roboto": "^4.5.8",
    "@mui/icons-material": "^5.11.11",
    "@mui/material": "^5.15.15",
    "@mui/x-date-pickers": "^6.14.0",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.18.16",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "@types/underscore": "^1.11.9",
    "@zxing/library": "^0.20.0",
    "dayjs": "^1.11.9",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-markdown": "^8.0.6",
    "react-plaid-link": "^3.5.1",
    "react-router-dom": "^6.9.0",
    "react-scripts": "5.0.1",
    "react-viewport-hooks": "^1.5.0",
    "rehype-raw": "^7.0.0",
    "typescript": "^4.9.5",
    "underscore": "^1.13.6",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Expected behavior

No warnings should be present

Actual behavior

Compiled with warnings.

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/error-codes.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/error-codes.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/foreign-content.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/foreign-content.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/html.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/html.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/token.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/token.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/unicode.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/unicode.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/index.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/formatting-element-list.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/formatting-element-list.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/index.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/open-element-stack.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/open-element-stack.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/serializer/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/serializer/index.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/index.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/preprocessor.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/preprocessor.js.map'

Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tree-adapters/default.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tree-adapters/default.js.map'

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/doctype.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/error-codes.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/error-codes.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/error-codes.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/foreign-content.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/foreign-content.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/foreign-content.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/html.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/html.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/html.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/token.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/token.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/token.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/common/unicode.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/unicode.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/common/unicode.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/index.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/parser/formatting-element-list.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/formatting-element-list.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/formatting-element-list.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/parser/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/index.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/parser/open-element-stack.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/open-element-stack.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/parser/open-element-stack.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/serializer/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/serializer/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/serializer/index.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/index.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/index.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/preprocessor.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/preprocessor.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tokenizer/preprocessor.js.map'

WARNING in ./node_modules/hast-util-raw/node_modules/parse5/dist/tree-adapters/default.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tree-adapters/default.js.map' file: Error: ENOENT: no such file or directory, open '/Users/<user>/<company>/transactions/ui/node_modules/hast-util-raw/node_modules/parse5/dist/tree-adapters/default.js.map'

webpack compiled with 14 warnings

Affected runtime and version

18.20.1

Affected package manager and version

10.5.0

Affected OS and version

macOS 14.4.1

Build and bundle tools

No response

Unable format element's with properties `type` and `value` that aren't tagName: input

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

hast-util-raw@9

Link to runnable example

https://codepen.io/matthewp/pen/rNRmLLq?editors=1010

Steps to reproduce

This is enough to cause it

import {raw} from 'hast-util-raw'
import {h} from 'hastscript'

const tree = h('div', {'type':'number','value':'1'}, []);

const reformatted = raw(tree);

console.log(reformatted);

Note that if you replace div with input it works fine. I traced this back from an Astro bug which is reproducible at a higher level here: https://stackblitz.com/edit/github-qdnomy?file=src%2Fpages%2Findex.md . In that example the div comes into hast-util-raw as a "raw" node (I think), but I assume that it's the same underlying issue as in the reduced example.

Expected behavior

Should be reformatted with the properties as properties.

Actual behavior

Throws with: Cannot compile number node

Affected runtime and version

node@18 and Chrome

Affected package manager and version

No response

Affected OS and version

No response

Build and bundle tools

Astro

word in a raw node value getting duplicated

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

hast-util-raw 7.2.1

Link to runnable example

https://stackblitz.com/edit/node-h5dh1f?file=index.js

Steps to reproduce

this was discovered in node.js docs, see nodejs/node#43864
provided a minimal repro in stackblitz where the last word in this case is repeated

Expected behavior

the output of

import { raw } from 'hast-util-raw';

const children = [
  { type: 'raw', value: 'this is a thing' },
  { type: 'raw', value: '<sup>' },
  { type: 'text', value: 'b' },
  { type: 'raw', value: '</sup>' },
];

console.log(raw({ type: 'root', children }));

should be

{
  type: 'root',
  children: [
    { type: 'text', value: 'this is a thing' },
    {
      type: 'element',
      tagName: 'sup',
      properties: {},
      children: [Array]
    }
  ],
  data: { quirksMode: false }
}

Actual behavior

the word thing is duplicated (changing to another word will result with the same issue):

{
  type: 'root',
  children: [
    { type: 'text', value: 'this is a thingthing' },
    {
      type: 'element',
      tagName: 'sup',
      properties: {},
      children: [Array]
    }
  ],
  data: { quirksMode: false }
}

Affected runtime and version

node18, node 16

Affected package manager and version

[email protected]

Affected OS and version

any

Build and bundle tools

No response

Issues with HTML entities parsing

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

test with 7.2.0 and 6.0.2

Link to runnable example

No response

Steps to reproduce

import { raw } from "hast-util-raw"

const root = raw({
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'span',
      children: [
        {
          type: 'raw',
          value: '/api/v1/&lt;resource-type-name&gt;/&lt;resource-name&gt;', <-- this
        },
      ],
    },
  ],
})

console.log(root)

// {
//   "type": "root",
//   "children": [
//     {
//       "type": "element",
//       "tagName": "span",
//       "properties": {},
//       "children": [
//         {
//           "type": "text",
//           "value": "/api/v1/<resource-type-name>/<resource-name" <-- this
//         }
//       ]
//     }
//   ],
//   "data": {
//     "quirksMode": false
//   }
// }

Expected behavior

The last > is retained.

Actual behavior

The last > is removed.

Runtime

Node v14

Package manager

npm v7

OS

macOS

Build and bundle tools

Other (please specify in steps to reproduce)

Type error when using strict package manager

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

[email protected] and [email protected]

Looks like the reference to @types/unist was introduced in #17.

Link to runnable example

No response

Steps to reproduce

Create project using hast-util-raw with a strict package manager like Yarn PnP and skipLibCheck set to false.
Type-check using TypeScript.

Expected behavior

No type errors.

Actual behavior

Type error:

ERROR in node_modules/hast-util-raw/lib/index.d.ts:28:28
TS2307: Cannot find module 'unist' or its corresponding type declarations.
    26 | export type Location = import('parse5').Token.Location;
    27 | export type TagToken = import('parse5').Token.TagToken;
  > 28 | export type Point = import('unist').Point;
       |                            ^^^^^^^
    29 | export type VFile = import('vfile').VFile;
    30 | /**
    31 |  * Configuration.

Affected runtime and version

N/A

Affected package manager and version

No response

Affected OS and version

No response

Build and bundle tools

No response

Raw nodes parsed as text

Hi,

I've encountered some issues using remark-iframe.
It seems that it is a bug from hast-util-raw.

I just created a PR to highlight the problem. A fix will follow soon.

See you soon :D

Edit: Fixed ?

Edit2: Oh ! And @vhf, he helped me a lot to find out the problem. Just to keep him in the loop.

Nesting of list items when there is an html element in one of them

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

6.1.0

Link to runnable example

https://codesandbox.io/s/remark-rehype-debug-forked-4hivb?file=/src/index.js

Steps to reproduce

Given the following markdown string:

- a <table> b
- c

rehype produce the following AST (with the allowDangerousHtml option) (position information stripped for clarity):

{
  "type": "root",
  "children": [
    {
      "type": "element",
      "tagName": "ul",
      "properties": {},
      "children": [
        {
          "type": "text",
          "value": "\n"
        },
        {
          "type": "element",
          "tagName": "li",
          "properties": {},
          "children": [
            {
              "type": "text",
              "value": "a "
            },
            {
              "type": "raw",
              "value": "<table>"
            },
            {
              "type": "text",
              "value": " b"
            }
          ]
        },
        {
          "type": "text",
          "value": "\n"
        },
        {
          "type": "element",
          "tagName": "li",
          "properties": {},
          "children": [
            {
              "type": "text",
              "value": "c"
            }
          ]
        },
        {
          "type": "text",
          "value": "\n"
        }
      ]
    }
  ]
}

Running rehype-raw on it gives the following AST:

{
  "type": "root",
  "children": [
    {
      "type": "element",
      "tagName": "ul",
      "properties": {},
      "children": [
        {
          "type": "text",
          "value": "\n"
        },
        {
          "type": "element",
          "tagName": "li",
          "properties": {},
          "children": [
            {
              "type": "text",
              "value": "a  b\n"
            },
            {
              "type": "element",
              "tagName": "li",
              "properties": {},
              "children": [
                {
                  "type": "text",
                  "value": "c"
                }
              ]
            },
            {
              "type": "text",
              "value": "\n"
            },
            {
              "type": "element",
              "tagName": "table",
              "properties": {},
              "children": []
            }
          ]
        }
      ]
    }
  ]
}

As you can see, the second list item is nested under the first one

Expected behavior

I would expect the list items to all be at the same level

Actual behavior

List items level are modified

Runtime

Node v16

Package manager

npm v7

OS

macOS

Build and bundle tools

No response

`linearGradient` siblings are moved inside `linearGradient`

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

[email protected]

Link to runnable example

No response

Steps to reproduce

Fun the following script:

import { raw } from 'hast-util-raw'

const reformatted = raw({
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'svg',
      properties: {},
      children: [
        {
          type: 'element',
          tagName: 'circle',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'rect',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'linearGradient',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'path',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'g',
          properties: {},
          children: []
        }
      ]
    }
  ]
})

console.dir(reformatted, { depth: Number.POSITIVE_INFINITY })

This causes remcohaszing/rehype-mermaid#17

Expected behavior

It logs:

{
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'svg',
      properties: {},
      children: [
        {
          type: 'element',
          tagName: 'circle',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'rect',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'linearGradient',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'path',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'g',
          properties: {},
          children: []
        }
      ]
    }
  ],
  data: { quirksMode: false }
}

Actual behavior

It moves all siblings after linearGradient inside its children.

{
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'svg',
      properties: {},
      children: [
        {
          type: 'element',
          tagName: 'circle',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'rect',
          properties: {},
          children: []
        },
        {
          type: 'element',
          tagName: 'linearGradient',
          properties: {},
          children: [
            {
              type: 'element',
              tagName: 'path',
              properties: {},
              children: []
            },
            {
              type: 'element',
              tagName: 'g',
              properties: {},
              children: []
            }
          ]
        }
      ]
    }
  ],
  data: { quirksMode: false }
}

Affected runtime and version

[email protected]

Affected package manager and version

[email protected]

Affected OS and version

Pop!_OS 22.04

Build and bundle tools

No response

syntax-tree / hast-util-raw Goto Github PK

hast-util-raw's Introduction

hast-util-raw

Contents

What is this?

When should I use this?

Install

Use

API

Options

Fields

raw(tree, options)

Parameters

Returns

Types

Compatibility

Security

Related

Contribute

License

hast-util-raw's People

Contributors

Stargazers

Watchers

Forkers

hast-util-raw's Issues

Subject of the feature

Problem

Initial checklist

Affected packages and versions

Link to runnable example

Steps to reproduce

Expected behavior

Actual behavior

Affected runtime and version

Affected package manager and version

Affected OS and version

Build and bundle tools

Subject of the issue

Your environment

Steps to reproduce

Initial checklist

Problem

Solution

Initial checklist

Steps to reproduce

Expected behavior

Actual behavior

Initial checklist

Affected packages and versions

Link to runnable example

Steps to reproduce

Expected behavior

Actual behavior

Affected runtime and version

Affected package manager and version

Affected OS and version

Build and bundle tools

Initial checklist

Affected packages and versions

Link to runnable example

Steps to reproduce

Expected behavior

Actual behavior

Affected runtime and version

Affected package manager and version

Affected OS and version

Build and bundle tools

Initial checklist

Affected packages and versions

Link to runnable example

Steps to reproduce

Expected behavior

Actual behavior

Runtime

Package manager

OS

Build and bundle tools

Initial checklist

Affected packages and versions

`Options`

`raw(tree, options)`