10000 fix(rules): ignore parents of template tags when checking permitted d… · html-validate/html-validate@6a0d48a · GitHub
[go: up one dir, main page]

Skip to content

Commit 6a0d48a

Browse files
committed
fix(rules): ignore parents of template tags when checking permitted descendants
Elements within a `<template>` tag are not children of the `<template>` according to the [HTML specifications](https://html.spec.whatwg.org/#the-template-element). When checking if a node is a valid descendant of a ancestor, `element-permitted-content` now stops as soon as it encounters a `<template>` tag when going up the node's parent list. This means ancestors of the `<template>` tag are now rightfully ignored when deciding if a node is permitted as a descendant. Fixes #305
1 parent 502c15e commit 6a0d48a

File tree

2 files changed

+59
-1
lines changed

2 files changed

+59
-1
lines changed

src/rules/element-permitted-content.spec.ts

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -298,6 +298,64 @@ describe("rule element-permitted-content", () => {
298298
expect(report).toBeValid();
299299
});
300300

301+
describe("<template>", () => {
302+
it("should not report error when a non permitted descendant is inside a template tag child", async () => {
303+
expect.assertions(1);
304+
const markup = /* HTML */ `
305+
<a href="">
306+
<template>
307+
<a href="">Other content</a>
308+
</template>
309+
</a>
310+
`;
311+
const report = await htmlvalidate.validateString(markup);
312+
expect(report).toBeValid();
313+
});
314+
315+
it("should not report error when a non permitted descendant is inside a template tag descendant", async () => {
316+
expect.assertions(1);
317+
const markup = /* HTML */ `
318+
<a href="">
319+
Some content
320+
<span>
321+
<template>
322+
<a href="">Other content</a>
323+
</template>
324+
</span>
325+
</a>
326+
`;
327+
const report = await htmlvalidate.validateString(markup);
328+
expect(report).toBeValid();
329+
});
330+
331+
it("should report an error for non permitted descendants within a template tag", async () => {
332+
expect.assertions(2);
333+
const markup = /* HTML */ `
334+
<template>
335+
<a href="">
336+
Some content
337+
<span>
338+
<a href="">Other content</a>
339+
</span>
340+
</a>
341+
</template>
342+
`;
343+
const report = await htmlvalidate.validateString(markup);
344+
expect(report).toBeInvalid();
345+
expect(report).toMatchInlineCodeframe(`
346+
"error: <a> element is not permitted as a descendant of <a> (element-permitted-content) at inline:6:9:
347+
4 | Some content
348+
5 | <span>
349+
> 6 | <a href="">Other content</a>
350+
| ^
351+
7 | </span>
352+
8 | </a>
353+
9 | </template>
354+
Selector: template > a > span > a"
355+
`);
356+
});
357+
});
358+
301359
describe("should contain documentation", () => {
302360
it("content error", async () => {
303361
expect.assertions(1);

src/rules/element-permitted-content.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ export default class ElementPermittedContent extends Rule<RuleContext> {
128128
private validatePermittedDescendant(node: HtmlElement, parent: HtmlElement | null): boolean {
129129
for (
130130
let cur = parent;
131-
cur && !cur.isRootElement();
131+
cur && !cur.isRootElement() && cur.tagName !== "template";
132132
cur = /* istanbul ignore next */ cur.parent ?? null
133133
) {
134134
const meta = cur.meta;

0 commit comments

Comments
 (0)
0