Отладка скриптов в Internet Explorer

27 мая 2010, обновлена 09 января 2011

Отладка сайтов под IE всегда была для меня пугающим занятием. Причем проблемы с версткой хотя бы можно отслеживать по внешнему виду сайта, а вот ошибки в скриптах IE показывает весьма эзотерически.

Во-первых, где взять нужную версию Internet Explorer? Есть два пути – использовать мутантский набор движков типа IETester или IE Collection, или развернуть несколько виртуальных машин под каждую нужную версию Internet Explorer. Первый путь мне никогда не нравился, хотя бы из-за кучи проблем с совместимостью и потенциально неверного отображения сайтов в разных версиях.

Потому будем настраивать виртуалки. К счастью, достаточно настроить только первую – остальные можно наклонировать.

Создаем виртуальные машины

  1. Скачиваем и устанавливаем VirtualBox.
  2. Создаем виртуальную машину IE6. Ей нужен будет диск размером 2 Гб и порядка 512 Мб памяти. Еще ей нужны будут два сетевых адаптера – NAT и Host-Only – первый послужит для выхода в интернет, второй – для связи с хостом (и, если сервер на другой виртуальной машине, с сервером).
  3. Находим образ Windows XP Home SP3. Замечу, что SP3 не обновляет IE6 до IE7 самостоятельно.
  4. Убираем все лишнее из установки. Если места на диске не жалко, можно обойтись и без этого шага.
    1. Распаковываем образ каким-нибудь 7-zip.
    2. Скачиваем nLite — инструмент для пересборки образов XP.
    3. Скачиваем мой конфиг для nLite — он вырежет из образа все, кроме необходимого.
    4. Прогоняем распакованный образ через nLite, получаем ISO размером порядка 200 мегабайт.
  5. Подключаем образ к виртуалке, устанавливаем Windows – тут ничего особенного.
  6. Подключаем к виртуалке образ VirtualBox Guest Additions, чтоб получить разделенный с хостом буфер обмена, курсор, возможность растягивать окно-экран виртуалки и т.п. удобства.
  7. Ставим Adobe Flash Player, Java Runtime, Notepad++ для просмотра исходников.
  8. По желанию ставим на виртуалку какой-нибудь CCleaner, чтоб поубирать мусор.
  9. Базовая виртуалка готова. Можно ее выключить, а образ диска запаковать в архив и отложить – может, пригодится когда-нибудь.
  10. Клонируем образ (обычным копированием тут не обойтись):
    "C:\Program Files\Sun\VirtualBox\VboxManage.exe" clonevdi ie6.vdi ie7.vdi
  11. Создаем новую виртуалку, IE7, с теми же настройками, подключаем к ней склонированный образ. Рекомендую указать статический IP для Host-only соединения (в виртуалке это LAN Connection 2) – естественно, на каждой виртуалке разный. Помимо этого я в c:\windows\system32\drivers\etc\hosts указываю домен для сервера.
  12. На виртуалку для IE7 скачиваем и устанавливаем IE7.
  13. Готово!

Инструментарий

Для адекватной отладки JavaScript нужно установить Script Debugger (ну и пусть говорят, что он устарел – альтернатив нет), а потом CompanionJS. И еще отключаем Disable JS Debugging на вкладке Advanced настроек IE (хитрая такая опция). Получаем некое подобие Firebug.

Можно поставить и другие инструменты, хотя бы IE Developer Toolbar для отладки верстки.

Вот и все – имеем работающий IE, независимый от базовой ОС, с возможностью удобно отлаживать скрипты.



Шесть комментариев. Напиши еще один
  1. 499dc366286784cc24ca8cb357c1290e # 29 мая 2010 Александр Зайцев написал:

    Круто, спасибо :–)

  2. 5efc366776022d28d9a1a6d2828f6fa8 # 31 мая 2010 Алексей Иванкин (908.ua) написал:

    Прикольно, но мы в 908 ровно неделю назад склонировали свою ie6 машину в ie7, а ту – в ie8. Правда у нас VirtualBox под линуксом, все работают через Remote Desktop. Ну и небольшой патч, чтобы несколько пользователей одновременно работало.

  3. Ef38cac55549c5f7fcfab0bc4ee83959 # 03 июня 2010 Vii написал:

    А можно по-подробнее про hosts? У меня на одной виртуальной машине стоит dev-сервер, на 2-х других XP с зоопарком win-браузеров (по-хорошему надо еще одну для ie8). Немного поднадоело для каждого нового проекта добавлять новую строку в hosts, это можно как-то оптимизировать?

    P.S. А 200-мегабайтным образом XP не поделитесь (nLite к сожалению только под Win)?

    1. 777894ea5153122bfa6b83f5bbf23622 # 04 июня 2010 Леонид Шевцов (автор) написал:

      Можно на dev-сервере настроить проксирующий DNS, а остальные виртуалки (да и реальную машину тоже) упереть в него: http://www.alepe.com/about_computers/about_linux/simple_intranet_dns_server_in_linux.html

  4. 2c660812247fa92865e454a4dd009413 # 26 августа 2010 Артем написал:

    Фига вы ребята придумали , а не проще IETESTER использовать?

    1. 777894ea5153122bfa6b83f5bbf23622 # 27 августа 2010 Леонид Шевцов (автор) написал:

      Конечно, проще IE Tester. Но это всего лишь хак, и окружение IE он воспроизводит не до конца, в отличие от виртуалки.

(нужна разметка?)

  • **жирный**
  • > цитата

отменить