Как включить отладку сценариев в microsoft edge

Обновлено: 04.07.2024

JavaScript – это язык программирования, придающий страницам в сети интерактивность. Например, в социальных сетях он позволяет ставить лайки, оставлять комментарии, подписываться на каналы и так далее. Если его отключить, некоторые сайты будут работать некорректно или даже не станут загружаться. Поговорим о том, как можно включить JavaScript в браузере Microsoft Edge

Как включить JavaScript в браузере Microsoft Edge

Раньше этот параметр можно было изменить, но сейчас, видимо, разработчики установили отображение скриптов по умолчанию без возможности их отключения. Расскажу о том, как ранее запуск сценария JavaScript можно было изменить.

Для начала нужно было вызвать окно «Выполнить» нажатием на комбинацию клавиш Win + R. Далее следовало ввести запрос gpedit.msc и активировать его нажатием на клавишу Enter или кнопку ОК.

Ввожу запрос в окне «Выполнить» и запускаю процесс нажатием на кнопку ОК Ввожу запрос в окне «Выполнить» и запускаю процесс нажатием на кнопку ОК

Должно открыться окно «Редактор локальной групповой политики». Необходимо было перейти по следующему пути: Конфигурация компьютера, Административные шаблоны, Компоненты Windows, Microsoft Edge. В правой части отображается список элементов, среди которых следовало найти «Позволяет запускать сценарии JavaScript» и открыть его двойным кликом кнопкой мыши по нему. Как видно на скришноте, сейчас этого пункта просто нет.

Если же этот пункт отобразился, то после нажатия по нему открылось бы следующее окно. В нем необходимо было переключить значение параметра на «Включено», применить параметр и кликнуть по кнопке ОК для выхода.

Возможно, этот параметр действовал только в первой версии браузера Microsoft Edge Возможно, этот параметр действовал только в первой версии браузера Microsoft Edge

Напоследок компьютер требовалось перезагрузить для применения измененных настроек. После открытия браузера все должно было работать исправно.

Заключение

Я вполне допускаю, что данного параметра просто не бывает в сборке системы, установленной на моем компьютере. Возможно, в других версиях, более ранних, он присутствует. И чтобы все сайты загружались нормально, потребуется внести некоторые корректировки.

В этой статье рассказывается об основных процессах отладки любых проблем JavaScript в DevTools.

Шаг 1. Воспроизведение ошибки

Поиск ряда действий, которые последовательно воспроизводят ошибку, всегда является первым шагом к отладки.

Выберите следующую ссылку Open Demo и откройте веб-страницу на новой вкладке. Чтобы открыть демонстрацию на новой вкладке, выберите и Ctrl удерживайте (Windows, Linux) или Command (macOS), а затем выберите Open Demo.

5 Введите текстовое поле Номер 1.

1 Введите текстовое поле Номер 2.

Выберите Добавить номер 1 и Номер 2. Метка ниже кнопки говорит 5 + 1 = 51 . Результат должен быть 6 . Затем исправьте ошибку добавления, которая является ошибкой.

5 + 1 результат в 51, но должен быть 6

5 + 1 результаты, 51 но должны быть 6

Шаг 2. Знакомство с пользовательским интерфейсом инструмента Sources

DevTools предоставляет множество различных инструментов для различных задач. Различные задачи включают изменение CSS, профилирование производительности загрузки страниц и запросы на мониторинг сети. Средство Sources — это место, где отламываю JavaScript.

Чтобы открыть консольный инструмент в DevTools, выберите Control + Shift + J (Windows, Linux) или Command + Option + J (macOS).

Средство Консоли

Средство Консоли

Выберите средство Sources.

Средство Источники

Средство Источники

Пользовательский интерфейс средства Sources имеет три части.

3 части пользовательского интерфейса инструмента Sources

3 части пользовательского интерфейса инструмента Sources

  • Области Navigator (в верхнем левом углу). Каждый файл, который запрашивает веб-страницу, указан здесь.
  • Области редактора (в верхнем правом углу). После выбора файла в области Navigator эта области отображает содержимое файла.
  • Области Debugger (в нижней части). Эта области предоставляет средства для проверки JavaScript для веб-страницы. Если окно DevTools широкое, эта области отображается справа от области редактора.

Шаг 3. Приостановка кода с помощью точки разрыва

Распространенный метод отладки этого типа проблемы — вставить несколько заявлений в код, а затем проверить значения по мере console.log() работы сценария. Пример:

Метод console.log() может получить работу, но breakpoints получить его быстрее. Точка разрыва позволяет приостановить работу кода в середине времени работы и вовремя изучить все значения. Точки breakpoints имеют следующие преимущества по сравнению с console.log() методом.

Короче говоря, breakpoints может помочь вам найти и устранить ошибки быстрее, чем console.log() метод.

