Let Karma run JavaScript tests on Internet Explorer 11 in Windows with VirtualBox on Mac OS X

virtualbox-ie11-win.md

Follow these steps to let Karma run your specs on IE11 on your Mac.

1. Download and install Oracle VirtualBox for Mac.

2. Download the IE11 Win8 VM at https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/

To unzip, run:

cd ~/Downloads
ditto -x -k IE11.Win81.VirtualBox.zip IE11.Win81.VirtualBox

Double-click the uncompressed file to import it into VirtualBox. Accept all the default settings.

With the image still powered off, from the VirtualBox menubar click Machine, Settings, "Storage" tab.

Click the floppy disk + icon to Add a new Optical Drive, and click "Leave Empty".

Run the image from the VirtualBox UI. Wait for the image to full start.

From the VirtualBox menubar, click Devices, Insert Guest Additions CD Image... Ignore any Windows popups, you will manually install Guest Additions next.

Inside Windows, hit Ctrl+Esc and run "cmd".

From the Windows command prompt, run:

D:\VBoxWindowsAdditions.exe /with_autologon

Reboot Windows when prompted.

From the VirtualBox menubar, click Machine, Take Snapshot and call the snapshot "pristine".

Test that the machine is working. Run this command in a "cmd" window:

VBoxManage list vms

(note the UUID, and substitute it for the UUID in the next command)

VBoxManage guestcontrol 78e4588b-c56a-4795-8420-8a8e814f44b3   --password Passw0rd! --username IEUser run   --exe "C:\\Program Files\\Internet Explorer\\iexplore.exe"   --wait-stderr --wait-stdout -- -extoff -private http://www.google.com

3. Download "MSEdge on Win10 (x64) Stable" VirtualBox image from https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/ (it contains IE 11)

To unzip, run:

  cd ~/Downloads
  ditto -x -k MSEdge.Win10.VirtualBox.zip MSEdge.Win10.VirtualBox

Double-click the uncompressed file to import it into VirtualBox. Accept all the default settings.

Follow the same steps in step #2 to set up the image.

Side note, here is a command to parse the UUID out of a VM given the human-readable name of the image:

VBoxManage list vms | grep "IE11 - Win81" | sed -n "s/^.*{\(.*\)}.*$/\1/p"

4. Your VM is now configured. All that remains is to tell Karma how to use it.

Configure your karma.conf.js as follows.

This configuration uses a modified version of karma-virtualbox-ie11-launcher to allow you to specify the human-readable name of the IE11 VirtualBox VM. To get this version, npm install https://github.com/rkuzsma/karma-virtualbox-ie11-launcher, or wait for the open PR to land on the official npm module.

module.exports = function (config) {
  config.set({
    browsers: [
      'VirtualBoxIE11onWin10',
      'VirtualBoxIE11onWin8'
    ],
    customLaunchers: {
      VirtualBoxIE11onWin10: {
        base: 'VirtualBoxIE11',
        keepAlive: true,
        snapshot: 'pristine',
        vmName: 'Edge'
      },
      VirtualBoxIE11onWin8: {
        base: 'VirtualBoxIE11',
        keepAlive: true,
        snapshot: 'pristine',
        vmName: 'IE11 - Win81'
      }
// ...