Html: [spec bug?] Element with name attribute breaks Document

[petamoriken]

moved from https://github.com/whatwg/dom/issues/708

---

https://html.spec.whatwg.org/multipage/dom.html#dom-document-nameditem

Modern browsers except Edge expose Element with name attribute more preferentially than a property already defined in Document WebIDL. Since this behavior seems to be dangerous, IMHO, it is better to design specifications that preferentially return defined properties if there is no compatibility problem.

<title>This is Document Title</title>
<form name="title"></form>
<script>
  console.log(document.title);
  // <form name="title"></form> in Chrome, Firefox, Safari
  // "This is Document Title" in Edge
</script>

code: https://codepen.io/petamoriken/pen/zmaRJX
(appendix) WindowProxy version: https://codepen.io/petamoriken/pen/MPXNJe

[petamoriken]

I found the note about DOM clobbering. All modern browser prevent DOM clobbering by WindowProxy over defined properties, IMHO Document should also be prevented in the same way. Is it not solved for web compatibility?

DOM clobbering is a common cause of security issues. Avoid using the names of built-in form properties with the name content attribute.
In this example, the input element overrides the built-in method property:

let form = document.createElement("form");
let input = document.createElement("input");
form.appendChild(input);

form.method;           // => "get"
input.name = "method"; // DOM clobbering occurs > here
form.method === input; // => true

Since the input name takes precedence over built-in form properties, the JavaScript reference form.method will point to the input element named "method" instead of the built-in method property.

https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#naming-form-controls:-the-name-attribute

[domenic]

Unfortunately this design is entirely a product of web compatibility, and cannot be changed.

[annevk]

Though we could have a feature policy or some such to control it.