feat(compiler-core/vapor): reuse html nesting from compiler-dom

related #293

Author: Doctor-wu

packages/compiler-dom/src/htmlNesting.ts

@@ -58,7 +58,18 @@ const onlyValidChildren: Record<string, Set<string>> = {
     'template',
   ]),
   optgroup: new Set(['option']),
+  /**
+   * Though validate-html-nesting declared hr is not a valid child of select
+   * Keep hr as valid select children, Referring https://html.spec.whatwg.org/multipage/grouping-content.html#the-hr-element
+   */
   select: new Set(['optgroup', 'option', 'hr']),
+  /**
+   * Though validate-html-nesting declared math should only have mrow as it's children
+   * Referring mathml-core spec, it's not fact
+   * https://w3c.github.io/mathml-core/#dfn-mrow
+   */
+  // math: new Set(['mrow']),
+  script: new Set(),
   // table
   table: new Set(['caption', 'colgroup', 'tbody', 'tfoot', 'thead']),
   tr: new Set(['td', 'th']),
@@ -67,7 +78,6 @@ const onlyValidChildren: Record<string, Set<string>> = {
   thead: new Set(['tr']),
   tfoot: new Set(['tr']),
   // these elements can not have any children elements
-  script: emptySet,
   iframe: emptySet,
   option: emptySet,
   textarea: emptySet,

packages/compiler-dom/src/index.ts

@@ -10,6 +10,7 @@ import {
   noopDirectiveTransform,
 } from '@vue/compiler-core'
 import { parserOptions } from './parserOptions'
+import { isValidHTMLNesting } from './htmlNesting'
 import { transformStyle } from './transforms/transformStyle'
 import { transformVHtml } from './transforms/vHtml'
 import { transformVText } from './transforms/vText'
@@ -23,6 +24,7 @@ import { validateHtmlNesting } from './transforms/validateHtmlNesting'
 import { extend } from '@vue/shared'
 
 export { parserOptions }
+export { isValidHTMLNesting }
 
 export const DOMNodeTransforms: NodeTransform[] = [
   transformStyle,

packages/compiler-vapor/src/html-nesting.ts

@@ -1,4 +1,3 @@
-import { isValidHTMLNesting } from '../html-nesting'
 import {
   type AttributeNode,
   type ComponentNode,
@@ -37,6 +36,7 @@ import {
 } from '../ir'
 import { EMPTY_EXPRESSION } from './utils'
 import { findProp } from '../utils'
+import { isValidHTMLNesting } from '@vue/compiler-dom'
 
 export const isReservedProp: (key: string) => boolean = /*#__PURE__*/ makeMap(
   // the leading comma is intentional so empty string "" is also included