Inner Solace

HOWTO: IE Testing on OSX

Most frustrating thing ever: Trying to do cross-browser compatibility testing for Internet Explorer when you primarily develop on OSX.

If you want to do cross-browser testing for multiple versions of IE without having to create your own multiple installs of Windows for Bootcamp/Fusion/other, weird emulator hacks or inconsistent ‘compatibility’ modes, or remoting into several different boxes, then you will want to see this.

Microsoft provides a number of Virtual PC hard disk images of the different versions of IE on different versions of Windows that you can use for just such a purpose.  This is awesome.  Except for the following:

1. Virtual PC isn’t supported on Intel Macs only PowerPC.
2. The latest release of updated VPC images ceases to work on anything other than VPC (eg. VMWare Fusion, Parallels, VirtualBox…) because it now detects ‘hardware’ changes and demands that you reactivate your copy of Windows. In addition, the EULA of these says you’re not supposed to be using it on anything other than Microsoft Virtual PC anyway (more on this).

And for crazy people like me who were desperate enough to consider running VPC on a Windows emulator to run the virtual machines (meta meta meta), apparently that causes a whole other world of pain.

Anyway, after much digging I found someone who had figured this out!  Hurray! And it works. MFYAY!  It’s not the simplest solution, but it works. Which is what is important.

You will want to follow this article by Andrew Odri with the following changes:

1. Skip the stuff about The Unarchiver.  You need to extract the files from the image exe files, but you can do that by running your unarchiver of preference on that file. StuffIt Expander happily does it, but if your unarchiver doesn’t like .exe, rename it to .rar and try again.
2. In Step 6 where you have to run qemu-img, that’s two separate commands.  It’s the qemu-img command, and there’s a VBoxManage command.  It’s not one long command that wraps across two lines.  You probably didn’t need this instruction, but I’m silly that way.
3. Read this guy’s comment about stuff to do before Step 7 and 7.9 to get around the activation problem. That link he provided doesn’t work any more, so you’ll have to figure that one out yourself.  But you don’t have to burn it to a CD to mount it, just create an ISO (using these instructions by Jon Todd), and mount that as a CD/DVD image in VirtualBox.

Extra Notes:

I had attempted to import the image into VMWare Fusion (using the built in importer) to begin with, but the imported and converted VPC image kept blue-screening which is why I ended up having to use this method with VirtualBox.  These instructions may still work using VMWare Fusion if you use qemu to convert the image, but I can’t confirm.

douchebag programmers

The following may not make sense to you if you’re not a developer. I am sorry about that, but I need to vent. :P

So… I’m using this third party library.  At the moment I am invoking its initialisation call inline in each of the pages that needs it.  The call is the same each time, and it’s huge because one of the parameters is a nice long hash that specifies the settings required.

I tried to be a good little programmer and turned this into a function so that I can load it once, and call it as many times as I like without having to duplicate the code.  But it won’t work.  The page starts to load, then it halts, blanks the page then appears to load indefinitely.

After a bit of troubleshooting to make sure I didn’t cause the problem myself, I decided to search the library forums to see if someone else had encountered the problem.  Someone else had.

This someone else described the problem, and explained what had happened when they tried to use Firebug to identify the problem. The primary dev replied, in a tone which could be construed as a little snarky, that the OP should use Firebug.

I imagine that the OP was feeling a bit like myself at the point, frustrated and going a little insane with trying to resolve this problem.  But the OP started getting upset in the forum because the primary told him to do what he said he already did in his previous post.

In response, the primary replied that he knows what’s wrong, but won’t provide the answer because he felt the OP was being rude.

At this point, I started to sob because now the primary was going to be as big of a douche as he felt the OP was being by denying everyone else the solution to this problem.

The thread later described some solutions and workarounds, but reading that response from the primary made me very very sad.

Brewing a Better Rating System

(via yongfook)

A very cool rating system.  I’m a fan.  And it’s a tea related site too. Bonus!

steepster:

Hey there tea drinkers, we just rolled out some updates to Steepster! For one, you can now specify things like steep times and temperatures in your tasting notes. Another highly requested change is a finer rating system, something we’ve been trying to figure out for a while. We think we’ve come up with a pretty neat solution and wanted to walk through some of the decisions we made.

The Old System

