@vobs/runtime 1.7.8 → 1.8.1

package/src/show-classlist.test.ts

@@ -0,0 +1,205 @@
+// @vitest-environment jsdom
+/*
+ * `Show` + `classList` —— 外部踩坑文档 C 条的对策，从"人肉纪律"变成一行。
+ *
+ * C 条：条件分支里的输入控件丢焦点 —— `insertDynamic` 按引用比较（`next === current`），
+ * 条件表达式一变化就**重建子树**，于是每敲一个字符焦点就丢、滚动位置与内部状态全丢。
+ *
+ * 判据用**节点身份 + 焦点**（不是"看起来对不对"）：
+ * - 条件反复变化后，输入元素**还是同一个对象**
+ * - `document.activeElement` 始终是它（焦点没丢）
+ * - 输入框里的值没被重置
+ */
+import { describe, expect, it } from 'vitest'
+import { scheduler, state } from '@vobs/reactivity'
+import { createComponent, createDOMRenderer, createElement, createVobs, setRenderer } from '@vobs/vobs'
+import type { VobsNode } from '@vobs/vobs'
+import { applyClassList, bindAttribute, setStaticProps, Show } from './index'
+
+setRenderer(createDOMRenderer())
+const settle = (): void => { scheduler.flush() }
+
+describe('Show：保留挂载，条件变化不重建子树', () => {
+  function mountShow(when: () => boolean, extra: Record<string, unknown> = {}) {
+    const host = document.createElement('main')
+    document.body.appendChild(host)
+    const app = createVobs({
+      render: () => createComponent(Show, {
+        get when() { return when() },
+        children: () => {
+          const input = createElement('input') as HTMLInputElement
+          return input
+        },
+        ...extra
+      } as never)
+    })
+    app.mount(host)
+    const input = (): HTMLInputElement | null => host.querySelector('input')
+    return { host, app, input, cleanup: () => { app.destroy(); host.remove() } }
+  }
+
+  it('条件切换后输入元素**仍是同一个对象**（没被重建）', () => {
+    const open = state(true)
+    const view = mountShow(() => open.value)
+    const before = view.input()
+    expect(before).not.toBeNull()
+
+    open.value = false
+    settle()
+    open.value = true
+    settle()
+    open.value = false
+    settle()
+    expect(view.input(), 'Show 重建了子树（这正是 C 条那个 bug）').toBe(before)
+    view.cleanup()
+  })
+
+  it('条件切换不丢焦点、不重置输入值', () => {
+    const open = state(true)
+    const view = mountShow(() => open.value)
+    const input = view.input()!
+    input.focus()
+    input.value = '用户输入的内容'
+    expect(document.activeElement).toBe(input)
+
+    open.value = false
+    settle()
+    open.value = true
+    settle()
+
+    expect(document.activeElement, '条件变化把焦点弄丢了').toBe(input)
+    expect(input.value, '条件变化重置了用户输入').toBe('用户输入的内容')
+    view.cleanup()
+  })
+
+  it('隐藏时挂 hidden + inert（移出焦点顺序与无障碍树）', () => {
+    const open = state(true)
+    const view = mountShow(() => open.value)
+    const input = view.input()!
+
+    expect(input.hidden).toBe(false)
+    expect(input.hasAttribute('inert')).toBe(false)
+
+    open.value = false
+    settle()
+    expect(input.hidden).toBe(true)
+    expect(input.hasAttribute('inert')).toBe(true)
+
+    open.value = true
+    settle()
+    expect(input.hidden).toBe(false)
+    expect(input.hasAttribute('inert'), '重新显示后 inert 没被移除').toBe(false)
+    view.cleanup()
+  })
+
+  it('hiddenClass 按需增删，且不影响作者自己的类名', () => {
+    const open = state(true)
+    const host = document.createElement('main')
+    document.body.appendChild(host)
+    const app = createVobs({
+      render: () => createComponent(Show, {
+        get when() { return open.value },
+        hiddenClass: 'is-hidden',
+        children: () => {
+          const el = createElement('div')
+          el.setAttribute('class', 'panel custom')
+          return el
+        }
+      } as never)
+    })
+    app.mount(host)
+    const el = host.querySelector('div')!
+    expect(el.getAttribute('class')).toBe('panel custom')
+
+    open.value = false
+    settle()
+    expect(el.getAttribute('class')).toBe('panel custom is-hidden')
+
+    open.value = true
+    settle()
+    expect(el.getAttribute('class'), '作者的类名被抹掉了').toBe('panel custom')
+    app.destroy(); host.remove()
+  })
+
+  it('children 不是单个元素 → 抛出并说明该怎么改（不静默退化）', () => {
+    const host = document.createElement('main')
+    document.body.appendChild(host)
+    expect(() => {
+      createVobs({
+        render: () => createComponent(Show, {
+          when: true,
+          children: 'plain text' as unknown as VobsNode
+        } as never)
+      }).mount(host)
+    }).toThrowError(/单个元素/u)
+    host.remove()
+  })
+
+  it('children 为空 → 抛出', () => {
+    const host = document.createElement('main')
+    document.body.appendChild(host)
+    expect(() => {
+      createVobs({ render: () => createComponent(Show, { when: true } as never) }).mount(host)
+    }).toThrowError(/不能为空/u)
+    host.remove()
+  })
+})
+
+describe('classList：一行替代手拼类名字符串', () => {
+  it('对象形式：真值加类、假值不加', () => {
+    const el = createElement('div')
+    applyClassList(el, { 'is-open': true, 'is-busy': false, 'is-ready': 1 })
+    expect(el.getAttribute('class')).toBe('is-open is-ready')
+  })
+
+  it('数组形式与条件项', () => {
+    const el = createElement('div')
+    applyClassList(el, ['base', false, null, undefined, 'extra'])
+    expect(el.getAttribute('class')).toBe('base extra')
+  })
+
+  it('反复切换**不会越加越多**，也不会抹掉作者的 class', () => {
+    const el = createElement('div')
+    el.setAttribute('class', 'panel')
+    applyClassList(el, { 'is-open': true })
+    expect(el.getAttribute('class')).toBe('panel is-open')
+    applyClassList(el, { 'is-open': false })
+    expect(el.getAttribute('class')).toBe('panel')
+    applyClassList(el, { 'is-open': true })
+    expect(el.getAttribute('class'), '反复切换后类名叠加了').toBe('panel is-open')
+  })
+
+  it('走真实 props 通道（setStaticProps）也生效 —— 证明接线，不只是算法', () => {
+    const el = createElement('div')
+    setStaticProps(el, { class: 'panel', classList: { 'is-open': true, 'is-busy': false } })
+    expect(el.getAttribute('class')).toBe('panel is-open')
+    // 不该写出一个浏览器不认识的 classlist 属性
+    expect(el.hasAttribute('classlist')).toBe(false)
+  })
+
+  it('走编译器真实产物那条路（bindAttribute）也是响应式的', () => {
+    // 实测编译产物：classList={{...}} → bindAttribute(_el0, "classList", () => ({...}))
+    const open = state(true)
+    const el = createElement('div')
+    el.setAttribute('class', 'panel')
+    bindAttribute(el, 'classList', () => ({ 'is-open': open.value, 'is-busy': !open.value }))
+    settle()
+    expect(el.getAttribute('class')).toBe('panel is-open')
+
+    open.value = false
+    settle()
+    expect(el.getAttribute('class')).toBe('panel is-busy')
+
+    open.value = true
+    settle()
+    expect(el.getAttribute('class'), '反复切换后类名叠加了').toBe('panel is-open')
+  })
+
+  it('空对象 / 空数组清掉自己贡献的类', () => {
+    const el = createElement('div')
+    el.setAttribute('class', 'panel')
+    applyClassList(el, { 'is-open': true })
+    applyClassList(el, {})
+    expect(el.getAttribute('class')).toBe('panel')
+  })
+})

package/src/show.ts

@@ -0,0 +1,107 @@
+import { effect } from '@vobs/reactivity'
+import { isVobsFragment, type VobsNode } from './fragment'
+import { removeAttribute, setAttribute, setProperty } from './ops'
+
+export interface ShowProps {
+  /**
+   * 条件。要响应式就传 getter / 信号读取表达式
+   * （编译器会把动态 props 自动转成 getter，所以 JSX 里写 `when={open.value}` 即可）。
+   */
+  readonly when: unknown
+  /**
+   * 要显示的内容。**必须是单个元素**（`<div>` / `<input>` / 组件返回的元素都行）——
+   * 因为"保留挂载 + 切可见性"必须有一个宿主元素来挂 `hidden`/`inert`，
+   * 而框架**不会替你插包裹层**（包裹层会改变 flex/grid 布局，是更隐蔽的坑）。
+   */
+  readonly children?: VobsNode | (() => VobsNode | null | undefined)
+  /** 隐藏时额外挂上的类名（可选）。默认只用 `hidden` + `inert`。 */
+  readonly hiddenClass?: string
+}
+
+/**
+ * 条件显示，**保留子树挂载状态**（不重建）。
+ *
+ * ## 为什么需要它（外部踩坑文档 C 条，★★）
+ *
+ * `insertDynamic` 按引用比较（`next === current`）：条件表达式一变化就**重建子树**。
+ * 后果是条件分支里的输入控件**每敲一个字符就丢焦点**、滚动位置与内部状态全丢。
+ *
+ * 文档给出的对策是「固定渲染 + 响应式 class 显隐」，但那是**人肉纪律** ——
+ * 每个页面都要记得这么写。`Show` 把它变成一行：
+ *
+ * ```tsx
+ * <Show when={open.value} hiddenClass="is-hidden">
+ *   <input />        {/* 条件怎么变，这个 input 都不会被重建，焦点与状态保持 *\/}
+ * </Show>
+ * ```
+ *
+ * 与 `{cond ? <A/> : <B/>}` 的分工：
+ * - 要**保留状态**（输入框、滚动位置、内部子系统）→ 用 `Show`
+ * - 要**真正卸载**（省内存、必须销毁副作用）→ 用 JSX 条件表达式（编译期生成条件工厂）
+ *
+ * ## 隐藏时同时挂 `inert`
+ *
+ * 只设 `hidden` 在部分场景下元素仍可被 Tab 到（详见 `@vobs/layout` 的同类处理）。
+ * `inert` 把子树移出**焦点顺序与无障碍树**。旧浏览器不支持时 `inert=""` 只是个
+ * 无害的未知属性，`hidden` 仍在兜底。
+ *
+ * ## 边界
+ *
+ * 子节点不是单个元素（文本 / fragment / 多个节点）时**抛出并说明原因** ——
+ * 不静默退化成"卸载"（那会让用户以为状态保住了，实际每变化一次就重建，
+ * 正是 C 条那个 bug 的形态）。需要保留状态就请把内容包在一个元素里。
+ */
+export function Show(props: ShowProps): VobsNode {
+  /*
+   * 用 `unknown` 承接再判空：`props.children` 的声明类型不含 `false`，
+   * 但运行时 `cond && <X/>` 这类写法确实会给出 `false` ——
+   * 直接比较会被 TS 判成"类型不可达"（与 `createComponent` 同一处坑）。
+   */
+  const resolved: unknown = typeof props.children === 'function' ? props.children() : props.children
+  if (resolved === null || resolved === undefined || resolved === false) {
+    throw new Error('Vobs Show: children 不能为空 —— 它需要一个宿主元素来挂 hidden/inert。')
+  }
+  const node = resolved as VobsNode
+  if (isVobsFragment(node) || (node as Element).nodeType !== 1) {
+    throw new Error(
+      'Vobs Show: children 必须是单个元素。'
+      + '「保留挂载 + 切可见性」需要宿主元素，而框架不会替你插包裹层（会改布局）。'
+      + '请把内容包进一个元素，例如 <Show when={…}><div>…</div></Show>；'
+      + '若确实需要卸载语义，请改用 JSX 条件表达式 {cond ? <A/> : <B/>}。'
+    )
+  }
+  const element = node as Element
+
+  effect(() => {
+    const visible = Boolean(readMaybeGetter(props.when))
+    /*
+     * 可见性切换只碰这三个东西：`hidden`、`inert`、可选类名。
+     * 不读任何信号（`when` 的读取在 effect 内、由调用方提供的 getter 完成），
+     * 所以不会自我订阅。
+     */
+    setProperty(element, 'hidden', !visible)
+    if (visible) removeAttribute(element, 'inert')
+    else setAttribute(element, 'inert', '')
+    if (props.hiddenClass !== undefined) applyExtraClass(element, props.hiddenClass, !visible)
+  })
+
+  return element
+}
+
+function readMaybeGetter<T>(value: T | (() => T)): T {
+  return typeof value === 'function' ? (value as () => T)() : value
+}
+
+/** 按需增删一个类名（不影响作者写在 `class` 里的其它类）。 */
+function applyExtraClass(element: Element, className: string, on: boolean): void {
+  const names = element.getAttribute('class')?.split(/\s+/u).filter(Boolean) ?? []
+  if (on) {
+    if (names.includes(className)) return
+    setAttribute(element, 'class', [...names, className].join(' '))
+    return
+  }
+  if (!names.includes(className)) return
+  setAttribute(element, 'class', names.filter(name => name !== className).join(' '))
+}
+
+export { readMaybeGetter }

