| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <script> |
| description('Tests for assigning the value attribute to output elements.'); |
| |
| var output; |
| var childNode; |
| |
| debug('- Sets the defaultValue attribute with the value mode flag is in mode "defalut".'); |
| output = document.createElement('output'); |
| output.defaultValue = "defaultValue"; |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'defaultValue'); |
| shouldBeEqualToString('output.innerText', 'defaultValue'); |
| shouldBeEqualToString('output.innerHTML', 'defaultValue'); |
| |
| debug('- Sets the value attribute. This will change the value mode flag from "default" to "value".'); |
| |
| output.value = 'aValue'; |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'aValue'); |
| shouldBeEqualToString('output.innerText', 'aValue'); |
| shouldBeEqualToString('output.innerHTML', 'aValue'); |
| |
| debug('- Sets the defaultValue attribute with the value mode flag is in mode "value".'); |
| output.defaultValue = 'another defaultValue'; |
| shouldBeEqualToString('output.defaultValue', 'another defaultValue'); |
| shouldBeEqualToString('output.value', 'aValue'); |
| shouldBeEqualToString('output.innerText', 'aValue'); |
| shouldBeEqualToString('output.innerHTML', 'aValue'); |
| |
| debug('- Ensures that setting text to the value attribute works as setTextContent().'); |
| output.value = '<strong>A <span style=\"color: red;\">strong</span> text</strong>'; |
| shouldBe('output.value', '\'<strong>A <span style="color: red;">strong</span> text</strong>\''); |
| shouldBe('output.innerText', '\'<strong>A <span style="color: red;">strong</span> text</strong>\''); |
| shouldBe('output.innerHTML', '\'<strong>A <span style="color: red;">strong</span> text</strong>\''); |
| |
| debug('- Sets the innerText attribute with the value mode flag is in mode "default".'); |
| output = document.createElement('output'); |
| output.innerText = 'text'; |
| shouldBeEqualToString('output.defaultValue', 'text'); |
| shouldBeEqualToString('output.value', 'text'); |
| shouldBeEqualToString('output.innerText', 'text'); |
| shouldBeEqualToString('output.innerHTML', 'text'); |
| |
| output.innerText = '<strong>strong</strong> text'; |
| shouldBeEqualToString('output.defaultValue', '<strong>strong</strong> text'); |
| shouldBeEqualToString('output.value', '<strong>strong</strong> text'); |
| shouldBeEqualToString('output.innerText', '<strong>strong</strong> text'); |
| shouldBeEqualToString('output.innerHTML', '<strong>strong</strong> text'); |
| |
| debug('- Sets the innerText attribute with the value mode flag is in mode "value".'); |
| output = document.createElement('output'); |
| output.value = 'aValue'; |
| output.defaultValue = 'defaultValue'; |
| output.innerText = 'text'; |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'text'); |
| shouldBeEqualToString('output.innerText', 'text'); |
| shouldBeEqualToString('output.innerHTML', 'text'); |
| |
| debug('- Sets the innerHTML attribute with the value mode flag is in mode "default".'); |
| output = document.createElement('output'); |
| output.innerHTML = 'text'; |
| shouldBeEqualToString('output.defaultValue', 'text'); |
| shouldBeEqualToString('output.value', 'text'); |
| shouldBeEqualToString('output.innerText', 'text'); |
| shouldBeEqualToString('output.innerHTML', 'text'); |
| |
| output.innerHTML = '<strong>strong</strong> text'; |
| shouldBeEqualToString('output.defaultValue', 'strong text'); |
| shouldBeEqualToString('output.value', 'strong text'); |
| shouldBeEqualToString('output.innerText', 'strong text'); |
| shouldBeEqualToString('output.innerHTML', '<strong>strong</strong> text'); |
| |
| debug('- Sets the innerHTML attribute with the value mode flag is in mode "value".'); |
| output = document.createElement('output'); |
| output.value = 'aValue'; |
| output.defaultValue = 'defaultValue'; |
| output.innerHTML = 'text'; |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'text'); |
| shouldBeEqualToString('output.innerText', 'text'); |
| shouldBeEqualToString('output.innerHTML', 'text'); |
| |
| output.innerHTML = '<strong>strong</strong> text'; |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'strong text'); |
| shouldBeEqualToString('output.innerText', 'strong text'); |
| shouldBeEqualToString('output.innerHTML', '<strong>strong</strong> text'); |
| |
| debug('- Appends a child node to the output element with the value mode flag is in mode "default".'); |
| output = document.createElement('output'); |
| childNode = document.createElement('span'); |
| childNode.innerText = 'childText'; |
| output.appendChild(childNode); |
| shouldBeEqualToString('output.defaultValue', 'childText'); |
| shouldBeEqualToString('output.value', 'childText'); |
| shouldBeEqualToString('output.innerText', 'childText'); |
| shouldBeEqualToString('output.innerHTML', '<span>childText</span>'); |
| debug('- Then removes the child node from the output element with the value mode flag is in mode "default".'); |
| output.removeChild(childNode); |
| shouldBeEqualToString('output.defaultValue', ''); |
| shouldBeEqualToString('output.value', ''); |
| shouldBeEqualToString('output.innerText', ''); |
| shouldBeEqualToString('output.innerHTML', ''); |
| |
| debug('- Appends a child node to the output element with the value mode flag is in mode "value".'); |
| output = document.createElement('output'); |
| output.value = 'aValue'; |
| output.defaultValue = 'defaultValue'; |
| childNode = document.createElement('span'); |
| childNode.innerText = ' and childText'; |
| output.appendChild(childNode); |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'aValue and childText'); |
| shouldBeEqualToString('output.innerText', 'aValue and childText'); |
| shouldBeEqualToString('output.innerHTML', 'aValue<span> and childText</span>'); |
| debug('- Then removes the child node from the output element with the value mode flag is in mode "default".'); |
| output.removeChild(childNode); |
| shouldBeEqualToString('output.defaultValue', 'defaultValue'); |
| shouldBeEqualToString('output.value', 'aValue'); |
| shouldBeEqualToString('output.innerText', 'aValue'); |
| shouldBeEqualToString('output.innerHTML', 'aValue'); |
| </script> |
| <script src="../../../resources/js-test-post.js"></script> |
| </body> |
| </html> |