When we first launched Steepster, we weren’t totally sure how people were going to use it. We knew how we wanted to use it, but it’s the little details like…

• “How long would the typical post be?”
• “Would they be more or less review-oriented?
• “Longer and blog-like? Shorter and twitter-like?”

We wanted to wait until we got a better sense of the direction the site before committing to anything too specific. That’s why we erred on the side of quicker, simpler interactions — thumbs up if you liked the tea, thumbs down if you didn’t — thinking that it’d be easier to go narrow as time went on (versus the other way around).

This worked okay for a while, but when we ran the numbers, we saw that ninety-some percent of the teas were getting positive ratings. Now we all know that tea in general is pretty darn good ;) but we still needed to separate the really good from the sorta, kinda good. So we looked at some other options:

5-Star Ratings

They’re easy to understand and they’re everywhere. You get what they are immediately and they’re good for comparing good things to bad things. However, a 5-point scale starts to break down when you’re rating a lot of similar products that are all pretty decent.

It turns out that the average rating for products on sites with 5-star scales is around 4.3. To us, this says that we need to dive deeper — zoom in to a level where it’s clear what the difference is between a really great tea and the best tea you’ve ever had.

100-Point Ratings

I bet there are quite a few out there who can rank every tea they’ve tasted in order of preference the way Rob Gordon knows his record collection in High Fidelity. We noticed that some of you already use such scales on your own websites and blogs. At the same time, 100-point scales can feel daunting to those that are just getting to know tea. Steepster’s about connecting both tea fanatics and new tea drinkers, so we didn’t want to alienate the beginners. We were all newbies at some point :)

Alternative Rating Systems

One idea we had early on was to use smiley faces instead of stars. This way, it was clearer what each rating meant:

We really liked this approach, but realized it was still just a four-point rating system and didn’t quite have the range needed.

Letting it Slide

In the end, we tried to capture the benefits of all the different systems: the granularity of the 100-point scale, the ease of the star rating system, and the built-in meaning of the smilies. Here’s what we came up with:

Who doesn’t like sliders? Behind that slider is a full 100-point scale. Still one problem though: when you write a tasting note for a new tea, you don’t want to have to go back and look up what you rated your other teas. That’s why we added something else:

See those tick marks? We’re taking a few of your most recently rated teas and using them as markers on the slider, giving you a frame of reference for the new tea. They show up when you drag the slider over them or when you hover over the tick marks with your mouse cursor:

We hope this will not only answer the question just how good? but also the question compared to what?

Here’s the full, updated form that pops up when you go to write a new tasting note:

Transitioning Old Ratings

You’ll also see a new ‘Teas’ tab on your tealog page where you can quickly update all the teas you’ve rated to the new scale. Click on a rating and you get a compact version of the slider:

We’ve converted the old thumbs down ratings to 25s and thumbs up ratings to 75s to help you get started, so please go in and update the ratings for teas you’ve logged. It’ll help us keep the overall ratings accurate. Thanks!

As always, there’s still a ton of room for improvement, but we feel like this is pretty big step forward. So what do you think? Thumbs up or down?

Would someone please make the cross-browser compatibility testing pain stop.

I think my eyes are drying out.

Clearing floats in IE7

If you ever needed to use floats in CSS, odds are you needed to clear them at one point.  The oldskool way was to add structural markup which would display nothing but still occupy space.  Something to the effect of:

<div style="clear: both; height: 1px">&nbsp;</div>

You could put that style in a class but it’s still far from elegant and you end up with markup with in effect, does nothing at all.  And it’s messy. Messy, messy, messy.

Using :before and :after selectors, you can pretty much do the same thing invisibly and you don’t need anymore steenking structural debris.  But, this isn’t supported by IE7 and below. Rarrrgh[1].

What you can do for IE I found in this article at Stuff and Nonsense.  In summary, in the CSS for the element you want to clear, add:

overflow: hidden;
zoom: 1;

But you’ll need to add the zoom stuff to an IE specific stylesheet, or using conditional statements inline or your CSS won’t validate.

The reason it works is because the zoom attribute triggers some event/attribute called “hasLayout” in IE4+.  From this point on, this is voodoo to me, but if you want to know what it does, it’s explained on MSDN.

[1] You can probably tell from the tone and style in which I have written this post that I’m probably going a little crazy… That’s working with IE for you.