<!DOCTYPE html>
<script src="../include.js"></script>
<script>
test(() => {
const outputElement = document.createElement("output");
const htmlFor = outputElement.htmlFor;
println(`output.htmlFor is initially empty: ${htmlFor.length === 0}`);
println(`output.htmlFor always returns the same object: ${outputElement.htmlFor === htmlFor}`);
outputElement.htmlFor = "a";
println(`output.htmlFor after setting output.htmlFor to "a": ${outputElement.htmlFor}`);
println(`for attribute value after setting output.htmlFor to "a": ${outputElement.getAttribute("for")}`);
outputElement.setAttribute("for", "b");
println(`output.htmlFor after calling output.setAttribute("for", "b"): ${outputElement.htmlFor}`);
outputElement.htmlFor = "c d";
println(`output.htmlFor after setting output.htmlFor to "c d": ${outputElement.htmlFor}`);
println(`for attribute value after setting output.htmlFor to "c d": ${outputElement.getAttribute("for")}`);
println(`output.htmlFor.contains("c"): ${outputElement.htmlFor.contains("c")}`);
println(`output.htmlFor.contains("a"): ${outputElement.htmlFor.contains("a")}`);
});
</script>