package/src/spread-stable-shape.test.ts

@@ -0,0 +1,109 @@
+// @vitest-environment jsdom
+import { describe, expect, it } from 'vitest'
+import { createDOMRenderer, setRenderer, state } from '@vobs/vobs'
+import { bindSpreadProps, createElement } from './index'
+
+setRenderer(createDOMRenderer())
+
+const flush = async () => { await Promise.resolve(); await Promise.resolve() }
+
+/*
+ * `bindSpreadProps` 的增量 diff 基准是"上一轮的对象引用"（ops.ts 里 `previous = next`）。
+ *
+ * 那把 `previous` 存成 `next` 的**同一引用**时，下一轮的
+ * `Object.is(previous[key], value)` 读的是同一份值 → **恒等 → 整个 diff 短路**，
+ * 移除循环也因 `key in next` 全跳过。
+ *
+ * 而编译器为 `<div {...props}>` 发射的正是**身份稳定 + getter** 的形状
+ * （`bindSpreadProps(_el0, () => props)`，props 的读取经 getter 反应式求值），
+ * 所以这不是假想用法：真实产物下改了 props，属性/事件/class **完全不上 DOM**。
+ *
+ * `spread.test.ts` 的 5 条用例全部走"每轮赋一个新对象"（`props.value = {...}`），
+ * 恰好绕开了这个形状 —— 101 条 runtime 用例全绿，却没人问"这条路在真实产物里长什么样"。
+ */
+describe('bindSpreadProps 在身份稳定 + getter 的形状下（编译器真实产物形状）', () => {
+  it('同一对象引用、getter 值变化时，attribute 必须更新', async () => {
+    const title = state('a')
+    // 身份稳定：每次都是同一个对象，值经 getter 读取
+    const props = { get title() { return title.value } }
+    const el = createElement('div')
+    bindSpreadProps(el, () => props)
+    await flush()
+
+    // 首次应用
+    expect(el.getAttribute('title')).toBe('a')
+
+    title.value = 'b'
+    // effect 是调度执行（不是同步），所以这里要 flush 一轮
+    await flush()
+    expect(el.getAttribute('title')).toBe('b')
+  })
+
+  it('handler 身份变化时事件必须重绑（且新 handler 生效）', async () => {
+    const calls: string[] = []
+    const first = () => calls.push('first')
+    const second = () => calls.push('second')
+    const handler = state(first)
+    const props = { get onClick() { return handler.value } }
+    const el = createElement('button')
+    bindSpreadProps(el, () => props)
+    await flush()
+
+    el.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    expect(calls).toEqual(['first'])
+
+    handler.value = second
+    await flush()
+    el.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    // 修复前：diff 恒等短路 → 仍是 first，且 second 从未被挂上
+    expect(calls).toEqual(['first', 'second'])
+  })
+
+  it('键从对象里删掉时 attribute 被移除（null 值不移除，那是已钉的契约）', async () => {
+    const present = state(true)
+    /*
+     * 用"键在不在"表达移除，而不是"值变 null"：
+     * `props.test.ts` 把 null/undefined = "不提供值、保持现状"钉成了契约，
+     * 所以这条路径的清除语义是**删键**（下面的移除循环），不是把值设成 null。
+     */
+    const props = new Proxy({} as Record<string, unknown>, {
+      ownKeys: () => (present.value ? ['data-extra'] : []),
+      getOwnPropertyDescriptor: () => ({ enumerable: true, configurable: true, value: '1' }),
+      get: (_t, key) => (key === 'data-extra' ? '1' : undefined)
+    })
+    const el = createElement('div')
+    bindSpreadProps(el, () => props)
+    await flush()
+    expect(el.getAttribute('data-extra')).toBe('1')
+
+    present.value = false
+    await flush()
+    expect(el.hasAttribute('data-extra')).toBe(false)
+  })
+
+  it('身份稳定时布尔 property 的值变化必须跟进', async () => {
+    const flag = state(true)
+    const props = { get disabled() { return flag.value } }
+    const el = createElement('input') as HTMLInputElement
+    bindSpreadProps(el as unknown as Element, () => props)
+    await flush()
+    expect(el.disabled).toBe(true)
+
+    flag.value = false
+    await flush()
+    expect(el.disabled).toBe(false)
+  })
+
+  it('身份稳定时 value property 也必须跟进（受控输入）', async () => {
+    const text = state('v1')
+    const props = { get value() { return text.value } }
+    const el = createElement('input') as HTMLInputElement
+    bindSpreadProps(el as unknown as Element, () => props)
+    await flush()
+    expect(el.value).toBe('v1')
+
+    text.value = 'v2'
+    await flush()
+    expect(el.value).toBe('v2')
+  })
+})

