<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    
    <script type="text/javascript" language="Javascript">
    <![CDATA[
        function runText() 
        {
            for(var y=20; y<5000; y+=100)
            {
                for(var x=0; x<5000; x+=100)
                {
                    var svgArea = document.getElementById("svgArea");
                    var text = document.createElementNS("http://www.w3.org/2000/svg", "text");
                    text.setAttributeNS(null, "x", x);
                    text.setAttributeNS(null, "y", y);
                    text.setAttributeNS(null, "fill", "black");
                    text.setAttributeNS(null, "font-size", 20);
                    text.setAttributeNS(null, "text-anchor", "start");
                    text.appendChild(document.createTextNode("just a text"));
                    svgArea.appendChild(text);
                }
            }
            var scrolldiv = document.getElementById("scrolldiv");
            scrolldiv.scrollTop = 550;
        }
    ]]>
    </script>

<title>BUG 12163: SVG text disappears in scrolling div</title>
</head>
<body onload="runText();">
    <p>In the div below the text is distributed over the whole SVG area. But when you scroll around the invisible text does not appear (Bug 12163).</p>
    <div style="overflow:auto; position:absolute; left:10px; width:500px; height:500px; border:1px solid #aaaaaa;" id="scrolldiv">
        <svg id="svgArea" width = "5000" height = "5000" xmlns = "http://www.w3.org/2000/svg"></svg>
    </div>
</body>
</html>