| <!DOCTYPE HTML> |
| <title>SVGLengthList, reaction to DOM modifications</title> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <svg width="200" height="200"> |
| <text x="500 1000 1500" y="50"> ABC </text> |
| </svg> |
| <script> |
| test(function() { |
| // This is a test how SVGLengthList reacts to DOM modifications. |
| |
| var text = document.querySelector("text"); |
| var list = text.x.baseVal; |
| assert_equals(list.numberOfItems, 3); |
| |
| var item0 = list.getItem(0); |
| var item1 = list.getItem(1); |
| var item2 = list.getItem(2); |
| |
| assert_equals(item0.value, 500); |
| assert_equals(item1.value, 1000); |
| assert_equals(item2.value, 1500); |
| |
| // Setting x = x - 250 on all three items. |
| |
| item0.value -= 250; |
| item1.value -= 250; |
| item2.value -= 250; |
| |
| assert_equals(item0.value, 250); |
| assert_equals(item1.value, 750); |
| assert_equals(item2.value, 1250); |
| |
| // Now using text.setAttribute('x', '50 100'). |
| text.setAttribute("x", "50 100"); |
| |
| // Assure that the wrappers still point to the OLD values. |
| assert_equals(item0.value, 250); |
| assert_equals(item1.value, 750); |
| assert_equals(item2.value, 1250); |
| |
| // Assure that obtaining new wrappers will give the right NEW values. |
| assert_equals(list.numberOfItems, 2); |
| assert_equals(list.getItem(0).value, 50); |
| assert_equals(list.getItem(1).value, 100); |
| |
| // Setting x = x + 100 on all old wrapper items. |
| item0.value += 100; |
| item1.value += 100; |
| item2.value += 100; |
| |
| // Assure that the old wrappers can still be modified, but don't influence the new wrappers. |
| assert_equals(item0.value, 350); |
| assert_equals(item1.value, 850); |
| assert_equals(item2.value, 1350); |
| |
| // Assure that the new wrappers stayed the same. |
| assert_equals(list.numberOfItems, 2); |
| assert_equals(list.getItem(0).value, 50); |
| assert_equals(list.getItem(1).value, 100); |
| }); |
| </script> |