package/src/spread.test.ts

@@ -0,0 +1,86 @@
+// @vitest-environment jsdom
+import { describe, expect, it } from 'vitest'
+import { createDOMRenderer, setRenderer, state } from '@vobs/vobs'
+import { bindSpreadProps, createElement } from './index'
+
+setRenderer(createDOMRenderer())
+
+const flush = async () => { await Promise.resolve(); await Promise.resolve() }
+
+/*
+ * `{...props}` 展开。
+ *
+ * 编译器原来只发射 `spreadProps` —— 创建时应用一次就完了，于是
+ * 「改了 props 不生效」和「对象里删掉的键永远留在 DOM 上」两个问题都不报错。
+ * 现在发射 bindSpreadProps，每轮增量应用。
+ */
+describe('bindSpreadProps', () => {
+  it('对象变了会重新应用（原来只在创建时应用一次）', async () => {
+    const props = state<Record<string, unknown>>({ title: 'a', id: 'x' })
+    const el = createElement('div')
+    bindSpreadProps(el, () => props.value)
+    await flush()
+    expect(el.getAttribute('title')).toBe('a')
+    expect(el.getAttribute('id')).toBe('x')
+
+    props.value = { title: 'b', id: 'x' }
+    await flush()
+    expect(el.getAttribute('title')).toBe('b')
+  })
+
+  it('消失的键会被移除（原来会永远留在 DOM 上）', async () => {
+    const props = state<Record<string, unknown>>({ title: 'a', 'data-extra': '1' })
+    const el = createElement('div')
+    bindSpreadProps(el, () => props.value)
+    await flush()
+    expect(el.hasAttribute('data-extra')).toBe(true)
+
+    props.value = { title: 'a' }
+    await flush()
+    expect(el.hasAttribute('data-extra')).toBe(false)
+    expect(el.getAttribute('title')).toBe('a')
+  })
+
+  it('property 键消失时复位（布尔回 false，其余回空串）', async () => {
+    const props = state<Record<string, unknown>>({ disabled: true, value: 'v' })
+    const el = createElement('input') as HTMLInputElement
+    bindSpreadProps(el as unknown as Element, () => props.value)
+    await flush()
+    expect(el.disabled).toBe(true)
+    expect(el.value).toBe('v')
+
+    props.value = {}
+    await flush()
+    expect(el.disabled).toBe(false)
+    expect(el.value).toBe('')
+  })
+
+  it('事件处理器被替换后旧的不再生效', async () => {
+    const calls: string[] = []
+    const props = state<Record<string, unknown>>({ onClick: () => calls.push('first') })
+    const el = createElement('button')
+    bindSpreadProps(el, () => props.value)
+    await flush()
+
+    el.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    expect(calls).toEqual(['first'])
+
+    props.value = { onClick: () => calls.push('second') }
+    await flush()
+    el.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    expect(calls).toEqual(['first', 'second'])
+  })
+
+  it('事件处理器被移除后不再触发', async () => {
+    const calls: string[] = []
+    const props = state<Record<string, unknown>>({ onClick: () => calls.push('hit') })
+    const el = createElement('button')
+    bindSpreadProps(el, () => props.value)
+    await flush()
+
+    props.value = {}
+    await flush()
+    el.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    expect(calls).toEqual([])
+  })
+})

