Known bugs in Sidebar RTM

Here's all the reproducible bugs in Sidebar RTM. If you have any more or know workarounds, let me know and I'll add them.

Bug #1: The bottom and right are incorrectly cropped when rotation is applied to <g:background>

Repro1.jpg (11.52K)
Number of downloads: 84

Repro1.gadget (11.48K)
Number of downloads: 55

Bug #2: <g:background> and addImageObject incorrectly place the image, by (originalImageWidth-scaledImageWidth)/2, (originalImageHeight-scaledImageHeight)/2

Repro2.jpg (9.48K)
Number of downloads: 46

Repro2.gadget (11.5K)
Number of downloads: 39
Workaround: Read the image dimensions and alter the coordinates accordingly:

function addImage(file, x, y, width, height) {
	//get the original image dimensions
	var img = new Image();
	img.src = "file://" + file;

	//calculate half the difference
	var xOffset = parseInt((img.width - width)/2);
	var yOffset = parseInt((img.height - height)/2);

	img = null;

	//add the image
	var gimg = <gbackground>.addImageObject(file, x - xOffset, y - yOffset);
	gimg.width = width;
	gimg.height = height;

	return gimg;
}

NOTE: The 1st time it reads the image dimensions, they're sometimes 0,0 so you may want to add a check for this and try to read it again.

Bug #3: A g:background image will become corrupt if it is sized than 50% of it's original size.

Repro3.jpg (4.53K)
Number of downloads: 41

Repro3.gadget (11.47K)
Number of downloads: 28
Workaround (by Rafael): Manually calculate the size in pixels.

Bug #4: Gadgets will not install if they contain blank directories in the Gadget package.

Workaround: Put a dummy file in the directory.

Bug #5: Changing <g:text>.value doesn't update <g:text>.width or <g:text>.height - the text is stretched, or you get an invalid result when trying to reference it.

Repro5.jpg (4.46K)
Number of downloads: 31

Repro5.gadget (11.65K)
Number of downloads: 19

Workaround (by Tom@Cener): After changing the value, set to width/height to 0. The width/height will then be set to the correct values by Sidebar:

bodyText = bodyBackground.addTextObject("This is some text", "Arial", 20, "Black", 0, 0);
bodyText.value = "Text";
bodyText.width = 0;
bodyText.height = 0;

Bug #6: Settings page is limited to 300x400. The Settings page on this gadget should be 1000x1000

Repro6.gadget (11.68K)
Number of downloads: 30

Bug #7: Sidebar crashes when trying to use addImageObject or addTextObject in the BODY section.

Repro7.gadget (11.72K)
Number of downloads: 30

Workaround (by Rafael): Move any code that references objects created in the BODY section into a function and use "onload":

<html>
  <head>
	 <script language="javascript">
	  function init() {
		 bodyBackground.addImageObject("image.jpg", 50, 50);
	  }
	</script>
  </head>
  <body onload="init()">
	<g:background id="bodyBackground" src="background.png" />
  </body>
</html>

Bug #8: The aliased surround of a g:image is incorrectly placed if the object is rotated and body margin is not 0.

Repro8.jpg (10.75K)
Number of downloads: 28

Repro8.gadget (11.8K)
Number of downloads: 18
Workaround: Add "margin:0px" to the BODY style.

Bug #9: The three (or two if you have no settings) icons that appear when you hover over a Gadget are incorrectly placed for detached Gadgets after Sidebar is reloaded. They're shifted left 6 pixels. Docked Gadgets are also placed incorrectly, shifted right 6 pixels.

To reproduce this:

1. Add the Calendar Gadget
2. Detach it from the Sidebar
3. Exit Sidebar
4. Load Sidebar
5. Hover the mouse over the Calender Gadget

You'll see the icons are in the wrong place. To correct them drag the Gadget slightly.

Bug #10: If you manually Exit Sidebar, the X position of all detached Gadgets is decreased by 6.

To reproduce this:

1. Add a Gadget to the Desktop
2. Open %USERPROFILE%\AppData\Local\Microsoft\Windows Sidebar\Settings.ini
3. Find the Gadget you've added and note it's "PrivateSetting_GadgetDropLocationX" value
4. Exit Sidebar
5. Open %USERPROFILE%\AppData\Local\Microsoft\Windows Sidebar\Settings.ini
6. "PrivateSetting_GadgetDropLocationX" has now decreased by 6

Workaround: If the Gadget has moved 6 pixels when it's unloaded, correct it.

window.onunload = fixBug10;

var privateSetting_X = parseInt(System.Gadget.Settings.readString("PrivateSetting_GadgetDropLocationX"));

function fixBug10() {
	var currentX = parseInt(System.Gadget.Settings.readString("PrivateSetting_GadgetDropLocationX"));

	// has the Gadget moved left 6 pixels since it was loaded?
	if (currentX == privateSetting_X - 6)
		System.Gadget.Settings.writeString("PrivateSetting_GadgetDropLocationX", privateSetting_X);
}

Bug #11: System.* namespace goes missing after "window.location.reload(true);"

Repro11.gadget (743bytes)
Number of downloads: 27
Workaround (by hax): Use location.href to refresh the page instead

location.href = location.href;

Bug #12: Focus is lost on the Flyout if you change System.Gadget.Flyout.file whilst a Flyout is open

Workaround: You need to pause for at least 300ms and then set the focus back. Add the following code to the very end of the Flyout html:

<script language="javascript" type="text/javascript">
	setTimeout(getFocus, 300);
 
	function getFocus() {self.focus()}
</script>

Bug #13: Setting "System.Gadget.Flyout.onShow = null;" generates an error. This goes for all other Gadget settings that are set to a function.

Workaround: Set it to a blank function:

System.Gadget.Flyout.onShow = blankFunction;
...
function blankFunction() {}

Bug #14: Partially transparent surround is scaled incorrectly when setting System.Gadget.background, if the image is larger than the Gadget

Repro14.jpg (2.26K)
Number of downloads: 35

Repro14.gadget (39.63K)
Number of downloads: 25
Workaround: Set the background with <g:background> ie:

<g:background src="undockedright.png">
instead of:
System.Gadget.background = "undockedright.png";

Bug #15: Background image doesn't change if it's changed through a stylesheet

Workaround: Set the background with System.Gadget.background or <g:background>

Repro15.gadget (5.93K)
Number of downloads: 23

Issue #16: addImageObject holds the image open. If you're developing a Gadget and want to change one of the images, you can't overwrite it.

Workaround: Exit Sidebar, update your image and then reload

Issue #17: Images are cached. If you remove all instances of a Gadget, change the images within it and then re-add it to Sidebar, the old images still show.

Workaround: Exit Sidebar and the reload to clear the image cache

Bug #18: If a Gadget is partially off screen, Sidebar shifts it so it's completely on screen on loading.

To reproduce this:

1. Add a Gadget to the Desktop
2. Move the Gadget so it's partially offscreen
3. Exit Sidebar
4. Load Sidebar
5. The Gadget has now shifted position to be completely on screen.

Bug #19: <g:background>.blur / <g:background>.softEdge effect is positioned incorrectly. It doesn't take account of the top and left parameters.

Repro19.jpg (3.75K)
Number of downloads: 20

Repro19.gadget (11.68K)
Number of downloads: 17

Bug #20: When digitally signing a Gadget, if the filename is long the signature is corrupt:

bug20.JPG (13.8K)
Number of downloads: 16

Workaround (by Bruce Williams @ MS): Rename your gadget package from SomeLongGadgetName.gadget to SomethingShorter.gadget

Bug #21: The GPO Policy setting ""Turn Off User Installed Windows Sidebar Gadgets"", also stops users from adding Gadgets in the "Shared Gagets" folder:

Workaround (by Brian Teutsch @ MS): Don't use the GPO Policy Setting, instead point the User Gadget Folder environment variable "GADGETS_USER" to "%PROGRAMFILES%\Windows Sidebar\Shared Gadgets"

Bug #22: <BODY onunload> doesn't fire during logout and shutdown.

Workaround: If you're just saving settings, periodically save them with a timer.

Bug #23: BODY background colour cannot be set from a stylesheet.

