As of my time of writing, I am using a mid-2017 MacBook Pro on Catalina. (ymmv)
Prerequisites:
The app should already be provisioned to support Angular on IE 11, or the login page may not render.
If you plan on testing locally, then your app should already be running localhost:4200
on your machine.
If this still doesn’t work, there may be a firewall, VPN or other things preventing you from accessing localhost, in which case you are probably better off accessing a deployed version at a stable url
Now you need:
at least 10GB of free hard disk space
download VirtualBox for Mac OS
Download the VirtualBox file at this free Microsoft VM page
Unarchiver for unzipping the file above
patience (your computer may heat up and run slow. this VM doesn’t allow copy and pasting… etc etc)
Install VirtualBox in your applications
Unzip the
MSEdge-Win10-VMware
file.Open VirtualBox
Setting up the virtual machine
- Click “New”
Select “Windows 10”
Click “Continue”
Select 2048MB RAM and click “Continue”
- Select “Use an Existing Virtual Hard Disk File” and find the
.vmdk
in the VM file you just downloaded
The vm disk image is now imported!
Configure the VM
Right-click “IE Edge” or whatever you named it, and click on “Settings”.
Under “Networks” > Adapter 1 you may select “NAT” or “Nat Network”
Under System > Motherboard, set “Pointing Device” to USB Tablet
Click “Start” in the Virtual Box GUI, or “Run” to start the VM
Get the env showing up on localhost
Open Command Prompt and type ipconfig
. Make note of the last line. Mine says 10.0.2.2
To get IE 11 to show localhost on our windows VM, go to the File searcher in the lower left hand corner and right-click “NotePad” to “Run As Administrator”.
Click Yes.
When Notepad opens, open C:\Windows\System32\drivers\etc\hosts.conf
Add 10.0.2.2
localhost to the last line of the Notepad file you opened, and save the file (not as a .txt
, just agree to overwrite the original)
Open IE 11 and hopefully, you see the app in http://10.0.2.2:4200
Tips:
Command + E to take a screenshot of the VM desktop.
A snapshot is not a screenshot. This creates a tiny copy of the state of the machine so that you can boot it up. Pretty useful for trying to keep this on beyond the 90 day free use.
For other ideas on how to get IE 11 for cross-browser testing on a Mac, check out:
Top comments (2)
Hey Jen nice article, I see you have also provided an article on "Challenge: Cross-browser testing for IE11 and IE Edge on Mac for free" at the end. Comprehensive article on the subjects.
Just to add more here, would like to highlight this article "How To Use Virtual Machines for Cross Browser Testing of a Web Application"
It's always the hardest on your computer... if your company gives you a crappy computer :laugh: