Template contents participate in the DOM tree

Open
#252 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Stale
Tech stack
php
Domain
web-dev

Research direction

Start by running the PHP reproduction in the issue and inspect how template contents are added to the DOM during parsing. The fix is done when saveHTML() still serializes the template contents, while the XPath query for the nested div returns an empty DOMNodeList.

Written by the indexing model from the issue text.

Description

help-wanted

The following code:

<?php
require 'vendor/autoload.php';
use Masterminds\HTML5;
$html = new HTML5(array(
    "disable_html_ns" => false
));

$dom = $html->loadHTML(<<<HTML
<!DOCTYPE html>
<html>
<body>
  <template><div>foo</div></template>
</body>
</html>
HTML);
echo $dom->saveHTML();

$xp = new DOMXPath($dom);
$xp->registerNamespace('html', 'http://www.w3.org/1999/xhtml');
var_dump($xp->query('//html:div'));

Resulted in the following output:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><body>
  <template><div>foo</div></template>
</body>
</html>
object(DOMNodeList)#8 (1) {
  ["length"]=>
  int(1)
}

But I expected this instead:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><body>
  <template><div>foo</div></template>
</body>
</html>
object(DOMNodeList)#8 (1) {
  ["length"]=>
  int(0)
}

While template contents should be serialized via saveHTML(), they should not participate in the DOM tree and therefore not show up in the DOMNodeList.

Equivalent JS:

dom=(new DOMParser).parseFromString(`<!DOCTYPE html>
<html>
<body>
  <template><div>foo</div></template>
</body>
</html>`,'text/html');
console.log(dom.getElementsByTagName('template')[0].firstChild); // null
console.log(dom.documentElement.outerHTML); // Shows template contents
Dominant language
HTML
Stars
1.8k
Forks
122
No merged PRs in 30d

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from Masterminds/html5-php

All issues in Masterminds/html5-php

Similar issues

More Web Dev issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.