Если вы отойдетесь и подумайте о том, как работает приложение, вы можете угадать, что неправильная сумма () вычисляется в прослушиватель событий, связанный с кнопкой Добавить номер 1 и Номер 5 + 1 = 51 click 2. Таким образом, вероятно, необходимо приостановить код во время click прослушивания. Breakpoints listener event let you do exactly that:

В области Debugger выберите точки breakpoints для прослушивания событий, чтобы расширить раздел. DevTools открывает список расширяемых категорий событий, таких как Animation и Clipboard.

Рядом с категорией событий Мыши выберите Расширение DevTools показывает список событий мыши, таких как щелчки мыши и мыши. Рядом с каждым событием имеется почтовый ящик.

Выберите почтовый ящик рядом, чтобы щелкнуть. DevTools теперь настроен на автоматическое приостановление при запуске любого click прослушиватель события.

Выберите контрольный ящик рядом с кнопкой мыши

Выберите контрольный ящик рядом с кнопкой мыши

Возвращаясь к демонстрации, выберите добавить номер 1 и номер 2 снова. DevTools останавливает демонстрацию и выделяет строку кода в средстве Sources. DevTools следует приостановить на строке 16 в get-started.js .

Если вы приостанавливлить другую строку кода, выберите выполнение сценариев возобновления (возобновление выполнения скриптов) до остановки правильной строке.

Если вы остановились на другой строке, у вас есть расширение браузера, которое регистрирует слушателя событий на каждой click веб-странице, которую вы посещаете. Вы приостанавливована click в прослушиватель расширения. Если вы используете режим InPrivate для просмотра в закрытом режиме, который отключает все расширения, вы можете каждый раз приостанавлить нужную строку кода.

Breakpoints слушателя событий — это только один из многих типов точек разрыва, доступных в DevTools. Запомните все различные типы, чтобы помочь вам отлачивать различные сценарии как можно быстрее. Чтобы узнать, когда и как использовать каждый тип, см. в этой ссылке Приостановка кода с точками остановок.

Шаг 4. Прошаговка кода

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

Выберите шаг по следующему вызову функции DevTools запускает следующий код, не вступая в него.

DevTools пропускает несколько строк кода. Это потому, что оценивается как ложное, поэтому блок кода для заявления inputsAreEmpty() if не работает.

В средстве Источники DevTools выберите Шаг в следующий вызов функции (Шаг в следующий вызов функции ), чтобы выполнить время работы функции по одной строке за updateLabel() раз.

Просмотр одной строки за один раз — это основная идея пошаговая проверка кода. Если просмотреть get-started.js код, ошибка, вероятно, находится где-то в updateLabel() функции. Вместо того, чтобы перешагировать каждую строку кода, вы можете использовать другой тип точки разрыва, чтобы приостановить код ближе к вероятному расположению ошибки.

Шаг 5. Установите точку разрыва кода

Разрывные точки line-of-code являются наиболее распространенным типом точки разрыва. При подъехав к определенной строке кода, необходимо приостановить, используйте точку разрыва кода.

Посмотрите на последнюю строку кода в updateLabel() :

Слева отображается число этой определенной строки кода в качестве 34. Выберите строку 34. DevTools отображает красный значок слева от 34. Красный значок указывает, что в этой строке находится точка разрыва строки кода. DevTools всегда останавливается перед запуском этой строки кода.

Выберите выполнение скрипта Resume Скрипт продолжает работать до тех пор, пока не достигнет строки 34. На строках 31, 32 и 33 DevTools печатает значения , и справа от полу-двоеточия на addend1 addend2 каждой sum строке.

DevTools приостанавливовка на точке разрыва кода на строке 34

DevTools приостанавливовка на точке разрыва кода на строке 34

Шаг 6. Проверка переменных значений

Значения , addend1 и addend2 выглядеть sum подозрительно. Значения завернуты в кавычках. Эти цитаты означают, что это значение — строка, которая является хорошей гипотезой для объяснения причины ошибки. Дополнительные сведения о ситуации. DevTools предоставляет множество инструментов для изучения переменных значений.

Метод 1. Область области

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

Область области

Область области

Метод 2. Просмотр выражений

В области Watch можно отслеживать значения переменных (например) или выражений sum typeof sum (например). Вы можете хранить любое допустимые выражения JavaScript в watch Expression.

  1. Выберите области Часы.
  2. Выберите Выражение Добавить часы часов).
  3. Введите typeof sum .
  4. Нажмите Enter . Отображает DevTools typeof sum: "string" . Значение справа от толстой кишки является результатом выражения часов.

На следующем рисунке выражение typeof sum watch отображается в области Watch. Если окно DevTools широкое, в области Debugger отображается экран Watch, который затем отображается справа.

Области Часы

Области Часы

Как подозревается, оценивается как sum строка, когда она должна быть номером. Теперь подтвержден тип значения является причиной ошибки.

