<!DOCTYPE html>
<body>
<form style="display:none">
<template id="one"><input></template>
</form>
<template id="two"><form><template><input></template></form></template>
<script src="../../../resources/js-test-pre.js"></script>
<script>
description("Form control elements inside templates should not be associated with forms outside the template");

debug('Form in document, input inside template:');
var form = document.querySelector('form');
var input = document.querySelector('#one').content.querySelector('input');
shouldBe('form.length', '0');
shouldBeNull('input.form');

debug('\nForm in template, input in sub-template:');
form = document.querySelector('#two').content.querySelector('form');
input = document.querySelector('#two').content.querySelector('template').content.querySelector('input');
shouldBe('form.length', '0');
shouldBeNull('input.form');
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
