| <!DOCTYPE HTML> |
| <meta charset=utf-8> |
| <title>MutationObservers: characterData mutations</title> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="mutationobservers.js"></script> |
| <h1>MutationObservers: characterData mutations</h1> |
| <div id="log"></div> |
| |
| <section style="display: none"> |
| |
| <p id='n'>text content</p> |
| |
| <p id='n00'>text content</p> |
| |
| <p id='n10'>CHAN</p> |
| <p id='n11'>CHANGED</p> |
| <p id='n12'>CHANGED</p> |
| |
| <p id='n20'>CHGED</p> |
| <p id='n21'>CHANGED</p> |
| <p id='n22'>CHANGED</p> |
| |
| <p id='n30'>CCCHANGED</p> |
| <p id='n31'>CHANGED</p> |
| |
| <p id='n40'>CCCHANGED</p> |
| <p id='n41'>CHANGED</p> |
| |
| <p id="n50"><?processing data?></p> |
| |
| <p id="n60"><!-- data --></p> |
| |
| <p id='n70'>CHANN</p> |
| <p id='n71'>CHANN</p> |
| |
| <p id='n80'>CHANN</p> |
| <p id='n81'>CHANN</p> |
| |
| <p id='n90'>CHANN</p> |
| |
| </section> |
| |
| <script> |
| var n = document.getElementById('n').firstChild; |
| runMutationTest(n, |
| {"characterData":true}, |
| [{type: "characterData"}], |
| function() { n.data = "NEW VALUE"; }, |
| "characterData Text.data: simple mutation without oldValue"); |
| |
| var n00 = document.getElementById('n00').firstChild; |
| runMutationTest(n00, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "text content" }], |
| function() { n00.data = "CHANGED"; }, |
| "characterData Text.data: simple mutation"); |
| |
| var n10 = document.getElementById('n10').firstChild; |
| runMutationTest(n10, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHAN" }], |
| function() { n10.appendData("GED"); }, |
| "characterData Text.appendData: simple mutation"); |
| |
| var n11 = document.getElementById('n11').firstChild; |
| runMutationTest(n11, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }], |
| function() { n11.appendData(""); }, |
| "characterData Text.appendData: empty string mutation"); |
| |
| var n12 = document.getElementById('n12').firstChild; |
| runMutationTest(n12, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }], |
| function() { n12.appendData(null); }, |
| "characterData Text.appendData: null string mutation"); |
| |
| var n20 = document.getElementById('n20').firstChild; |
| runMutationTest(n20, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHGED" }], |
| function() { n20.insertData(2, "AN"); }, |
| "characterData Text.insertData: simple mutation"); |
| |
| var n21 = document.getElementById('n21').firstChild; |
| runMutationTest(n21, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }], |
| function() { n21.insertData(2, ""); }, |
| "characterData Text.insertData: empty string mutation"); |
| |
| var n22 = document.getElementById('n22').firstChild; |
| runMutationTest(n22, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }], |
| function() { n22.insertData(2, null); }, |
| "characterData Text.insertData: null string mutation"); |
| |
| var n30 = document.getElementById('n30').firstChild; |
| runMutationTest(n30, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CCCHANGED" }], |
| function() { n30.deleteData(0, 2); }, |
| "characterData Text.deleteData: simple mutation"); |
| |
| var n31 = document.getElementById('n31').firstChild; |
| runMutationTest(n31, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }, {type: "characterData", oldValue: "CHANGED" }], |
| function() { n31.deleteData(0, 0); n31.data = "n31"; }, |
| "characterData Text.deleteData: empty mutation"); |
| |
| var n40 = document.getElementById('n40').firstChild; |
| runMutationTest(n40, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CCCHANGED" }], |
| function() { n40.replaceData(0, 2, "CH"); }, |
| "characterData Text.replaceData: simple mutation"); |
| |
| var n41 = document.getElementById('n41').firstChild; |
| runMutationTest(n41, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANGED" }], |
| function() { n41.replaceData(0, 0, "CH"); }, |
| "characterData Text.replaceData: empty mutation"); |
| |
| var n50 = document.getElementById('n50').firstChild; |
| runMutationTest(n50, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "?processing data?" },{type: "characterData", oldValue: "CHANGED" },{type: "characterData", oldValue: "CHANGED" }], |
| function() { |
| n50.data = "CHANGED"; |
| n50.deleteData(0, 0); |
| n50.replaceData(0, 2, "CH"); }, |
| "characterData ProcessingInstruction: data mutations"); |
| |
| var n60 = document.getElementById('n60').firstChild; |
| runMutationTest(n60, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: " data " },{type: "characterData", oldValue: "CHANGED" },{type: "characterData", oldValue: "CHANGED" }], |
| function() { |
| n60.data = "CHANGED"; |
| n60.deleteData(0, 0); |
| n60.replaceData(0, 2, "CH"); }, |
| "characterData Comment: data mutations"); |
| |
| var n70 = document.getElementById('n70'); |
| var r70 = null; |
| test(function () { |
| n70.appendChild(document.createTextNode("NNN")); |
| n70.appendChild(document.createTextNode("NGED")); |
| r70 = document.createRange(); |
| r70.setStart(n70.firstChild, 4); |
| r70.setEnd(n70.lastChild, 1); |
| }, "Range (r70) is created"); |
| runMutationTest(n70.firstChild, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANN" }], |
| function() { r70.deleteContents(); }, |
| "characterData Range.deleteContents: child and data removal mutation"); |
| |
| var n71 = document.getElementById('n71'); |
| var r71 = null; |
| test(function () { |
| n71.appendChild(document.createTextNode("NNN")); |
| n71.appendChild(document.createTextNode("NGED")); |
| r71 = document.createRange(); |
| r71.setStart(n71.firstChild, 4); |
| r71.setEnd(n71.lastChild, 1); |
| }, "Range (r71) is created"); |
| runMutationTest(n71.lastChild, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "NGED"}], |
| function() { r71.deleteContents(); }, |
| "characterData Range.deleteContents: child and data removal mutation (2)"); |
| |
| var n80 = document.getElementById('n80'); |
| var r80 = null; |
| test(function () { |
| n80.appendChild(document.createTextNode("NNN")); |
| n80.appendChild(document.createTextNode("NGED")); |
| r80 = document.createRange(); |
| r80.setStart(n80.firstChild, 4); |
| r80.setEnd(n80.lastChild, 1); |
| }, "Range (r80) is created"); |
| runMutationTest(n80.firstChild, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANN" }], |
| function() { r80.extractContents(); }, |
| "characterData Range.extractContents: child and data removal mutation"); |
| |
| var n81 = document.getElementById('n81'); |
| var r81 = null; |
| test(function () { |
| n81.appendChild(document.createTextNode("NNN")); |
| n81.appendChild(document.createTextNode("NGED")); |
| r81 = document.createRange(); |
| r81.setStart(n81.firstChild, 4); |
| r81.setEnd(n81.lastChild, 1); |
| }, "Range (r81) is created"); |
| runMutationTest(n81.lastChild, |
| {"characterData":true,"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "NGED" }], |
| function() { r81.extractContents(); }, |
| "characterData Range.extractContents: child and data removal mutation (2)"); |
| |
| var n90 = document.getElementById('n90').firstChild; |
| runMutationTest(n90, |
| {"characterDataOldValue":true}, |
| [{type: "characterData", oldValue: "CHANN" }], |
| function() { n90.data = "CHANGED"; }, |
| "characterData/characterDataOldValue alone Text.data: simple mutation"); |
| </script> |
