Bug 328382

Description Istvan Ballok 2010-10-21 12:23:23 EDT

How to reproduce the problem
============================
Display some text e.g. in a Label or a Button, with e.g. a 10px, "Segoe UI"
font. Set a rounded corner or a gradiant as background-image on one of the
widgets, and use plain styles on the other one.
Observe that the text is rendered differently by IE in the 2 cases.
The text on the widget with rounded corner/ gradient looks
weird, e.g. in sequences like "io" or "la" the letters merge, resulting
in an untidy typeface.

Explanation of the problem
==========================
When rounded corners, gradient, or even simply opacity, ... is used,
the filter style property is set. When removing these styles, the property
is set to an empty string, but it is not removed.

If the filter property is set, IE falls back on a different anti aliasing
mode, that causes this issue - even if the filter is an empty.

Solution of the problem
=======================
When removing the filter property in IE, element.style.filter = "" is not
enough. The correct removal is like in
org.eclipse.rap\runtime.rwt\
org.eclipse.rap.rwt.q07\js\org\eclipse\rwt\VML.js
#_removeFilter, modifying the css text.

The central function that removes style properties in qooxdoo is
org.eclipse.rap\runtime.rwt\
org.eclipse.rap.rwt.q07\js\qx\ui\core\Widget.js
#removeStyleProperty

I propose to patch this function by introducing a special case for IE and
the filter style property:
  -> remove the filter property by setting the style.cssText property.
	 cssText = cssText.replace(/FILTER:[^;]*;/,"");

Note: the other alternative approach,
delete style.filter is not supported.