hyper-html-api 0.8.0 → 0.9.0

package/src/engine/errors.js

@@ -49,3 +49,28 @@ export class RuleTargetReadOnly extends Error {
     this.target = name
   }
 }
+
+export class WriteRefused extends Error {
+  constructor(refusals) {
+    super(`write refused: ${refusals.length} write(s) broke the content-only policy`)
+    this.name = 'WriteRefused'
+    this.refusals = refusals
+  }
+}
+
+export class NoRulesTag extends Error {
+  constructor(token) {
+    super(`no <script data-rules-name~="${token}"> rules tag in this document`)
+    this.name = 'NoRulesTag'
+    this.token = token
+  }
+}
+
+export class WriteRejected extends Error {
+  constructor(unknownKeys, unmatched) {
+    super(`write rejected: ${unknownKeys.length} unknown key(s), ${unmatched.length} rule(s) with no matching element`)
+    this.name = 'WriteRejected'
+    this.unknownKeys = unknownKeys
+    this.unmatched = unmatched
+  }
+}

package/src/engine/extract.js

@@ -3,6 +3,9 @@ import { MaxRuleDepthExceeded, MAX_RULE_DEPTH } from './errors.js'
 import { ruleAttrIndex } from './rule-syntax.js'
 
 export function extract(adapter, root, rules, opts = {}) {
+  if (Object.prototype.hasOwnProperty.call(opts, 'exclude') && adapter.semanticExclude === false) {
+    throw new Error('This adapter does not support semantic exclude queries; omit exclude or use the DOM adapter.')
+  }
   return extractAt(adapter, root, rules, { depth: 0, path: [] }, opts)
 }
 

package/src/engine/index.js

@@ -8,7 +8,10 @@ export { findRulesIn } from './rules-tag.js'
 export { parseStrict, parseRelaxed } from './rules.js'
 export { ruleAttrIndex, splitRule } from './rule-syntax.js'
 export * as errors from './errors.js'
-export { DOM_PROPERTIES, DOM_PROPERTIES_SET } from './dom-properties.js'
+export { DOM_PROPERTIES, DOM_PROPERTIES_SET, DOM_PROPERTIES_READ_ONLY_SET } from './dom-properties.js'
+export { WRITE_POLICY, guardAdapter, checkAttribute, urlScheme } from './write-policy.js'
+export { planWrite } from './write-plan.js'
+export { trackAdapter, spliceDocument } from './splice.js'
 
 // source: object literal → use as-is (no tag); string → look up by token.
 // For an element root, search the whole document (root.ownerDocument) so a

package/src/engine/splice.js

