Category Archives: Soft and services

Горяче клавиши для Google Chrome DevTools

https://developers.google.com/chrome-developer-tools/docs/shortcuts?hl=ru

Наблюдать за событиями на элементе в Google Chrome DevTools

На странице вконтактика пишем

monitorEvents($('#side_bar')[0], ['mouse', 'key', 'touch'])

1	monitorEvents($('#side_bar')[0], ['mouse', 'key', 'touch'])

и водим мышкой по левому меню. Видим: Вот подробнее — http://www.briangrinstead.com/blog/chrome-developer-tools-monitorevents

Сниппеты для Google Chrome DevTools

https://github.com/bgrins/devtools-snippets#to-enable-devtools-snippets-in-chrome

Что нового в Google Chrome DevTools в 2013

http://www.html5rocks.com/en/tutorials/developertools/revolutions2013/

Отладка страниц на Google Chrome for Android

https://developers.google.com/chrome-developer-tools/docs/remote-debugging?hl=ru Вот только в помощь, как включить режм разработчика на Android 4.2+ — http://zacktutorials.blogspot.ru/2013/03/enabling-developer-options-in-android.html Репозиторий с плагином — https://github.com/GoogleChrome/ADBPlugin Можно пробросить порты — https://developers.google.com/chrome-developer-tools/docs/remote-debugging?hl=ru#reverse-port-forwarding

Список обработчиков событий для элемента в Google Chrome DevTools

Правой кнопкой на элементе → Проверить элемент → Event Listeners в правом меню. Правой кнопкой на функции → Show Function Definition. https://plus.google.com/+AddyOsmani/posts/9WvgE2K2QTF Один большой минус — бесполезен для фреймвоков типа jQuery или AngularJS: показывает функцию, которая непосредственно навешивает событие, т.е. пользы — ноль.

Google Chrome Dev Tools: изменение и сохранение js и css на лету

Для этого нужен Chrome Canary. Консоль → настройки → Workspace → Add folder После этого в консоли, во вкладке Sources, можно редактировать и сохранять js-файлы (страница будет работать с уже обновлённым js, он подменяется на лету, без перезагрузки страницы). Вот инструкция с картинками — https://plus.google.com/+AddyOsmani/posts/CYXzDfg3jhC, вот видео — https://www.youtube.com/watch?v=kVSo4buDAEE. Работает также с css-файлами. Есть даже …

Ограничение скорости загрузки сайта для определённых доменов под MacOS X

http://mschrag.github.io/ Очень простая штука. По сути — локальный шейпер. Ставится как prefPane (вкладка в настройках). Немного раздражает, что периодчески спрашивает пароль. Выглядит вот так:

Less Watcher для PhpStorm

Нужно поставить less и добавить watcher: Полезные ссылки: http://webdevism.alabebop.com/?p=127 http://dan.clarke.name/2013/04/env-node-no-such-file-or-directory-error-in-intellij-idea-file-watcher/

Microsoft Ergonomic Natural 4000 под MacOS X

Поставить драйвера отсюда http://www.microsoft.com/hardware/en-us/d/natural-ergonomic-keyboard-4000 Потом

cd ~/Library/Preferences
mv com.microsoft.keyboard.pref com.microsoft.keyboard.pref.bak
wget http://scottbezek.com/com.microsoft.keyboard.pref
open /Library/PreferencePanes/Microsoft\ Keyboard.prefPane

cd ~/Library/Preferences

mv com.microsoft.keyboard.pref com.microsoft.keyboard.pref.bak

wget http://scottbezek.com/com.microsoft.keyboard.pref

open /Library/PreferencePanes/Microsoft\ Keyboard.prefPane

http://blog.philippklaus.de/2012/05/microsoft-natural-ergonomic-keyboard-4000-with-mac-os-x-and-linux/