Метод 3. Консоль

Консоль позволяет просматривать console.log() выходные данные. Вы также можете использовать консоль для оценки произвольных заявлений JavaScript, пока отладка приостанавливается в заявлении кода. Для отладки можно использовать **** консоль для тестирования возможных исправлений ошибок.

Если средство консоли закрыто, выберите Esc его открытие. Консольный инструмент открывается в нижней области окна DevTools.

В консоли введите parseInt(addend1) + parseInt(addend2) . Заявление, в котором инструмент приостанавлитована, находится на строке кода, где addend1 addend2 и находятся в области.

Нажмите Enter . DevTools оценивает заявление и отпечатки, что является результатом, который вы 6 ожидаете, что демо-версия будет производиться.

Средство Консоли после оценки parseInt (addend1) + parseInt(addend2)

Средство Консоли после оценки parseInt(addend1) + parseInt(addend2)

Шаг 7. Применение исправления

Мы определили возможное исправление ошибки. Затем отредактировать код JavaScript непосредственно в пользовательском интерфейсе DevTools, а затем перезапись демонстрации, чтобы проверить исправление следующим образом.

  1. Выберите выполнение скрипта Resume
  2. В области Редактор замените строку var sum = addend1 + addend2 на var sum = parseInt(addend1) + parseInt(addend2) .
  3. Выберите Control + S (Windows, Linux) Command + S или (macOS), чтобы сохранить изменения.
  4. Выберите деактивационные точки разлома разлома). Он изменяется синим цветом, чтобы указать, что параметр активен. В то время как задаваются точки деактивации, DevTools игнорирует все задаваемые точки.
  5. Попробуйте демонстрацию с разными значениями. Демо теперь вычисляется правильно.

Этот рабочий процесс применяет исправление только к локальной копии кода, отправленного с сервера. После отладки проекта после определения исправления необходимо применить это исправление к коду на сервере, например, отредактировать локальный исходный код, а затем повторно развернуть фиксированный код на сервер.

Дальнейшие действия

Поздравляем! Теперь вы знаете, как сделать большую часть Microsoft Edge DevTools при отладке JavaScript. Инструменты и методы, которые вы узнали в этой статье, могут сэкономить бесчисленные часы.

В этой статье подемонстрировалися два способа установить точки разрыва. DevTools также предоставляет способы задать точки перерывов, чтобы приостановить код при определенных условиях, таких как:

  • Условные точки разрыва, которые срабатывает только при условии, которое вы предоставляете, является верным.
  • Breakpoints on caught or uncaught exceptions.
  • Точки взлома XHR, срабатывающие при совпадении запрашиваемого URL-адреса с подразрядом, который вы предоставляете.

Дополнительные сведения о том, когда и как использовать каждый тип, перейдите к паузе кода с точками остановок.

Несколько элементов управления шагами кода не объясняются в этой статье. Дополнительные сведения можно найти в статье "Использование функций отладки".

См. также

    . Использование пользовательского интерфейса отладки в средстве Источники. — представляет отладка JavaScript и редактор кода.

Некоторые части этой страницы представляют собой измененные материалы, созданные и предоставленные корпорацией Google. Их использование регулируется условиями, описанными в лицензии Creative Commons Attribution 4.0 International License. Оригинальная страница находится здесь и является автором Kayce Basques (технический писатель, Chrome DevTools & Маяк).

Эта работа предоставляется в рамках международной лицензии Creative Commons Attribution 4.0 International License.


Клиентский сценарий вложен в ASPX страницу. HTML-файлы или внутрь . JS файлов. Вообще, сценарий на стороне клиента загружается из клиентского приложения,такого как Internet Explorer, работающего на локальном компьютере.
Есть два способа, в которых можно отлаживать сценарии на стороне клиента в Visual Studio 2005. К ним относятся:
Visual Studio. NET IDE
Microsoft Script Editor
Настройка машины для отладки клиентских сценариев
Прежде чем мы начнём отлаживать код сценария на стороне клиента,нужно сделать некоторые настройки :
Включить клиентскую отладку сценариев в Internet Explorer. Для этого перейдите в меню Сервис -> Свойства обозревателя и на вкладке Дополнительно убедитесь, что отладка сценариев отключена.


Включить отладку сценариев в IE.

<script language =»javascript» type=»text/javascript»>
function btnGreeting_Clicked()
debugger;
var firstname;
var lastname;
var greeting;
firstname = document.all(‘txtName1’).value;
lastname = document.all(‘txtName2’).value;
greeting = «Hai» + » «+ firstname + » » + lastname + » » + «Have a great Day!»;
alert(greeting);
return false;
>
</script>