Workaround: Create a DIV section that fills the flyout and set the background colour on that.

repro23.gadget (1.21K)
Number of downloads: 13

Bug #24: Gadget may never appear on the sidebar if you have overlayed RGB transparent images and are updating the screen too often.

Repro24.jpg (12.49K)
Number of downloads: 11

Repro24.gadget (3.17K)
Number of downloads: 11
Workaround: Before setting up the update timer, pause for half a second:

var iTimerID1;
...
window.setTimeout(setupTimer,500)
...
function setupTimer() {
	//setup the screen update timer
	iTimerID1 = window.setInterval(<updateScreenFunction>, <refreshRate>);
}

Issue #25: Flyout will only show if Sidebar has focus. If you show the Flyout via "System.Gadget.Flyout.show = true" and Sidebar doesn't have focus, the "System.Gadget.Flyout.onHide" event immediately fires.

In this example Gadget, the Flyout should open 500ms after it closes.

repro25.gadget (1.05K)
Number of downloads: 26

If you're opening the Flyout outside of a key or mouse click event, you must trap for this occuring:

System.Gadget.Flyout.onHide = onHideEvent;

function onHideEvent() {
	if (System.Gadget.Flyout.document.parentwindow.body == null)
		return;

	// Flyout was showing
}

Bug #26: System.Shell.saveFileDialog(strPath, strFilter) filter string doesn't work as expected. The documentation states filters should be seperated with a ":", eg "Text File:*.txt:Reg File:*.reg::", which doesn't work.

Note: This issue is now noted in the August 2007 documentation refresh.

Workaround (by miloush): Use char0 as a seperator instead. eg "Text File\0*.txt\0Reg File\0*.reg\0\0"

Bug #27: System.Gadget.begin/endTransition can cause corruption of a g:background. It happens regardless of what transition type you use, or if you use an image or not. In the following Repro, Left click to see the problem. Right click to see, with the workaround.

Repro27.jpg (2.29K)
Number of downloads: 29

Repro27.gadget (972bytes)
Number of downloads: 15
Workaround: Wait the transition time+300ms, then set the g:background src to itself:

var transitionDelay = 2;

function init(fix) {
	System.Gadget.beginTransition();

	document.body.style.width = <bodyWidth>;
	document.body.style.height = <bodyHeight>;

	System.Gadget.endTransition(System.Gadget.TransitionType.morph, transitionDelay);

	window.setTimeout(fixgBackground, transitionDelay*1000 + 300);
}

function fixgBackground() {
	gBackground.src = gBackground.src;
}

Bug #28: g:background becomes corrupt if you change document.body.style.zoom. In the following Repro, Left click to see the problem. Right click to turn on the workaround.

Repro28.jpg (2.21K)
Number of downloads: 17

Repro28.gadget (5.7K)
Number of downloads: 10
Partial Workaround: Use System.Gadget.background instead of <g:background>. You obviously lose the ability to insert images into the background via addImageObject.
Partial Workaround 2: Set <g:background> to a blank image, add your background image via addImageObject and set the g:image object's opacity below 100. This does however result in image corruption if document.body.style.zoom is less than 1 when the Gadget is added to Sidebar. It also suffers from Bug#32

Bug #29: If the g:background image is set to a percentage of the Gadget size, it's not rescaled when the Gadget body size changes. In the following Repro, Left click to see the problem. Right click to turn on the workaround.

Repro29.jpg (4.12K)
Number of downloads: 17

Repro29.gadget (5.68K)
Number of downloads: 21
Workaround: Once you've changed the body size, set the g:background src to itself. eg:

document.body.style.width = 400;
document.body.style.height = 200;
gBackground.src = gBackground.src;
...
<body>
	<g:background id="gBackground" src="screenshot.png" style="width:100%; height:100%;" />
</body>

Bug #30: begin/endTransition can hang a Gadget, if the body size isn't changed. In the following Repro, the image should toggle between two images. Right click to toggle with the workaround, Left click to recreate the problem.

Repro30.gadget (9.02K)
Number of downloads: 13
Workaround: Change the Body size before calling endTransition. Then set it back 300ms after the transition has finished. eg:

var transitionDelay = 2;
var bodyWidth;

function updateGadget() {
	System.Gadget.beginTransition();

	//update gadget

	//temporarily change the gadget size
	bodyWidth = document.body.style.width;
	document.body.style.width = parseInt(bodyWidth) + 1;

	//end the Transition and set the body size back after it's completed
	System.Gadget.endTransition(System.Gadget.TransitionType.morph, transitionDelay);
	window.setTimeout(fixTransition, transitionDelay*1000 + 300);
}

function fixTransition() {
	document.body.style.width = bodyWidth;
}

Bug #31: System.Gadget.background="..." will corrupt the image if it's height is less than 57 pixels. If you set a Gadget background via System.Gadget.Background = "..." to an image that is less than 57 pixels in height that has partially transparent pixels, the background becomes corrupt. Sidebar stretches the transparent pixels to 57 pixels in height, but leaves the opaque pixels their original size.

Repro31.jpg (1.7K)
Number of downloads: 13

Repro31.gadget (4.82K)
Number of downloads: 11
Workaround: Use <g:background src="..." /> instead.

Bug #32: g:background "blur" and "softEdge" cause the partially transparent background pixels to overlay the Gadget when focus is lost. In the Repro, move the Gadget to reproduce the problem.

Repro32_1.jpg (4.34K)
Number of downloads: 19 becomes

Repro32_2.jpg (4.42K)
Number of downloads: 20

Repro32.gadget (11.84K)
Number of downloads: 23

Bug #33: Sidebar will crash if the Gadget tries to show a Flyout during the onunload event.

Repro33.gadget (723bytes)
Number of downloads: 21

Issue #34: Fonts change scale when the desktop DPI is changed.

Workaround: Specify all font sizes in px, and add a default font size to all HTML pages:

<STYLE>
	* {font-size:12px}
</STYLE>

Bug #35: BODY width/height cannot be set through a stylesheet

Workaround: Set it at the time you change the stylesheet:
Method 1:
1. Create a dummy element in your Gadget html file

<DIV id="divBodySize" class="bodySize" style="display:none"></DIV>

2. In the stylesheets, instead of setting width/height on body {}, set it on .bodySize {}:

.bodySize{
	width:163px;
	height:149px;
}

3. When you change the stylesheet, set the body size:

document.body.style.width = parseInt(divBodySize.currentStyle["width"]);
document.body.style.height = parseInt(divBodySize.currentStyle["height"]);

Method 2 (by rokujou):
Leave the width/height in the body rule and use the following code to set the width/height when the stylesheet is changed:

var bodyStyle = findBodyRule();
if (bodyStyle != null)
{
  document.body.style.width = bodyStyle.style.width;
  document.body.style.height = bodyStyle.style.height;
}

...

function findBodyRule() {
  for (var sheet = 0; sheet < document.styleSheets.length; sheet++)
  {
	for (var rule = 0; rule < document.styleSheets(sheet).rules.length; rule++)
	{
	  if (document.styleSheets(sheet).rules(rule).selectorText == "body")
		 return document.styleSheets(sheet).rules(rule);
	}	
  }
  return null;
}

Bug #36 (variation on Bug#30): begin/endTransition will stop mouse event from firing if the Gadget size isn't changed. In the following Repro, clicking the mouse should display a message. As soon as the first begin/endTransition has occured, mouse events stop firing.

Workaround: Use the same workaround as Bug#30

Repro36.gadget (936bytes)
Number of downloads: 6

Bug #37: System.Shell.Item.isFile generates an error. In the following Repro, a left click should list if the files and folders in the Gadget are a file or not. Right click to use the workaround.

Note: This functionality has been removed in the August 2007 documentation refresh.

Workaround: If isLink and isFolder are both false, isFile must be true:

var oFolder = System.Shell.itemFromPath(<path>);
var oItems = oFolder.SHFolder.Items;

for(var i = 0; i<oItems.count; i++)
{
	if (!(oItems.item(i).isFolder || oItems.item(i).isLink))
		// Must be a file
	else
		// Folder or Link
}

Repro37.gadget (1.7K)
Number of downloads: 4

Issue #38: System.Sound.playSound does not always play the sound. Repro to follow.

Issue #39: Magenta (#FF00FF) in images (JPG, PNG or GIF) becomes transparent. The Repro should display "Transparent" in Magenta, left click to toggle the filter workaround.

Workaround: Either modify #FF00FF in the image to #FF00FE, or display the image twice with a filter applied to convert #FF00FF to #FF00FE:

<img src="<image url>" style="position:absolute; top:0px; left:0px;" />
<img src="<image url>" style="position:absolute; top:0px; left:0px; filter:progid:DXImageTransform.Microsoft.Chroma(Color=#ff00ff) Mask(Color=#ff00fe);" />

Repro39.gadget (1.71K)
Number of downloads: 24

Bug #40 (variation of Bug#32): Overlaying an image with transparency onto a g:background that has Opacity set, will cause the g:background to overlay the image when the Gadget loses focus. ie When the Gadget is docked/undocked, visibility changes, or changes position on the Sidebar.

In the following Repro, dock/undock the Gadget to see the problem.

Repro40.gadget (7.05K)
Number of downloads: 22

Workaround (Jon Abbott/Antoine Cloutier): Set the window focus when the screen position changes or any of the following events fire:

System.Gadget.visibilityChanged
System.Gadget.onDock
System.Gadget.onUndock

eg.

System.Gadget.visibilityChanged = fixFocus;
System.Gadget.onDock = fixFocus;
System.Gadget.onUndock = fixFocus;

// check if the screen position has changed
window.setInterval(checkBug40, 300);

var scrX, scrY;
function checkBug40() {
	if (window.screenTop != scrY || window.screenLeft != scrX) {
		scrX = window.screenLeft;
		scrY = window.screenTop;
		fixFocus2();
	}
}

function fixFocus() { window.setTimeout(fixFocus2, 300) }
function fixFocus2() { window.focus() }

Bug #41: g:image.softEdge is not consistent as the images rotation is changed. The soft edge appears to double in size as the image approaches 45, 135, 225 and 315 degrees. In the following Repro, which rotates a white square, the soft edge should look the same regardless of it's rotation.

Repro41.gadget (1.24K)
Number of downloads: 11

Bug #42: Mouse events do not fire on pixels that are partially transparent. In the following Repro, left click to fire a mouse event. Right click to apply opacity to the background image, which will cause mouse events to stop firing.

Repro42.gadget (1.08K)
Number of downloads: 8

Bug #43: Sidebar does not apply document.body.style.zoom to the Gadget thumbnail image shown on the Settings page. In the following Repro, open the settings page to see the Gadget appear to double in size in the thumbnail (zoom is set to "0.5").

Repro43.gadget (2.66K)
Number of downloads: 5

Bug #44: g:background becomes corrupt when it's changed, when hosting a WPF application. In the Repro Gadget, after adding it to Sidebar, dock/undock it to see what should happen. Then click the background to add the WPF application. Dock/undock will now corrupt the background.

Workaround: Use System.Gadget.background = "..." instead

Repro44_shouldbe.png (22.26K)
Number of downloads: 9 becomes

Repro44_becomes.png (23.31K)
Number of downloads: 5

Repro44.gadget (14.93K)
Number of downloads: 9

Bug #45: g:background.move, g:image.move and g:text.move methods do not exist.

Note: This functionality has been removed in the August 2007 documentation refresh.

Workaround: Manually move the objects by changing their top/left parameters.

g:background:

<g:object>.style.top += y;
<g:object>.style.left += x;

g:text / g:image:

<g:object>.top += y;
<g:object>.left += x;

Bug #46: g:image.addImageObject, g:image.addTextObject, g:image.removeObjects methods do not exist.

Note: This functionality has been removed in the August 2007 documentation refresh.

Workaround: Add the objects to a g:background instead.

(Fixed) Issue #47: System.Gadget.Shell.chooseFile documentation is incorrect.

Note: This issue has been fixed in the August 2007 documentation refresh.

oShellItem = System.Shell.chooseFile( [bForOpen], strFilter [, strInitialDirectory] [, strFileInit])

should read:

oShellItem = System.Shell.chooseFile( bForOpen, strFilter, strInitialDirectory, strFileInit )

