Opera Dragonfly 1.0



    Сегодня вышла финальная версия инструментов для разработчика Opera Dragonfly 1.0, встроенных в браузер Opera. Открыть их проще простого: просто нажмите Ctrl + Shift + I или ⌘ + ⌥ + I, в зависимости от вашей системы, или выберите «Проинспектировать элемент» для любого блока на странице. Opera Dragonfly представляет собой HTML5-приложение, которое запускается в браузере и может работать как онлайн (поэтому у вас всегда будет актуальная версия), так и офлайн при помощи технологии AppCache из спецификации HTML5. Исходники приложения доступны на Bitbucket.



    Основные инструменты, со ссылками на документацию





    Раньше для того, чтобы попробовать новую версию, приходилось править opera:config и внимательно следить за экспериментальными ветками в блоге разработчиков, но сейчас новый Dragonfly переехал по умолчанию во все браузеры Opera. Убедиться в том, что вы используете стабильную ветку можно следующим образом:

    • Откройте Opera и перейдите по ссылке: opera:config#DeveloperTools|DeveloperToolsURL
    • Убедитесь в том, что там стоит значение по умолчанию: https://dragonfly.opera.com/app/ — для этого вы можете просто нажать кнопку «По умолчанию» и перезапустить браузер.


    Локализация


    Мы постарались перевести Opera Dragonfly на русский язык как можно ближе к тому, как говорят разработчики. Но есть ещё куда двигаться: если вы нашли какие-то неточности, непереведённые места или знаете как сформулировать перевод удачнее — пишите мне на pepelsbey@opera.com.

    Обзор возможностей


    И напоследок: небольшой скринкаст Брюса Лоусона, демонстрирующий работу с новым отладчиком Opera Dragonfly.

    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 99

      +4
      Круто, не ожидал такое увидеть.
        +10
        Из того, что в глаза бросилось — скорость работы (а особенно загрузки) значительно возросла. Да и функционал весьма неплох, для решения «из коробки». Большое спасибо за релиз.
          +2
          Скорость работы просто молча радует. А вот в глаза бросаются бледнючие цвета, словно краски пожалели. Неужели поярче чуть-чуть нельзя было сделать? Нечитабельно ведь.
            0
            Задача была сделать неброский интерфейс, который одинаково смотрится под любой платформой. А что касается бледности — то самое важное выделено, а вторичное уведено на периферию.
              +1
              Гм. Так интерфейс получился слишком уж «неброский. В DOM глаза сломаешь, пока прочитаешь значения атрибутов. Или это посчитали вторичным?
                +4
                А по-моему рыжий (#A54) на белом — это достаточно ярко.
                  +3
                  Это ярко?!
                  image

                  Вот ярко:
                  image
                    +9
                    Ярко, но слишком уж как-то вырвиглазно.
                      +1
                      Это рядом, когда можно сравнить. А вот попробуйте поработать с каждым интерфейсом в отдельности. От вырвиглазно-яркого не так сильно устаешь, т.к. читать мелкий текст намного легче. Я не говорю, что цвета файрбага так уж хороши, их в самом деле стоило бы сделать чуть бледнее, но не настолько, как это сделано в dragonfly. Или нужно вообще какое-никакое соломонов решение: например, подключаемые стили подсветки синтаксиса, чтоб каждый мог настроить себе вмеру вырвиглазный вариант.
                      +9
                      У всех свои любимые фломастеры — для меня Firebug адово ярок, а это в самый раз:

                        0
                        А то у вас за шрифт стоит? И как его сменить? Мб со сменой шрифта читабельность повысится. Кстати, одна из причин плохой читаемости — ноутбучный жк. Цвета внизу экрана выглядят напорядок бледнее, чем есть.
                          0
                          Шрифт у меня Menlo, который по умолчанию идёт для Mac OS.
                            0
                            Его можно менять в настройках: Settings / General / Monospace Font
                              0
                              ЧЯДНТ? Выставляю в настройках шрифт, но ничего не изменяется. Ни обычный, ни моноширный. Как я выставлял когда-то давно Tahoma и Console, так они и работают. Выставил Calibri и Lucida Console, но ничего не поменялось. Перезагруз браузера не помогает =\
                                0
                                У меня всё работает — выбираю шрифт и он тут же меняется.
                                  0
                                  Фигня какая-то pix.am/FC9h.png
                                  Кстати, у меня еще после сохранения настроек всегда на всех открытых вкладках вылезает панель поиска по странице. Судя по всему, опера глючит где-то.
                                    +1
                                    А вы не там это делаете. Вам нужны настройки не содержимого страниц браузера, а настройки DFL: Основные > Моноширинный шрифт

                                      0
                                      Тьфу, я балда :) Совсем сегодня крыша едет. Спасибо.
                            0
                            Почему бы не дать возможность базовой настройки цветов? Я вот очень люблю темную систему и с удовольствием поставил бы темный фон и светлые буквы.
                +3
                когда увидел все эти полупрозрачные консоли поверх основной панели и прочие плюшки, невольно подумал
                опять что нибудь в опере да не заработает
                надо отучаться :)
                  –6
                  Как-то сильно уж похоже на хромовский.
                    +1
                    А «хромовский» вам FireBag ничем не напоминает?
                      0
                      Всё удачное рано или поздно копируют :)
                        +21
                        Огненная сумка =)?
                          +3
                          Шутка про медведя.
                        +7
                        Сходство есть, да и функционал схож (что не удивительно так как задачи то одни) — но чисто субъективно, оперовский гораздо удобнее
                          +1
                          В Опере правая кнопка заработала =). Надеюсь, в хроме тоже скоро заработает.
                            0
                            c 10.50 же работает, не?
                              0
                              Куда-то не в ту сторону заработала. Теперь копировать, например, значения атрибутов можно только хоткеями.
                            0
                            А в Опере 11.1 по умолчанию какой?
                              0
                              У всех одинаковый, если настроек не трогали.
                                0
                                Сорри, я имел ввиду — какая версия была в момент выхода 11.1? Я просто в тот момент заметил приличное увеличение скорости.
                                  0
                                  В момент выхода 11.10 была старая версия с зелёными кнопками и совсем уж базовым функционалом.
                              +3
                              Уже научили его показывать тела запроса/ответа у AJAX запросов?
                                +3
                                Проверил — показываются. Я рад. Как у братьев стало все.
                                  0
                                  вообще любых запросов!
                                    +7
                                    И можно самому слать запросы прямо из драгонфлая. Очень крутой релиз.
                                    +1
                                    Хорошо, что теперь можно его оффлайн открывать. Доставало, что каждый раз он загружался. Качаю Оперу.
                                      0
                                      Он и раньше работал оффлайн, просто были некоторые проблемы с AppCache, из-за чего кеширование срабатывало не всегда.
                                        0
                                        А мне еще кажется, что он каждый раз загружался, потому что версия была не стабильная и все время обновлялась. Я сидел на experimental. Надеюсь теперь он не будет так часто перезагружаться.
                                          0
                                          Думаю поэтому тоже.
                                      +2
                                      Я побаиваюсь запускать стрекозу. При запуске панель внизу появляется всегда, а сам драгонфлай иногда подтупливает и перестаёт загружаться, а если он не загрузился, то и кнопки закрыть драгонфлай тоже нет. И получается, что для того чтобы убрать эту белую панельку снизу, надо перезапустить браузер. Возможно, есть другой способ её перезагрузить в случае фейла, но интуитивно я ничего не нашёл.
                                        +2
                                        Угу, препротивнейшая вещь была. Выключалась следующим образом: Меню -> Страница -> Средства разработки -> Opera Dragonfly. Собственно, именно сейчас вам и стоит попробовать стрекозу, ибо запускается ооочень быстро. Да и скорость работы хороша.
                                          +1
                                          Зачем ходить так далеко: Ctrl+Shift+I или «Проинспектировать…»
                                            0
                                            Не «включалась», а именно «выключалась» :) Если при запуске стрекоза не прогружалась, то никаких кнопок для закрытия у нее не появлялось, вот и надо было по менюхам искать.
                                              +3
                                              По-моему, этим сочетанием она и закрывается, даже если не прогрузилась.
                                                +1
                                                Не исключено, у меня это сочетание вообще не работает. Наверное, какое-то другое приложение его заняло, но при нажатии ничего не происходит.
                                                  +1
                                                  +1, аналогично, пришлось кнопку выносить на тулбар.
                                                  смотрю шорткарты:
                                                  Platform Windows-Unix-MCE, i ctrl shift
                                                  Open Developer Tools Window | Close Developer Tools Window
                                                    0
                                                    заюзал утилиту HotKeys Explorer, показала то, что почему-то миранда повесила свои глобальные хоткеи.
                                                  0
                                                  Жестом можно закрыть
                                                    +1
                                                    Ctrl+W срабатывает при фокусе на стрекозе.
                                                      0
                                                      Ага, вот только почему-то срабатывало 50/50. Какая-то фигня с фокусом, просто не ставится на dragonfly, хотя закликайся, и вместо нее закрывается страница. Так что я приловчился через меню ее закрывать. Да, собсно, какая к черту разница, новая стрекоза пока ни разу не затупила :)
                                                +1
                                                У меня для вас три хороших новости:

                                                1. Стрекозу можно закрыть при помощи Ctrl+Shift+I (так же, как вы её открыли)
                                                2. Теперь при загрузке эта штука будет тормозить значительно реже, особенно если перейти на стабильный канал
                                                3. На сплеш-скрине с летящей стрекозой появились кнопки «Обновить» и «Закрыть»
                                                  +1
                                                  Жестом закрывается отлично, как и любой другой окно в Опере. Или ctrl+w еще.
                                                  0
                                                  Порадовала возможность менять хедеры, недавно очень была нужна эта фича.
                                                    0
                                                    Да, отличная штука. Планируется добавить много других пресетов, кроме тех, что уже есть.
                                                    0
                                                    еще не очень удобно то, что отдельно узлы DOM-дерева нельзя сохранять, только целиком, да и то, будет сохранена только развернутая часть.
                                                      +4
                                                      А можно так: выделяете нужный узел дерева, правой кнопкой «Редактировать разметку» и вот вам код.
                                                        0
                                                        спасибо, прикольно, не догадался сам :)
                                                          0
                                                          Даблклик!
                                                          0
                                                          находите там этот <div и даблкликом в «div». вот и все :)
                                                          +4
                                                          А тело POST-запроса так и не видно. Или не могу найти, как смотреть?
                                                            +2
                                                            Я тоже не нашёл как его посмотреть. А мне отладчик практически только для этого и нужен. :(
                                                              0
                                                              Никак. Где-то попадался топик с вопросом. Ответили что-то вроде «Этого пока не умеет Scope, как только, так сразу».
                                                          • UFO just landed and posted this here
                                                              0
                                                              Консоль есть, кнопка в верхнем правом углу, там же где «закрыть»/etc.

                                                              Правило можно добавить еще так: двойной клик на существующем правиле, end, enter. Но согласен, не очень удобно.
                                                                0
                                                                Раздел DOM есть, консоль есть. Что в них не так?

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

                                                                В файрбаге и вебките у вас нет возможности менять поведение подсветки. Вы просто её используете. Но иногда бывает, что все эти рамочки сильно мешают разобраться в свойствах какого-нибудь мелкого элемента или просто мельтешат и отвлекают. Здесь у вас есть выбор: настроили как удобно — и вперёд.
                                                                • UFO just landed and posted this here
                                                                +1
                                                                1) Поподробнее бы информацию в network log: сколько ждали ответа, сколько грузили (а то, как я понял, оно сейчас суммарно)
                                                                2) Из консоли ошибок нельзя перейти к тому файлу и месту где эта ошибка находится. (причем к самому файлу перейти можно, но только развернув ошибку и кликнув на имени файла в теле)
                                                                3) Кнопка «Expand all» в консоли ошибок вовсе не разворачивает все, а просто инвертирует. Т.е. если у меня три ошибки и я развернул первую, то при нажатии на «Expand all» первая свернется, а остальные две развернутся.
                                                                  0
                                                                  А почему вывод console.log() появляется 2 раза, как во вкладке Erorrs, так и в самой консоле?
                                                                  +3
                                                                  О боже, в нетворк-инспекторе можно смотреть боди резолва! Как же я этого ждал. Спасибо!
                                                                    0
                                                                    В about'е в самом конце написано: Томица Кораћ. Это я так понимаю проблемы перевода.
                                                                      +2
                                                                      Не обижайте сербов: Томица Кораћ
                                                                        0
                                                                        Во время отпуска я...:
                                                                        Sleep and have sex

                                                                        Нормально отдыхают сербы :)
                                                                          +2
                                                                          ещё он не любит albanians
                                                                      +10
                                                                      ⌘ + ⌥ + I


                                                                      только у меня такие ассоциации?

                                                                        +4
                                                                        маководы не понимают вашего удивления
                                                                        0
                                                                        Проблема такая же, как у вебкитовского веб-инспектора – недостаток горячих клавиш. А в остальном все зачетно.
                                                                          +1
                                                                          Вы уверены, что побывали в Настройках DFL > Клавиатурные сокращения?
                                                                            +3
                                                                            Хотя беру слова обратно – в новой версии заметил вкладку «Клавиатурные сокращения».
                                                                            0
                                                                            бага с кешированием картинок так и осталась…
                                                                              0
                                                                              И как его воспроизвести?
                                                                              Может просто конфликт с предыдущей версией и стоит почистить кэш (Tools / Delete Private Data / Delete entire cache) + переоткрыть Dragonfly?
                                                                            0
                                                                            Отлаживаю сегодня какой-то скрипт, нажимаю в очередной раз «Проинспектировать элемент», опа, а dragonfly не так выглядит, смотрю — версия стала 1.0 %)
                                                                              +2
                                                                              Единственное, что огорчает в Dragonfly — это катастрофические тормоза на странице Network в процессе загрузки страницы. Это просто жесть нереальная. Приходится во время загрузки переключаться на другую вкладку dragonfly, иначе на тяжёлых страницах начинает тормозить вообще всё.
                                                                                +2
                                                                                А еще оттуда убрали кнопочку «clear log». Неприятно.
                                                                              • UFO just landed and posted this here
                                                                                  0
                                                                                  А можно как-нибудь сохранять изменения непосредственно на сервере сайта?
                                                                                    0
                                                                                    Может вам какой-нибудь редактор посоветовать удобный? Это отладчик, у него другие задачи.
                                                                                      0
                                                                                      Нет, спасибо. Я тогда по старинке блокнотиком и ftp :)
                                                                                      0
                                                                                      для фаербага было такое дополнение, шло вместе со скриптиком на пхп для сервера.
                                                                                      0
                                                                                      Было бы совсем здорово добавить бьютифаер (анти-обфускатор) в просмотрщик и дебаггер скриптов.
                                                                                        0
                                                                                        Одно дело бьютифаер — который просто разворачивает по некоторой схеме, а другое антиобфускатор — я даже не уверен, что это возможно. Но фичериквест принят.
                                                                                        +6
                                                                                        Шикарный релиз!
                                                                                        Правда очень не хватает инлайнового автодополнения в стилях, как в фаербаге, чтоб не нужно было каждый раз нажимать стрелку. И чтобы при добавлении нового свойства после написания названия свойства по табу переходило к значению, а не сбрасывало все написанное и прыгало на следующее свойство. Вобщем в этом плане хочется полный аналог фаербага.
                                                                                        d → Tab → n = display:none;
                                                                                        li → Tab → n = list-style:none;
                                                                                        и т.п.
                                                                                        Ну ведь удобно же до ужаса. Почему бы не сделать так же.

                                                                                        Еще очень не хватает возможности быстрого добавления инлайновых стилей, опять же как в фаербаге. А то щас приходится вручную писать в дереве style=""

                                                                                        Также очень не хватает работы с динамикой, как в фаербаге — подсвечивать изменения, разворачивать изменения, прокручивать к изменениям.

                                                                                        Еще не хватает отображения строки, на которой находится css-свойство и, естественно, перехода на эту строку.

                                                                                        Еще ооочень не хватает отображения всех свойств, а не только тех, которые опера смогла интерпретировать. Хочу как в хромом видеть все -moz, -webkit и т.п. Для удобства можно было бы сделать их отображение отключаемым.

                                                                                        А еще почему-то драгонфлай так и не научился нормально работать с цветом CSS3 теней — он упорно не хочет показывать значение цвета.

                                                                                        Еще стрекоза часто неадекватно ведет себя, когда переписываешь какое-либо свойство на другое.
                                                                                        К примеру, мы хотим переписать у заголовка поста на хабре padding-right:30px; на margin-right:30px; — результат получается, мягко говоря, очень странный. Мало того, что в стилях по-прежнему будет отображаться padding-right:30px; (хотя его на самом деле нет и при повторном клике на элементе переписанное свойство исчезает), так драгонфлай еще и почему-то понял наш margin-right:30px; как margin:30px;. Очень досадный баг.

                                                                                        Вобщем еще есть куда расти, а пока в целом очень доволен. Очень большой рывок по сравнению с предыдущей версией.
                                                                                          +1
                                                                                          Спасибо за багрепорт, будет что рассказать разработчикам.
                                                                                          0
                                                                                          Все очень радостно, но единственное печалит, что эти горячие клавиши меняют работе дефолтных хоткеев на открытие полученного сообщения в QIP Infium.

                                                                                          Only users with full accounts can post comments. Log in, please.