Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

not working HTMLTemplateElement Content append after innerHTML result empty string

オープン
#313 コメント 3 件 リアクション 2 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
42/100
issue の種類
バグ
明瞭さ
説明が足りない
活発さ
静か
技術スタック
typescript
領域
web-dev

調査の方向性

この issue の TypeScript による再現から始めます。DocumentFragment を template.content に追加し、その後 template.innerHTML と template.content.children を比較します。HTMLTemplateElement のシリアライズ経路を追跡し、追加されたコンテンツが innerHTML に現れる一方で、報告される children の結果が維持されることを示すカバレッジを追加します。

索引モデルが issue の本文から書いたものです。

説明

PR: https://github.com/WebReflection/linkedom/pull/315

const data: DocumentFragment = ...
const template = window.document.createElement('template') as HTMLTemplateElement;
template.content.append(data);

 console.log('innerHTML:', template.innerHTML, 'children:',Array.from(template.content.children));  // innerHTML emptyString

not working..

innerHTML output is empty string

 console.log('innerHTML:', template.innerHTML, 'children:',Array.from(template.content.children));

--log result--
innerHTML: children: [
<ref *1> HTMLStyleElement {
ownerDocument: HTMLDocument {
ownerDocument: null,
localName: '#document',
nodeType: 9,
parentNode: null,
[Symbol(next)]: [DocumentType],
[Symbol(prev)]: null,
[Symbol(private)]: null,
[Symbol(end)]: [Object],
[Symbol(CustomElements)]: [Object],
[Symbol(MutationObserver)]: [Object],
[Symbol(mime)]: [Object],
[Symbol(doctype)]: [DocumentType],
[Symbol(DOMParser)]: [class DOMParser],
[Symbol(globals)]: null,
[Symbol(image)]: null,
[Symbol(upgrade)]: null,
[Symbol(EventTarget)]: [DOMEventTarget]
},
localName: 'style',
nodeType: 1,
parentNode: DocumentFragment {
ownerDocument: [HTMLDocument],
localName: '#document-fragment',
nodeType: 11,
parentNode: null,
[Symbol(next)]: [Circular *1],
[Symbol(prev)]: null,
[Symbol(private)]: [HTMLTemplateElement],
[Symbol(end)]: [Object]
},
[Symbol(next)]: Attr {
ownerDocument: [HTMLDocument],
localName: 'id',
nodeType: 2,
parentNode: null,
ownerElement: [Circular *1],
name: 'id',
[Symbol(next)]: [Attr],
[Symbol(prev)]: [Circular *1],
[Symbol(value)]: 'KQykvzSaQPUDomNDyYpuZNdcxkWCkvHtGvVujfjH-style',
[Symbol(changed)]: false
},
[Symbol(prev)]: DocumentFragment {
ownerDocument: [HTMLDocument],
localName: '#document-fragment',
nodeType: 11,
parentNode: null,
[Symbol(next)]: [Circular *1],
[Symbol(prev)]: null,
[Symbol(private)]: [HTMLTemplateElement],
[Symbol(end)]: [Object]
},
[Symbol(private)]: null,
[Symbol(end)]: {
nodeType: -1,
ownerDocument: [HTMLDocument],
parentNode: null,
[Symbol(next)]: [HTMLElement],
[Symbol(prev)]: [Attr],
[Symbol(start)]: [Circular *1]
},
...
]

I was thus treated with innerHTML.

  • template.innerHTM; .. template.content

But I think it needs to be fixed

主要言語
HTML
スター
2.1k
フォーク
108
PR マージ指標
30日以内にマージされた PR はありません

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

WebReflection/linkedom のほかの issue

WebReflection/linkedom の issue をすべて見る

似ている issue

Web Dev の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。