@@ -0,0 +1,118 @@
+function raw(node) {
+  return node && node[0] ? node[0] : node
+}
+
+// Records which nodes a write touched. Structural changes mark the parent,
+// since the parent's children are what changed. Clones are recorded so their
+// copied source locations are never trusted.
+export function trackAdapter(adapter) {
+  const dirty = new Set()
+  const cloned = new WeakSet()
+  const mark = (node) => {
+    const r = raw(node)
+    if (r) dirty.add(r)
+  }
+  const markTree = (r) => {
+    if (!r) return
+    cloned.add(r)
+    for (const c of r.children || []) markTree(c)
+  }
+  return {
+    ...adapter,
+    text(node, value) {
+      if (value === undefined) return adapter.text(node)
+      mark(node)
+      return adapter.text(node, value)
+    },
+    attr(node, name, value) {
+      if (value === undefined) return adapter.attr(node, name)
+      mark(node)
+      return adapter.attr(node, name, value)
+    },
+    removeAttr(node, name) {
+      mark(node)
+      return adapter.removeAttr(node, name)
+    },
+    prop(node, name, value) {
+      if (value === undefined) return adapter.prop(node, name)
+      mark(node)
+      return adapter.prop(node, name, value)
+    },
+    replaceWith(node, html) {
+      const p = adapter.parent(node)
+      if (p) mark(p)
+      return adapter.replaceWith(node, html)
+    },
+    clone(node) {
+      const c = adapter.clone(node)
+      markTree(raw(c))
+      return c
+    },
+    insertAt(parent, node, index) {
+      mark(parent)
+      const from = adapter.parent(node)
+      if (from) mark(from)
+      return adapter.insertAt(parent, node, index)
+    },
+    remove(node) {
+      const p = adapter.parent(node)
+      if (p) mark(p)
+      return adapter.remove(node)
+    },
+    dirty,
+    cloned,
+  }
+}
+
+function attached(r, docRoot) {
+  let n = r
+  while (n && n.parent) n = n.parent
+  return n === docRoot
+}
+
+function located(r, cloned) {
+  let n = r
+  while (n && n.type !== 'root') {
+    const loc = n.sourceCodeLocation
+    if (!cloned.has(n) && loc && loc.startOffset != null && loc.endOffset != null) return n
+    n = n.parent
+  }
+  return null
+}
+
+function hasAncestorIn(r, set) {
+  let n = r.parent
+  while (n) {
+    if (set.has(n)) return true
+    n = n.parent
+  }
+  return false
+}
+
+// Replaces the source span of each topmost changed element with its fresh
+// serialization, then proves the result by reparsing: the spliced text must
+// render exactly like the mutated tree. Anything unprovable falls back to the
+// whole-document render.
+export function spliceDocument(load, src, $, tracker) {
+  const full = $.html()
+  const fallback = { html: full, spliced: false }
+  const docRoot = raw($.root())
+  const targets = new Set()
+  for (const r of tracker.dirty) {
+    if (!attached(r, docRoot)) continue
+    const at = located(r, tracker.cloned)
+    if (!at) return fallback
+    targets.add(at)
+  }
+  const top = [...targets].filter((r) => !hasAncestorIn(r, targets))
+  top.sort((a, b) => b.sourceCodeLocation.startOffset - a.sourceCodeLocation.startOffset)
+  let out = src
+  let prevStart = Infinity
+  for (const r of top) {
+    const { startOffset, endOffset } = r.sourceCodeLocation
+    if (endOffset > prevStart) return fallback
+    out = out.slice(0, startOffset) + $.html(r) + out.slice(endOffset)
+    prevStart = startOffset
+  }
+  return load(out).html() === full ? { html: out, spliced: true } : fallback
+}

package/src/engine/write-plan.js

@@ -0,0 +1,52 @@
+import { ruleAttrIndex } from './rule-syntax.js'
+
+function isPlainObject(v) {
+  return v !== null && typeof v === 'object' && !Array.isArray(v)
+}
+
+function label(path) {
+  return path.reduce((out, part) => (typeof part === 'number' ? `${out}[${part}]` : out ? `${out}.${part}` : part), '')
+}
+
+// Walks rules against data without touching the document. Reports data keys
+// the rules do not define, and scalar rules whose selector matches nothing.
+// Shape problems are left to apply(), which already reports them. Inside list
+// items only unknown keys are checked, because new rows do not exist yet.
+export function planWrite(adapter, root, rules, data, opts = {}) {
+  const unknownKeys = []
+  const unmatched = []
+
+  function checkKeys(rule, value, path) {
+    if (Array.isArray(rule)) {
+      const [, shape] = rule
+      if (!Array.isArray(value) || !isPlainObject(shape)) return
+      value.forEach((item, i) => checkKeys(shape, item, [...path, i]))
+      return
+    }
+    if (!isPlainObject(rule) || !isPlainObject(value)) return
+    for (const key of Object.keys(value)) {
+      if (!Object.prototype.hasOwnProperty.call(rule, key)) unknownKeys.push(label([...path, key]))
+      else checkKeys(rule[key], value[key], [...path, key])
+    }
+  }
+
+  function checkTargets(ctx, rule, value, path) {
+    if (value === undefined) return
+    if (typeof rule === 'string') {
+      if (rule.endsWith('[]') || rule === '.' || rule.startsWith('@')) return
+      const at = ruleAttrIndex(rule)
+      const selector = at === -1 ? rule : rule.slice(0, at)
+      if (!selector) return
+      if (adapter.find(ctx, selector, opts).length === 0) unmatched.push({ path: label(path), selector })
+      return
+    }
+    if (Array.isArray(rule)) return
+    if (isPlainObject(rule) && isPlainObject(value)) {
+      for (const [key, sub] of Object.entries(rule)) checkTargets(ctx, sub, value[key], [...path, key])
+    }
+  }
+
+  checkKeys(rules, data, [])
+  checkTargets(root, rules, data, [])
+  return { unknownKeys, unmatched }
+}

package/src/engine/write-policy.js

@@ -0,0 +1,136 @@
+import { POLICY_TOKENS } from '../lib/region-capabilities.js'
+import { WriteRefused } from './errors.js'
+
+export const WRITE_POLICY = Object.freeze({
+  refusedRuleForms: ['innerHTML', 'outerHTML'],
+  refusedTargets: ['script', 'style', 'template', 'noscript', 'iframe', 'object', 'embed', 'xmp', 'plaintext', 'noembed', 'noframes', 'meta', 'link', 'base', 'animate', 'set', 'animatemotion', 'animatetransform'],
+  refusedAttributes: [
+    'style', 'srcdoc', 'is', 'http-equiv', 'sandbox', 'allow', 'nonce', 'integrity', 'charset',
+    'htmlclaytoken', 'htmlclayid', 'data-rules-name', 'data-rules-version', 'clay', 'contenteditable',
+    ...POLICY_TOKENS,
+  ],
+  refusedAttributePrefixes: ['on'],
+  urlAttributes: ['href', 'src', 'srcset', 'action', 'formaction', 'poster', 'cite', 'data', 'ping', 'background', 'longdesc', 'usemap', 'xlink:href', 'manifest', 'codebase', 'icon'],
+  refusedSchemes: ['javascript', 'vbscript', 'data'],
+})
+
+const TEXT_PROPS = new Set(['textContent', 'innerText'])
+
+export function urlScheme(value) {
+  const cleaned = String(value).replace(/^[\u0000- ]+|[\u0000- ]+$/g, '').replace(/[\t\n\r]/g, '')
+  const m = cleaned.match(/^([a-zA-Z][a-zA-Z0-9+.-]*):/)
+  return m ? m[1].toLowerCase() : null
+}
+
+const VALID_ATTR_NAME = /^[^\t\n\f\r "'>/=\u0000-\u001f\u007f]+$/
+
+export function checkAttribute(name, value, policy = WRITE_POLICY) {
+  if (!VALID_ATTR_NAME.test(String(name))) return `attribute name ${JSON.stringify(String(name))} is not valid`
+  const lower = String(name).toLowerCase()
+  if (policy.refusedAttributePrefixes.some((p) => lower.startsWith(p))) return `attribute "${lower}" can run script`
+  if (policy.refusedAttributes.includes(lower)) return `attribute "${lower}" is not content`
+  if (policy.urlAttributes.includes(lower) && value != null) {
+    const urls = lower === 'srcset'
+      ? String(value).split(',').map((c) => c.trim().split(/\s+/)[0]).filter(Boolean)
+      : [String(value)]
+    for (const url of urls) {
+      const scheme = urlScheme(url)
+      if (scheme && policy.refusedSchemes.includes(scheme)) return `"${scheme}:" URLs are not allowed in "${lower}"`
+    }
+  }
+  return null
+}
+
+function tagOf(adapter, node) {
+  const t = adapter.prop(node, 'tagName')
+  return t ? String(t).toLowerCase() : ''
+}
+
+function describe(adapter, node) {
+  const tag = tagOf(adapter, node) || 'node'
+  const id = adapter.attr(node, 'id')
+  return id ? `<${tag}#${id}>` : `<${tag}>`
+}
+
+function refusedAncestor(adapter, node, policy) {
+  let cur = node
+  while (cur) {
+    const tag = tagOf(adapter, cur)
+    if (tag && policy.refusedTargets.includes(tag)) return tag
+    cur = adapter.parent(cur)
+  }
+  return null
+}
+
+function holdsRulesTag(adapter, node) {
+  return adapter.find(node, 'script[data-rules-name]', { includeRulesTag: true, templateAttr: null }).length > 0
+}
+
+function isOrHoldsRulesTag(adapter, node) {
+  if (tagOf(adapter, node) === 'script' && adapter.attr(node, 'data-rules-name') != null) return true
+  return holdsRulesTag(adapter, node)
+}
+
+// Wraps an adapter so every write is checked against the policy first. A write
+// that breaks it is skipped and recorded; call assertClean() after apply() to
+// throw one WriteRefused listing every violation.
+export function guardAdapter(adapter, policy = WRITE_POLICY) {
+  const refusals = []
+  const refuse = (node, reason) => {
+    refusals.push({ target: describe(adapter, node), reason })
+    return false
+  }
+  const allowTarget = (node) => {
+    const bad = refusedAncestor(adapter, node, policy)
+    return bad ? refuse(node, `inside <${bad}>, which is not content`) : true
+  }
+  const allowText = (node) => {
+    if (!allowTarget(node)) return false
+    if (holdsRulesTag(adapter, node)) return refuse(node, 'a text write here would delete the data rules tag')
+    return true
+  }
+  const allowAttr = (node, name, value) => {
+    if (!allowTarget(node)) return false
+    const reason = checkAttribute(name, value, policy)
+    return reason ? refuse(node, reason) : true
+  }
+
+  const guarded = {
+    ...adapter,
+    text(node, value) {
+      if (value === undefined) return adapter.text(node)
+      if (allowText(node)) adapter.text(node, value)
+    },
+    attr(node, name, value) {
+      if (value === undefined) return adapter.attr(node, name)
+      if (allowAttr(node, name, value)) adapter.attr(node, name, value)
+    },
+    prop(node, name, value) {
+      if (value === undefined) return adapter.prop(node, name)
+      if (policy.refusedRuleForms.includes(name)) return refuse(node, `"@${name}" writes HTML, only text is allowed`)
+      if (TEXT_PROPS.has(name)) {
+        if (allowText(node)) adapter.prop(node, name, value)
+        return
+      }
+      const attrName = name === 'className' ? 'class' : name
+      if (allowAttr(node, attrName, value)) adapter.prop(node, name, value)
+    },
+    remove(node) {
+      if (isOrHoldsRulesTag(adapter, node)) {
+        refuse(node, 'removing this would delete the data rules tag')
+        return
+      }
+      adapter.remove(node)
+    },
+    replaceWith(node, html) {
+      if (html === adapter.prop(node, 'outerHTML')) return node
+      refuse(node, '"@outerHTML" writes HTML, only text is allowed')
+      return node
+    },
+    refusals,
+    assertClean() {
+      if (refusals.length) throw new WriteRefused(refusals.slice())
+    },
+  }
+  return guarded
+}

package/src/lib/content-dom.js

@@ -0,0 +1,110 @@
+// GENERATED from clayjs/src/lib/content-dom.js. Edit ClayJS and run `npm run propagate:foundation`.
+
+import { capabilitySelector, hasCapability } from './region-capabilities.js'
+
+const UNSUPPORTED_SELECTOR = /:(?:focus(?:-within|-visible)?|hover|active|visited|defined)\b/i
+
+function copyControlState(source, copy) {
+  if (!/^(INPUT|TEXTAREA|SELECT|OPTION)$/.test(source.tagName || '')) return
+  const type = (source.getAttribute?.('type') || '').toLowerCase()
+  if ('value' in source && 'value' in copy && source.tagName !== 'OPTION' && type !== 'checkbox' && type !== 'radio') copy.value = source.value
+  if ('checked' in source && 'checked' in copy) copy.checked = source.checked
+  if ('selected' in source && 'selected' in copy) copy.selected = source.selected
+  if (source.tagName === 'SELECT') {
+    for (let i = 0; i < source.options.length; i++) copy.options[i].selected = source.options[i].selected
+  }
+  if ('indeterminate' in source && 'indeterminate' in copy) copy.indeterminate = source.indeterminate
+}
+
+function matchesWithin(node, selector, boundary, inherit) {
+  if (inherit) return !!node.closest?.(selector)
+  let current = node
+  while (current?.nodeType === 1) {
+    if (current.matches(selector)) return true
+    if (current === boundary) break
+    current = current.parentElement
+  }
+  return false
+}
+
+function importTree(source, targetDocument, capability, capabilityMatch, exclude, boundary, inherit, maps) {
+  if (source.nodeType === 1 && (
+    (inherit ? hasCapability(source, capability) : matchesWithin(source, capabilityMatch, boundary, false)) ||
+    (exclude && matchesWithin(source, exclude, boundary, inherit))
+  )) return null
+  const copy = targetDocument.importNode(source, false)
+  maps.cloneToLive.set(copy, source)
+  maps.liveToClone.set(source, copy)
+  const sourceChildren = source.nodeType === 1 && source.tagName === 'TEMPLATE' ? source.content : source
+  const copyChildren = copy.nodeType === 1 && copy.tagName === 'TEMPLATE' ? copy.content : copy
+  if (sourceChildren !== source) {
+    maps.cloneToLive.set(copyChildren, sourceChildren)
+    maps.liveToClone.set(sourceChildren, copyChildren)
+  }
+  for (const child of sourceChildren.childNodes || []) {
+    const childCopy = importTree(child, targetDocument, capability, capabilityMatch, exclude, boundary, inherit, maps)
+    if (childCopy) {
+      copyChildren.appendChild(childCopy)
+      if (child.nodeType === 1) copyControlState(child, childCopy)
+    }
+  }
+  if (source.nodeType === 1) copyControlState(source, copy)
+  return copy
+}
+
+export function createContentView(context, { capability = 'data', exclude = null, inherit = true } = {}) {
+  if (!context) throw new TypeError('createContentView requires a DOM context')
+  const sourceDocument = context.nodeType === 9 ? context : context.ownerDocument
+  if (!sourceDocument?.implementation?.createHTMLDocument) {
+    throw new TypeError('createContentView requires an HTML DOM implementation')
+  }
+  const inertDocument = sourceDocument.implementation.createHTMLDocument('')
+  const cloneToLive = new WeakMap()
+  const liveToClone = new WeakMap()
+  const sourceRoot = context.nodeType === 9 ? context.documentElement : context
+  if (exclude) inertDocument.documentElement.matches(exclude)
+  const capabilityMatch = capabilitySelector(capability)
+  const root = importTree(sourceRoot, inertDocument, capability, capabilityMatch, exclude, sourceRoot, inherit, { cloneToLive, liveToClone })
+  if (context.nodeType === 9 && root) {
+    inertDocument.replaceChild(root, inertDocument.documentElement)
+    liveToClone.set(context, inertDocument)
+    cloneToLive.set(inertDocument, context)
+  }
+
+  const assertSelector = selector => {
+    if (UNSUPPORTED_SELECTOR.test(selector)) {
+      throw new Error(`Filtered content queries do not support stateful selector: ${selector}`)
+    }
+  }
+
+  return {
+    root,
+    document: inertDocument,
+    capability,
+    selector: capabilitySelector(capability),
+    cloneToLive,
+    liveToClone,
+    original(node) { return cloneToLive.get(node) || null },
+    cloneOf(node) { return liveToClone.get(node) || null },
+    query(selector, queryRoot = root) {
+      assertSelector(selector)
+      return Array.from(queryRoot.querySelectorAll(selector), node => cloneToLive.get(node) || node)
+    },
+    text(node = root) {
+      const projected = node === root ? root : liveToClone.get(node)
+      return projected?.textContent || ''
+    },
+    html(node = root) {
+      const projected = node === root ? root : liveToClone.get(node)
+      return projected?.innerHTML ?? ''
+    },
+    clone(node = root) {
+      const projected = node === root ? root : liveToClone.get(node)
+      return projected ? inertDocument.importNode(projected, true) : null
+    },
+  }
+}
+
+export function cleanContentClone(node, options) {
+  return createContentView(node, options).root
+}

package/src/lib/region-capabilities.js

@@ -0,0 +1,71 @@
+// GENERATED from clayjs/src/lib/region-capabilities.js. Edit ClayJS and run `npm run propagate:foundation`.
+
+export const CAPABILITIES = Object.freeze({
+  data: Object.freeze({ tokens: ['no-data'], bundles: ['editor-ui'] }),
+  save: Object.freeze({ tokens: ['no-save'], bundles: ['editor-ui'] }),
+  snapshot: Object.freeze({ tokens: ['no-snapshot'], bundles: ['editor-ui'] }),
+  watch: Object.freeze({ tokens: ['no-watch'], bundles: ['editor-ui'] }),
+  undo: Object.freeze({ tokens: ['no-undo'], bundles: ['editor-ui'] }),
+  history: Object.freeze({ tokens: [], bundles: ['editor-ui'] }),
+})
+
+export const BUNDLES = Object.freeze({
+  'editor-ui': Object.freeze(['no-data', 'no-save', 'no-snapshot', 'no-watch', 'no-undo']),
+})
+
+export const POLICY_TOKENS = Object.freeze([
+  'no-save',
+  'no-snapshot',
+  'no-trigger-autosave',
+  'no-dirty',
+  'no-watch',
+  'no-undo',
+  'no-data',
+  'freeze',
+  'editor-ui',
+])
+
+export function hasPolicyToken(element, token) {
+  if (!element || element.nodeType !== 1) return false
+  const clay = element.getAttribute?.('clay')
+  return !!(
+    (clay && clay.split(/\s+/).includes(token)) ||
+    element.hasAttribute?.(token)
+  )
+}
+
+export function expandsTo(element, token) {
+  if (hasPolicyToken(element, token)) return true
+  for (const [bundle, members] of Object.entries(BUNDLES)) {
+    if (members.includes(token) && hasPolicyToken(element, bundle)) return true
+  }
+  return false
+}
+
+export function capabilitySelector(capability) {
+  const definition = CAPABILITIES[capability]
+  if (!definition) throw new Error(`Unknown region capability: ${capability}`)
+  return [...definition.tokens, ...definition.bundles]
+    .flatMap(token => [`[clay~="${token}"]`, `[${token}]`])
+    .join(', ')
+}
+
+export function closestWithCapability(node, capability) {
+  let element = node && node.nodeType === 1 ? node : node?.parentElement
+  while (element && element.nodeType === 1) {
+    const definition = CAPABILITIES[capability]
+    if (!definition) throw new Error(`Unknown region capability: ${capability}`)
+    if (definition.tokens.some(token => expandsTo(element, token)) ||
+        definition.bundles.some(bundle => hasPolicyToken(element, bundle))) return element
+    element = element.parentElement
+  }
+  return null
+}
+
+export function hasCapability(node, capability) {
+  return !!closestWithCapability(node, capability)
+}
+
+export function isPolicyAttribute(name) {
+  return name === 'clay' || POLICY_TOKENS.includes(name)
+}

package/src/write.js

@@ -0,0 +1,29 @@
+import cheerioAdapter from './adapters/cheerio.js'
+import { apply } from './engine/apply.js'
+import { findRulesIn } from './engine/rules-tag.js'
+import { guardAdapter } from './engine/write-policy.js'
+import { planWrite } from './engine/write-plan.js'
+import { trackAdapter, spliceDocument } from './engine/splice.js'
+import { NoRulesTag, WriteRejected } from './engine/errors.js'
+
+// Applies a JSON body to a document's source through the document's own rules
+// tag, under the content-only policy. `load` is cheerio.load, passed in so this
+// package keeps cheerio out of its browser bundles. Returns the new source and
+// whether anything changed. Throws NoRulesTag, WriteRejected, WriteRefused,
+// ShapeMismatch or EmptyListInsert, always before producing any output.
+export function writeDocument(load, src, data, { token = 'api' } = {}) {
+  const $ = load(src, { sourceCodeLocationInfo: true })
+  const root = $.root()
+  const found = findRulesIn(cheerioAdapter, root, token)
+  if (!found) throw new NoRulesTag(token)
+  const { rules } = found
+  const plan = planWrite(cheerioAdapter, root, rules, data)
+  if (plan.unknownKeys.length || plan.unmatched.length) throw new WriteRejected(plan.unknownKeys, plan.unmatched)
+  const tracker = trackAdapter(cheerioAdapter)
+  const guarded = guardAdapter(tracker)
+  apply(guarded, root, rules, data, { templateAttr: 'cms-template' })
+  guarded.assertClean()
+  if (tracker.dirty.size === 0) return { html: src, changed: false, spliced: true }
+  const { html, spliced } = spliceDocument(load, src, $, tracker)
+  return { html, changed: html !== src, spliced }
+}

package/conformance/cases/props-type-is-node-type.expected.json

@@ -1,5 +0,0 @@
-{
-  "input": "tag",
-  "script": "script",
-  "style": "style"
-}

package/conformance/cases/props-type-is-node-type.meta

@@ -1,11 +0,0 @@
-tier: 3
-face: query
-expect: ok
-skip: htmlclay=ships @type fixed; fixed behavior asserted in htmlclay dataapi/props_test.go
-note: @type is NOT the type attribute. `type` is on the DOM property whitelist, and domhandler
-note: nodes already carry a `type` field naming the node kind, so cheerio's prop() returns that
-note: instead: "tag" for a normal element, "script" for a script, "style" for a style. Three
-note: values, none of them the author's type="text".
-note: DIVERGENCE, direction JS-only. This case pins the WART so an upstream fix gets noticed.
-note: htmlclay deliberately does not reproduce it and returns the type attribute, because that API
-note: has no existing htmlclay users and preserving the bug would buy nothing.