Issue #48: Undocked Gadgets on the primary display will move after running a full screen DirectX application (ie games), if they are positioned beyond the applications new resolution.

Workaround: Quit Sidebar before loading the application.

Bug #49: Setting a Gadget's background image via CSS "background-image", can cause the image to lose it's transparency.

Workaround: Set the image via System.Gadget.background or <g:background>.

Issue #50: Resizing a gBackground does not automatically resize any gImage or gText objects it contains.

Workaround: You must manually adjust the top, left, width, height and fontsize properties to reflect the change in size of the background image. Be aware that resizing a gImage object will cause bug#2.

eg. Resize a g:text object

//Syntax: fixText(<g:text object>, <x pos>, <y pos>, <fontsize>, <new Gadget width>, <new Gadget height>, <original Gadget width>, <original Gadget height>)

function fixText(obj, x,y, fs, w,h, ow,oh) {
	if (w != ow) {
		obj.fontsize = fs * (w/ow);
		obj.left = Math.round(x * (w/ow));
		obj.top = Math.round(y * (h/oh));
	} else {
		obj.fontsize = fs;
		obj.left = x;
		obj.top = y;
	}
}

eg. Resize a g:image object

//Syntax: fixImage(<g:image object>, <x pos>, <y pos>, <image width>, <image height>, <new Gadget width>, <new Gadget height>, <original Gadget width>, <original Gadget height>)

function fixImage(obj, x,y, iw, ih, w,h, ow,oh) {
	// *********
	// Workaround bug#2 - http://www.aeroxp.org/board/index.php?showtopic=7318
	if (w != ow)
		obj.left = Math.round(x - ((ow - w)/2));
	else
		obj.left = x;
	
	if (h != oh)
		obj.top = Math.round(y - ((oh - h)/2));
	else
		obj.top = y;
	// *********

	obj.width = iw * (w/ow);
	obj.height = ih * (h/oh);
}

Bug #51: g:text fonts smaller than 18pt are not anti-aliased.

Workaround: If possible, switch to VML or HTML text. VML will give you the ability to rotate the text.

eg. VML text:

<HTML xmlns:v>
<HEAD>
<STYLE>
	v\:*{behavior:url(#default#vml);position:absolute}
</STYLE>
<script language="javascript" type="text/javascript">
	function rotateVMLText(id, rotation) {
		var xn = 1000 * Math.cos(rotation / 180 * Math.PI)
		var yn = 1000 * Math.sin(rotation / 180 * Math.PI);
	
		id.v = "m 0,0 l "+parseInt(xn)+","+parseInt(yn);
	}
</SCRIPT>
</HEAD>
<BODY onload="rotateVMLText(bodyTextVML, -10)" style="width:200px; height:200px;">
	<v:shape id="bodyTextShape" style="position:absolute; top:100px; left:100px; width:100%; height:100%; antialias:true;" coordsize="0,0">
			<v:path id="bodyTextVML" textpathok="True" />
			<v:fill on="True" color="#ff0000"/>
			<v:stroke on="false" />
			<v:textpath on="True"
				text-align="center"
				font = "normal normal normal 16 'Times New Roman'"
				string = "My Text Value Here" />
	</v:shape>
</BODY>
</HTML>

Repro51.png (11.84K)
Number of downloads: 10

Repro51.gadget (1K)
Number of downloads: 11

Bug #52: Gadgets that play streamed media may become untrusted. Symptoms include the inability to access variables from the Flyout/Settings and Gadget and "Permission Denied" errors when accessing local content.

Partial workaround: Mark all your HTML as being in the local domain with a Mark of the Web, by placing the following code at the top of your HTML files:

<!-- saved from url=(0014)about:local -->

NOTE: The MOTW must be invalid for this workaround to work.

Issue #53: Setting a DOCTYPE can cause a Gadget to scroll within its window when a scroll event occurs, if the document body margin style is not set to 0. Events such as middle mouse button scrolling (horizonal or vertical) can cause the issue.

Workaround: Either set margin to 0, or unless you specifically need to set the DOCTYPE for strict adherance etc. remove it.