# validate-html-nesting

> Validate parent-child nesting for HTML elements

Latest version **1.2.4** (published 2025-11-03) · ISC license · 0 weekly downloads

## Install

```sh
npm install validate-html-nesting
pnpm add validate-html-nesting
yarn add validate-html-nesting
bun add validate-html-nesting
```

## Health

**Score 55/100 (C)** — status: stable.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

## Facts

| | |
|---|---|
| Version | 1.2.4 |
| Published | 2025-11-03 |
| First published | 2022-05-13 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 13.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 31 |
| Author | Manan Tank |
| Maintainers | manantank |
| Keywords | html validator, dom validator |

## Links

- npm: https://www.npmjs.com/package/validate-html-nesting
- Repository: https://github.com/MananTank/validate-html-nesting
- Homepage: https://github.com/MananTank/validate-html-nesting#readme
- Issues: https://github.com/MananTank/validate-html-nesting/issues
- npm.io page: https://npm.io/package/validate-html-nesting

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 1.2.4 (latest) — 2025-11-03
- 1.2.3 — 2025-06-16
- 1.2.2 — 2023-04-23
- 1.2.1 — 2023-01-31
- 1.2.0 — 2023-01-16
- 1.1.0 — 2023-01-11
- 1.0.2 — 2022-05-14
- 1.0.1 — 2022-05-14
- 1.0.0 — 2022-05-14
- 0.0.1 — 2022-05-13

## README

# validate-html-nesting

A parent-child nesting validation library for HTML

This is not a full-blown HTML spec validation (intentionally). The parent-child nesting is considered valid if the Browser does not modify it, regardless of whether or not the HTML spec considers it valid or invalid. So, the library is purely for detecting the kind of element nesting which result in altered DOM.

### Example

```html
<p>
  hello
  <hr/>
</p>
```

The Browser modifies the above-shown structure to the below-shown structure, which is why the library considers the `p > hr` nesting invalid.

```html
<p>hello</p>
<hr />
<p></p>
```

And though `<h1> <div> hi </div> </h1>` markup is technically invalid as per HTML spec, it's still considered valid because the browser does not modify it, so `h1 > div` nesting is considered valid by the library.

<br/>

## Install

```bash
npm i validate-html-nesting
```

<br/>

## API

```javascript
isValidHTMLNesting(parentTag: string, childTag: string) : boolean
```

<br />

## Usage Example

```javascript
import { isValidHTMLNesting } from 'validate-html-nesting';

isValidHTMLNesting('a', 'a'); // false
// because <a> can not be child of <a>

isValidHTMLNesting('p', 'hr'); // false
// because <hr> can not be child of <p>

isValidHTMLNesting('div', 'a'); // true
// because <a> can be child of <div>
```

<br/>

## See also

- [eslint-plugin-validate-jsx-nesting](https://github.com/MananTank/eslint-plugin-validate-jsx-nesting) - ESLint plugin for JSX nesting validation
- [babel-plugin-validate-jsx-nesting](https://github.com/MananTank/validate-jsx-nesting) - Compile time JSX nesting validation

<br/>

## Who is this library for?

This library is mostly useful for UI framework authors who need a way to make sure that the DOM structure rendered by the browser matches the authored markup so that there are no unexpected behaviors

<br/>

## Test Suite

Refer to [validation.test.js](/tests/validation.test.js) to see the full test suite

<br/>

## Contributing

PRs are welcome.
Create an issue if you found a bug.

---
_Source: https://npm.io/package/validate-html-nesting · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._