| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| body |
| { |
| counter-reset: i 0; |
| } |
| |
| div:before |
| { |
| content: "-" counter(i); |
| counter-increment: i; |
| } |
| div { |
| display:inline; |
| } |
| </style> |
| <script> |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| |
| function insertAuto(i) { |
| // We need to use the selection or we cannot reproduce this bug! |
| var selection = window.getSelection(); |
| var container = document.getElementById("container"); |
| selection.collapse(container.firstChild, 0); |
| if (selection.rangeCount > 0) { |
| var newElement = document.createElement('div'); |
| newElement.id = 'div' + i; |
| //newElement.innerHTML = '<span"> - i:' + (6 - i) + '</span>'; |
| var node = selection.getRangeAt(0).startContainer.parentNode.parentNode; |
| node.parentNode.insertBefore(newElement, node.nextSibling); |
| } |
| } |
| |
| function dumpCounters() |
| { |
| var spanList = document.getElementsByTagName("div"); |
| var counters = ''; |
| for (var i = 0; i < spanList.length; ++i ) { |
| var divItem = spanList.item(i); |
| counters += '-'; |
| counters += internals.counterValue(document.getElementById(divItem.getAttribute("id"))); |
| counters += divItem.textContent; |
| } |
| document.getElementById("container").innerHTML = counters; |
| testRunner.notifyDone(); |
| } |
| |
| function test() |
| { |
| for (var i = 0; i < 5; ++i) |
| insertAuto(i); |
| if (window.testRunner) { |
| setTimeout("dumpCounters()", 0); |
| } |
| } |
| window.addEventListener("load", test, false); |
| </script> |
| </head> |
| <body> |
| <p>Bug <a href="https://bugs.webkit.org/show_bug.cgi?id=38291">38291</a> - CSS counters in :before pseudo-elements do not always update</p> |
| <p>The following two lines should be the same:</p> |
| <p>-1--2-3-4-5-6</p> |
| <div id="container"><span>-</span></div> |
| </body> |
| </html> |
