hyper-html-api 0.9.1 → 0.10.1

package/src/lib/content-dom.js

@@ -1,18 +1,17 @@
 // GENERATED from clayjs/src/lib/content-dom.js. Edit ClayJS and run `npm run propagate:foundation`.
 
-import { capabilitySelector, hasCapability } from './region-capabilities.js'
+import { capabilitySelector, hasCapability, CAPABILITIES, expandsTo, hasPolicyToken } 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 ('value' in source && 'value' in copy && source.tagName !== 'OPTION' && type !== 'checkbox' && type !== 'radio' && type !== 'file') copy.value = source.value
+  if (source.tagName === 'INPUT' && (type === 'checkbox' || type === 'radio')) copy.checked = source.checked
+  // Each surviving option carries its own selection, so a <select> whose excluded
+  // options were removed from the copy keeps the rest in step with the page.
+  if (source.tagName === 'OPTION') copy.selected = source.selected
   if ('indeterminate' in source && 'indeterminate' in copy) copy.indeterminate = source.indeterminate
 }
 
@@ -27,46 +26,77 @@ function matchesWithin(node, selector, boundary, inherit) {
   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 && (inherit && source !== boundary ? source.matches(exclude) : matchesWithin(source, exclude, boundary, inherit)))
-  )) return null
-  const copy = targetDocument.importNode(source, false)
+// One native deep clone, then a lockstep walk of the two isomorphic trees that
+// records provenance, collects controls, and marks excluded subtrees for removal.
+// The browser's clone is far cheaper than importing node by node. The root answers
+// for its ancestors once; below it the walk is top-down, so with inheritance each
+// element answers only for its own markers: an excluded ancestor is never entered.
+function excluded(source, capability, capabilityMatch, exclude, boundary, inherit) {
+  return (inherit
+    ? hasCapability(source, capability)
+    : matchesWithin(source, capabilityMatch, boundary, false)) ||
+    !!(exclude && (inherit && source !== boundary ? source.matches(exclude) : matchesWithin(source, exclude, boundary, inherit)))
+}
+
+// The test closestWithCapability makes at each level, for this element alone.
+function hasOwnCapability(element, capability) {
+  const definition = CAPABILITIES[capability]
+  return definition.tokens.some(token => expandsTo(element, token)) ||
+    definition.bundles.some(bundle => hasPolicyToken(element, bundle))
+}
+
+const CONTROL_TAGS = new Set(['INPUT', 'TEXTAREA', 'SELECT', 'OPTION'])
+
+function pairTree(source, copy, maps, drop) {
+  if (source.nodeType === 1 && drop(source)) { maps.dropped.push(copy); return }
   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)
+  let sourceChildren = source
+  let copyChildren = copy
+  if (source.nodeType === 1) {
+    if (CONTROL_TAGS.has(source.tagName)) maps.controls.push(source, copy)
+    if (source.tagName === 'TEMPLATE') {
+      // The deep clone also copied the template's own child nodes, which are not its
+      // content and were never part of the view.
+      while (copy.firstChild) copy.removeChild(copy.firstChild)
+      sourceChildren = source.content
+      copyChildren = copy.content
+      maps.cloneToLive.set(copyChildren, sourceChildren)
+      maps.liveToClone.set(sourceChildren, copyChildren)
     }
+  } else if (source.nodeType !== 11) return
+  let c = copyChildren.firstChild
+  for (let s = sourceChildren.firstChild; s && c; s = s.nextSibling) {
+    pairTree(s, c, maps, drop)
+    c = c.nextSibling
   }
-  if (source.nodeType === 1) copyControlState(source, copy)
-  return copy
 }
 
-export function createContentView(context, { capability = 'data', exclude = null, inherit = true } = {}) {
+export function createContentView(context, { capability = 'data', exclude = null, inherit = true, provenance = null } = {}) {
   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 cloneToLive = provenance || 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 })
+  const drop = inherit
+    ? (el) => hasOwnCapability(el, capability) || !!(exclude && el.matches(exclude))
+    : (el) => excluded(el, capability, capabilityMatch, exclude, sourceRoot, false)
+  let root = null
+  if (sourceRoot.nodeType !== 1 || !excluded(sourceRoot, capability, capabilityMatch, exclude, sourceRoot, inherit)) {
+    root = inertDocument.importNode(sourceRoot, true)
+    const maps = { cloneToLive, liveToClone, dropped: [], controls: [] }
+    pairTree(sourceRoot, root, maps, drop)
+    for (const node of maps.dropped) node.remove()
+    // Control state is copied once the copy holds only what the view keeps, so a
+    // <select> sees exactly the options the old node-by-node import gave it.
+    for (let i = 0; i < maps.controls.length; i += 2) copyControlState(maps.controls[i], maps.controls[i + 1])
+  }
   if (context.nodeType === 9 && root) {
     inertDocument.replaceChild(root, inertDocument.documentElement)
     liveToClone.set(context, inertDocument)

package/src/lib/region-capabilities.js

@@ -23,6 +23,7 @@ export const POLICY_TOKENS = Object.freeze([
   'no-data',
   'freeze',
   'editor-ui',
+  'live',
 ])
 
 export function hasPolicyToken(element, token) {

package/src/write.js

@@ -4,19 +4,29 @@ 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'
+import { NoRulesTag, RulesParseError, 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' } = {}) {
+// Applies a JSON body to a document's source through caller-provided rules
+// (options.rules) or 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, RulesParseError, WriteRejected, WriteRefused, ShapeMismatch
+// or EmptyListInsert, always before producing any output.
+export function writeDocument(load, src, data, options = {}) {
+  const { token = 'api' } = options
   const $ = load(src, { sourceCodeLocationInfo: true })
   const root = $.root()
-  const found = findRulesIn(cheerioAdapter, root, token)
-  if (!found) throw new NoRulesTag(token)
-  const { rules } = found
+  let rules
+  if (Object.prototype.hasOwnProperty.call(options, 'rules')) {
+    rules = options.rules
+    if (rules === null || !['string', 'object'].includes(typeof rules)) {
+      throw new RulesParseError('Invalid extraction rules: expected a selector, array, or object.')
+    }
+  } else {
+    const found = findRulesIn(cheerioAdapter, root, token)
+    if (!found) throw new NoRulesTag(token)
+    rules = found.rules
+  }
   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)