Closed Bug 590479 Opened 14 years ago Closed 14 years ago

Removing characters at the end of a string with js/innerHTML leaves parts of the characters visible

Categories

(Core :: Layout: Text and Fonts, defect)

x86
Windows Vista
defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 475968

People

(Reporter: eric.vanvliet, Unassigned)

References

()

Details

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8 ( .NET CLR 3.5.30729; .NET4.0E)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8 ( .NET CLR 3.5.30729; .NET4.0E)

When you put a string in a div and remove characters with javascript from the end of the string the characters are not properly wiped out. 

Default serif/ss default size and smaller are affected.

The parts of the character that remain visible are always the top or bottom 1 or two pixels.

Looks like a rounding error is made when the screen is being updated. The area that is 'cleaned' is a bit to small.

To test use above url or the (same) code in the 'steps to reproduce' section

Reproducible: Always

Steps to Reproduce:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<head>
    <script type="text/javascript">
	
    var timer = 0;
	
    function run()
    {
      timer = setInterval ( "eatchar()", 100 );
    }
	
	//remove a character at end of a string in a div
    function eatchar()
    {
      var obj = document.getElementById("divTest");
      var str = obj.innerHTML;
      str = str.substring(0,str.length - 1);
      if (str.length <= 5)
      {
         clearInterval(timer);
		 timer = 0;
      }
      obj.innerHTML = str;
    }
	
    function rerun(str) 
	{
		if (timer)
		{
			clearInterval(timer);
			timer = 0;
		}
		var d = document.getElementById("divTest");
		
		switch (str) 
		{
			case "serif":
				d.style.fontFamily = "serif";
				break;
			case "sans":
				d.style.fontFamily = "sans-serif";
				break;
			case "+":
				d.style.fontSize = parseFloat(d.style.fontSize) + 0.25 + "em";
				break;
			case "-":
				d.style.fontSize = parseFloat(d.style.fontSize) - 0.25 + "em";
			break;
		}

		d.innerHTML = "oh no oh no __f__f__f__f__f";
		window.setTimeout("run()", 250);
    }
    </script>
</head>
<body onLoad="run()">
	<div id="divTest" style="font-size:1em;">oh no oh no __f__f__f__f__f</div>
	
	<p>Change font: 
		<button onclick="rerun('serif');">Serif</button>
		<button onclick="rerun('sans');">Sans</button>
		<button onclick="rerun('+');">Increase size</button>
		<button onclick="rerun('-');">Decrease size</button>
	 </p>
</body>
</html>
Actual Results:  
Parts of the characters that are removed from the screen remain visible

Expected Results:  
Like it does in all browsers and older versions of FF: remove the character from screen.
Whiteboard: DUPEME
Jonathan can dup this to the right bug
This sounds like another manifestation of bug 475968; the underlying issue we need to fix first is bug 	 542595.
Status: UNCONFIRMED → RESOLVED
Closed: 14 years ago
Resolution: --- → DUPLICATE
Whiteboard: DUPEME
You need to log in before you can comment on or make changes to this bug.