Выход листинга приветствия программы.
Вернуться в Visual Studio Чистая окружающая среда и нажмите кнопку Отладка -> Другие окна-> Script Explorer и установите точки останова в желаемом месте.
Снова вернуться к IE. Дайте значения имя и фамилию и нажмите кнопку приветствие. Вы можете увидеть управление возвращается в сценарий Explorer, как показано ниже в листинге. Используйте клавишу F10, чтобы перешагнуть через каждую строку кода. Кроме того, можете использовать клавишу F11, чтобы войти в каждую строку кода. В сценарии Explorer, вы можете установить новые точки останова и использовать местные Окна для проверки значения локальных переменных в сценарии. Immediate Window оценивает значения переменных.
Чтобы вызвать немедленно окно нажмите Debug-> Windows-> Интерпретация. Аналогично окна вызываются через кнопку Отладка-> Windows-> Локальные


Сценарий Explorer в действии.
Вы можете также использовать команду Window для выполнения команды сценария кода переменных, таких как команда Debug.Print. Чтобы вызвать окно команды нажмите кнопку-> Вид-> Other Windows-> Окно «Команда». Также доступен ряд других функций, таких как строение окна, окна стека вызова. Вы можете наблюдать в окне команд ниже в листинге.


Microsoft Script Editor.

Microsoft Script Editor (MSE) является мощным инструментом, который предназначен для отладки Java-скриптов, используя Internet Explorer в качестве сервера сценариев. Он поставляется как бесплатный компонент Office XP и Office 2003. Это привлекательный вариант, когда всё, что вам нужно, для отладки Java-скриптов для IE и у вас нет Visual Studio. NET установленного на вашей машине.Это Вы можете проверить на МФБ на вашей машине, нажав кнопку Просмотр опции IE и посмотреть, можете ли Вы найти вариант отладчика сценария.
Давайте использовать тот же пример, чтобы продемонстрировать отладку кода скрипта на стороне клиента используя MSE.
Переход на том же примере, откройте страницу в Internet Explorer и нажмите кнопку Открыть, как показано ниже в листинге.


IE с MSE .

После нажатия кнопки Open можно увидеть диалоговое окно Just-In-Time Debugger.


Нажмите Да для использования МФБ и вы можете увидеть ниже перечисленные диалоговые окна.



Microsoft Script Editor IDE.


Just-In-Time Debugger.

Выберите Да и остальные действия такие же, как описано в первом методе работы с ММП. Управление передается Script Editor IDE.


Microsoft Script Editor IDE.



Операционная система Windows поставляется с предустановленным рядом приложений Microsoft, таких как Microsoft Edge, Internet Explorer Windows Store и т. Д. Иногда при доступе к одному из этих приложений, таким как Microsoft Teams или веб-браузер, вы можете встретить «Microsoft объединяет в скрипте на этой странице произошла ошибка »error. О подобных проблемах сообщалось и на форумах Microsoft .

Моя компания перешла на Office 365 на прошлой неделе.
Я обновил свой OneDrive для бизнеса до версии Office 2016.
Но с тех пор я больше не могу войти, чтобы синхронизировать некоторые точки обмена.

Если вас также беспокоит эта ошибка, вот несколько советов по устранению неполадок, которые помогут вам решить команды Microsoft: в скрипте на этой странице произошла ошибка в Windows.

1. Отключите уведомление об ошибке скрипта

2. Отключить сторонние сервисы

  1. Если проблема не устранена и вы все еще видите ошибку сценария, попробуйте отключить службу стороннего производителя, которая может вызывать ошибки.
  2. Нажмите Windows Key + R, чтобы открыть Run.
  3. Введите msconfig и нажмите кнопку ОК, чтобы открыть конфигурацию системы.
  4. В окне « Конфигурация системы» перейдите на вкладку « Службы ».
  5. Внизу установите флажок « Скрыть все службы Microsoft ».
  6. После этого нажмите кнопку « Отключить все» . Это отключит все службы сторонних разработчиков.
  7. Нажмите вкладку « Автозагрузка ».
  8. Нажмите на Открыть диспетчер задач.
  9. В диспетчере задач выберите все приложения по одному и отключите их на вкладке « Автозагрузка ».
  10. Закройте диспетчер задач и вернитесь к Конфигурации системы.
  11. Нажмите Применить и нажмите ОК.
  12. Перезагрузите компьютер, если будет предложено перезагрузить.
  13. После перезапуска попробуйте открыть клиент Microsoft Teams и проверьте, не обнаружила ли команда Microsoft ошибку в скрипте на этой странице. Ошибка по-прежнему возникает.
  14. Если ошибка устранена, это может быть одно из сторонних приложений, вызывающее проблемы.
  15. Откройте « Конфигурация системы» и перейдите на вкладку « Сервис » и снова включите все сервисы. Теперь вам нужно выяснить стороннее приложение, которое создает конфликт с Microsoft Teams, и удалить его.

Читайте также: