epub:type="footnote" aside not recognized as footnote with Blob URL documents (renderAllPages: false)

[hirookagikko]

Summary

When loading EPUB spine documents as Blob URLs via loadDocument() with renderAllPages: false, <aside epub:type="footnote"> elements are not processed as CSS footnotes. They remain in the document flow with extremely narrow block-size (~17px in vertical-rl), causing text to overlap and become unreadable.

Environment

• @vivliostyle/core: 2.40.0
• @vivliostyle/viewer: 2.40.0
• Browser: Chrome (macOS)

Steps to Reproduce

1. Parse an EPUB containing <aside epub:type="footnote"> elements
2. Create Blob URLs for spine XHTML documents: new Blob([html], { type: 'application/xhtml+xml' })
3. Load via coreViewer.loadDocument(docOptions, { userStyleSheet }, { renderAllPages: false })
4. Navigate to the page containing footnotes

Expected Behavior

• aside[epub|type="footnote"] matched by the default UA stylesheet, applying display: none
• Footnote content rendered in the page footnote area via float: footnote
• Noteref anchor gets -adapt-template: footnote

Actual Behavior

• <aside> elements remain display: block; float: none in the document flow
• In vertical-rl mode, the aside gets a block-size of ~17px (remaining page space), causing text to be crushed and unreadable

Root Cause Analysis

Investigated the :href-epub-type pseudo-class implementation in Hd.apply():

apply(e) {
  let n = e.currentElement;
  if (n instanceof HTMLAnchorElement && n.hash
      && n.href == n.baseURI.replace(/#.*$/, "") + n.hash) {
    let s = n.hash.substring(1);
    let i = n.ownerDocument.getElementById(s);
    if (i && (!this.targetLocalName || i.localName == this.targetLocalName)) {
      let r = i.getAttributeNS("http://www.idpf.org/2007/ops", "type")
              || i.getAttribute("epub:type");
      r && r.match(this.epubTypePatt) && this.chained.apply(e);
    }
  }
}

The issue is in the ID remapping step:

1. The noteref anchor <a id="fnref1" href="#fn1"> gets its hash rewritten to #viv-id-blob:003a...0023fn1
2. getElementById(hash) resolves to an <a> element (not the target <aside id="fn1">)
3. The check i.localName == "aside" fails because the resolved element is <a>
4. As a result, -adapt-template: footnote is never applied, and the default display: none / float: footnote rules are not triggered

DOM evidence

// Noteref anchor
a#fnref1.hash = "#viv-id-blob:003a...0023fn1"
getElementById(hash) => <a> element (not <aside>)

// Aside element - attributes are correct, but CSS rules don't match
aside#fn1:
  getAttributeNS("http://www.idpf.org/2007/ops", "type") => "footnote"  // OK
  computedStyle.float => "none"   // should be footnote
  computedStyle.display => "block" // should be none
  width => "17.2773px"            // crushed

Workaround

Currently using display: none !important on aside[role="doc-footnote"] in userStyleSheet to prevent the text crushing, but this loses footnote functionality entirely.

[MurakamiShinyu]

Thanks for the report. I tried to reproduce this issue locally, but I have not been able to reproduce it yet.

Could you share a minimal EPUB sample or a small runnable reproduction that shows the exact setup? That would help us identify the missing condition and investigate further.