Отключить редактирование script в инструментах разработчика Chrome

Я использую инструменты разработчика Chrome для отладки кода JavaScript, но у меня есть одно домашнее животное, так как Chrome позволяет редактировать файлы JavaScript на вкладке "Сценарии" . Иногда я не понимаю, что я нахожусь в Chrome, и я начинаю вносить изменения в код на вкладке "Сценарии" , но только для того, чтобы понять, что изменения, которые я только что сделал, никогда не сохранялись на диске!

Мне было интересно, есть ли способ сделать код, показанный на вкладке "Сценарии" доступным только для чтения, чтобы, если я попытаюсь отредактировать файл в Chrome, я увижу, что он не редактируется, а затем понял, что я не в моей среде IDE.

Ответ 1

Используйте следующий процесс, чтобы сделать script исходным только для чтения в Chrome 32 +:

Перейдите на страницу chrome://flags/# enable-devtools-экспериментов URL
Выберите "Разрешить пользовательские интерфейсы"
Откройте Chrome Dev Tools
Выберите настройки (нажмите F1 или щелкните три точки справа)
Выберите "Разрешить пользовательские интерфейсы"

Создайте тему DevTools со следующим стилем:

.content-view.script > .text-editor { -webkit-user-modify: read-only !important; }

Опубликуйте Интернет-магазин Chrome
Установить тему
Перезапустите Chrome

Ссылки

Использовать старый процесс для Chrome 31 -:

Используйте таблицу стилей пользователя, чтобы полностью отключить вкладку script:

.toolbar-item.scripts { display:none !important; } /* Hide Scripts Tab */

Или просто создайте источник script только для чтения:

.text-editor-editable { -webkit-user-modify: read-only !important; } /* Old selector */
.content-view.script > .text-editor { -webkit-user-modify: read-only !important; } /* Older selector */
.editing { -webkit-user-modify: read-only !important; } /* Generic Selector */

Вот несколько возможных местоположений файла:

Windows 7 Chromium:
- %LOCALAPPDATA%\Chromium\User Data\Profile 1\User StyleSheets\Custom.css
Windows 7 Chrome:
- %LOCALAPPDATA%\Google\Chrome\User Data\Default\User StyleSheets\Custom.css
OSX Chrome:
- /Users/YourUsername/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css
Ubuntu Chrome:
- ~/.config/chromium/Default/User\ StyleSheets/Custom.css

Используйте следующий URL-адрес Chrome Devtools для ссылки на соответствующие стили:

хром-DevTools://devtools/devTools.css

Ответ 2

Насколько я знаю, нет возможности отключить редактирование script в инструментах разработчика Chrome/WebKit.

Ниже представлены ~~два~~ три возможных решения:

Решение 1:

Сделайте расширение, которое отображает предупреждение каждый раз, когда вы делаете редактирование:

JavaScript:

chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(function(resource, content) {
    alert("WARNING: Your changes will not be saved!!");
    // Optional, but and extra layer of "protection", if you don't want/need it just remove the "experimental" permission from the manifest
    if (chrome.experimental) {
        chrome.experimental.devtools.console.addMessage("error", "WARNING: Your changes will not be saved!!");
        // Shows in red
    }
});

Расширение (распакованный, сначала включите экспериментальный API расширения под флагами chrome://): http://www.mediafire.com/?wb1r67ron0x6szh

Решение 2:

Измените источник и запустите пользовательскую сборку:

Другой вариант - изменить источник инструментов разработчика, см. https://developers.google.com/chrome-developer-tools/docs/contributing для получения более подробной информации. Если вы это сделали, все, что вам нужно сделать, это удалить класс text-editor-editable из контейнера редактора (строка 1279, DefaultTextEditor.js).

Решение 3:

Сделайте хром автоматически сохраняющим ваши файлы:

Третий вариант - включить хром для сохранения ваших файлов, есть несколько расширений, которые делают это: Tincr. Tincr также позволяет вам обновлять файлы и предлагать полную подсветку синтаксиса.

Мое личное мнение заключается в том, что это лучшее решение.