package/src/svg.test.ts

@@ -1,6 +1,7 @@
 // @vitest-environment jsdom
 import { describe, expect, it } from 'vitest'
-import { createDOMRenderer, setRenderer, createElement, insertBefore } from '@vobs/vobs'
+import { createDOMRenderer, setRenderer, getRenderer, createElement, createSvgElement, insertBefore } from '@vobs/vobs'
+import { SVG_NAMESPACE } from './svg'
 
 // 回归（Labelune 踩坑备忘）：createElement('svg'/'rect') 此前走 HTML namespace，
 // 产物是 HTMLUnknownElement——整棵 SVG 子树静默不渲染且无报错。
@@ -55,5 +56,31 @@ describe('svg namespace element creation', () => {
     const rect = createElement('rect')
     // 旧自定义渲染器兜底：按 HTML 创建（保持原行为，不抛错）
     expect(rect.namespaceURI).not.toBe('http://www.w3.org/2000/svg')
+
+    // 还原：全局渲染器是共享状态，换了不还原会让后面的用例在 stub 上跑（曾经真的踩到）
+    setRenderer(createDOMRenderer())
   })
 })
+
+/*
+ * SVG 命名空间继承：a / title / style / script 与 HTML 同名，光看名字会建出 HTML 元素。
+ * 编译器在 <svg> 子树里显式改走 createSvgElement（见 compiler 的同名测试）。
+ */
+describe('createSvgElement 强制 SVG 命名空间', () => {
+  it('与 HTML 同名的标签也建在 SVG 命名空间里', () => {
+    const r = getRenderer()
+    console.log('DEBUG op =', createSvgElement('a').namespaceURI)
+    console.log('DEBUG renderer.createSvgElement =', typeof r.createSvgElement, '→', r.createSvgElement?.('a').namespaceURI)
+    console.log('DEBUG createElement(svg) =', createElement('svg').namespaceURI)
+    const anchor = createSvgElement('a')
+    expect(anchor.namespaceURI).toBe(SVG_NAMESPACE)
+    expect(anchor.constructor.name).not.toBe('HTMLAnchorElement')
+
+    // 对照：同样名字走 createElement 就是 HTML 元素
+    expect(createElement('a').namespaceURI).not.toBe(SVG_NAMESPACE)
+  })
+
+  it('title 同样', () => {
+    expect(createSvgElement('title').namespaceURI).toBe(SVG_NAMESPACE)
+  })
+})

