Install IE6 and IE7 on the Same Machine Using VirtualBox for Cross Browser Testing

So what does this post have to do with Thesis? Well, not too much really. But I thought it might be useful for you if you’re a web designer and you want to test your sites in different browsers. In particular, the ghastly IE6 and IE7. It’s truly the bane of a web designer’s life. Dealing with the horrendous rendering issues of these browsers.

Should you even support IE6?

Well, up to you. If your client demands it, then I guess so. Or just don’t take on clients who do. Personally, I don’t support it about 95% of the time. Enough has been written about IE6, so it’s pointless rehashing things here. Suffice to say, it’s basically the most repulsive browser out there and the fact that people still use it is beyond me. The same goes for IE7, and in my opinion, IE8 isn’t that much better.

Cross browser testing

So, as you know, there are a ton of options for testing your websites across multiple browsers. Here’s just one post of many, this one from Smashing Magazine on cross browser testing. I’ve tried to work with a few of them and none have really cut it for me. The one that I’ve used most often is IE Tester, but a few days ago, I started looking for alternatives because I found that it crashes often and I constantly have trouble trying to open an IE7 tab in it.

So this led me down a path to try and find the best solution for testing the sites I develop in IE6 and IE7. For the other browsers you can just install the browser on your computer. By the way, I’m using Windows 7.

Using VirtualBox to test websites in IE6 and IE7

Aside from VirtualBox, there are other virtual environments like Windows Virtual PC where you can run XP mode in Windows 7. And there’s also VMWare. Virtual machine software basically emulates a PC on your real PC. You can run any other OS within a virtual machine environment.

Testing your web application in Internet Explorer is way more difficult than it ought to be. As far as I know, you can’t install IE6, IE7 and IE8 on a single OS. So, if you’re not in the mood to get 3 individual PC’s for your testing, here’s the solution I found works best.

Let’s get into the tutorial. What we’re going to do is install VirtualBox, and then configure a new virtual machine on which you can install Windows XP. By the way, you can always refer to the official documentation for complete installation instructions. I’m just giving you the settings and steps I followed to help shortcut the process.

Step 1: Download & Install VirtualBox

Download the VirtualBox software under the “Binaries” section for your OS. After downloading, go through the installation steps. Just use the defaults. I had trouble with the installation when I elected to install the USB drivers. You can deselect that option during installation as you don’t need it.

Step 2: Create a New Virtual Machine

After the application has been installed, you need to create the virtual machine onto which you will install XP and the IE browsers for testing your websites. So, run the program and click the “New” icon at the top.

Click “Next” and give your virtual machine a name. This will identify the machine in the list of machines you have installed. As an example, I called one of mine “WinXP-IE6″. Also, select the operating system and version in the drop downs that you will be installing.

Click Next, and enter the memory you wish to allocate to this new virtual machine. Keep in mind that while the VM is running, it will use the memory you allocate to it from your host machine. I allocated 512MB when I set this up myself. I have a total of 6GB system memory. According to the official installation instructions, it says that as a rule, if you have 1GB or more of RAM on your host machine, then it’s safe to allocate 512MB. I did, and it works great.

For the next step, you will need to create the virtual hard disk. This ends up being a file on your hard drive. No big deal.

Just continue through the wizard that helps you set up the virtual hard drive. When you get to the screen prompting you for the Hard Disk Storage Type, read more about each of the options and decide for yourself. I went with the default “Dynamically expanding storage”.

Then on the next screen, you can go with the default settings. I used the default location and also left the size at 10GB. At this point, you’ll see a summary of your settings, so go ahead and click next and complete this setup.

You new virtual machine is now configured and will look something like this:

Step 3: Install The Operating System

When you click the “Start” link in the menu, the program will “boot” into your new virtual machine. Now since you don’t have any operating system installed, you will be prompted to select a medium to install an operating system from. In most cases, this will either be a CD or DVD or you might have an ISO image, which VirtualBox can then present to the virtual machine. I had an old XP CD, which I inserted into the drive, and it responded just as it would have if I’d started installing XP on a stand alone PC.

For the most part, you can use the virtual machine much like you would a real computer. The first time you see this can be quite trippy. You basically have an entirely new PC operating out of it’s own window on your computer.

Step 4: Install Your Browser

XP comes with IE6 so you’re good there but you can download the browsers from these links:

• IE6
• IE7

So you end up with a virtual stand alone machine running IE6 or 7, or whatever browser you choose to install. And you can use this for testing your websites in these browsers and other cross browser testing. Of all the methods I’ve tried in the past, I’ve found this one to be the best.

I recommend you read the official documentation for more information about VirtualBox. Here’s some other links that may be useful for you:

• Internet Explorer Disc Images
• Sitepoint article

Tagged as: Cross Browser Testing, web design