package/src/svg.ts

@@ -0,0 +1,34 @@
+/**
+ * SVG 标签与命名空间 —— 编译期判定提升、运行期决定怎么建节点的**同一份依据**。
+ *
+ * 两处都需要知道「这个名字是不是 SVG 标签」：
+ * - 运行期：`document.createElement('rect')` 得到的是 HTMLUnknownElement，
+ *   整棵 SVG 子树都不渲染（且没有报错），所以必须走 createElementNS
+ * - 编译期：静态子树被提升成 HTML 模板串再 cloneNode，而模板串是**用 HTML 解析器**
+ *   解析的 —— `<g>`、`<rect>` 同样变成 HTMLUnknownElement。这条路径漏了整整一个大版本
+ *   （1.7.4 只修了 createElement 那条入口，svg.test.ts 也只测那条）。
+ */
+export const SVG_NAMESPACE = 'http://www.w3.org/2000/svg'
+
+/**
+ * SVG 标签全集（= TypeScript SVGElementTagNameMap 的键，运行时分发依据）。
+ * 与 React 的运行时清单同思路：只含纯 SVG 标签，刻意排除与 HTML 同名的
+ * a/script/style/title（它们在 JSX 类型里归 HTMLElement，按 HTML 创建）。
+ */
+export const SVG_TAGS: ReadonlySet<string> = new Set([
+  'animate', 'animateMotion', 'animateTransform', 'circle', 'clipPath', 'defs', 'desc',
+  'ellipse', 'feBlend', 'feColorMatrix', 'feComponentTransfer', 'feComposite',
+  'feConvolveMatrix', 'feDiffuseLighting', 'feDisplacementMap', 'feDistantLight',
+  'feDropShadow', 'feFlood', 'feFuncA', 'feFuncB', 'feFuncG', 'feFuncR',
+  'feGaussianBlur', 'feImage', 'feMerge', 'feMergeNode', 'feMorphology', 'feOffset',
+  'fePointLight', 'feSpecularLighting', 'feSpotLight', 'feTile', 'feTurbulence',
+  'filter', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'marker', 'mask',
+  'metadata', 'mpath', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient',
+  'rect', 'set', 'stop', 'svg', 'switch', 'symbol', 'text', 'textPath', 'tspan',
+  'use', 'view'
+])
+
+/** 是否是 SVG 专属标签（按名字判定，不看父级）。 */
+export function isSvgTag(tag: string): boolean {
+  return SVG_TAGS.has(tag)
+}