Developer Edition 41: タブでソースを表示、要素のスクリーンショット、HAR ファイルに対応など

原文: Developer Edition 41: View source in a tab, screenshot elements, HAR files, and more on July 7, 2015 by Jeff Griffiths

数週間前に新しいパフォーマンスツールを紹介したとき、Firefox 開発ツールのチームがいかに多くの時間をユーザのフィードバックや ‘polish’ なバグ (これらは UserVoice フィードバックチャンネルBugzilla で報告されます) を重点的に扱うために費やしているかについて語りました。Firefox 41 は私たちにとって短いリリースサイクルでしたが、ユーザのフィードバックに報いて、本リリースに間に合うことが求められていたいくつかの新機能を搭載することに注力しました。詳しく見ていきましょう:

インスペクタで選択したノードのスクリーンショット

新たな貢献者である Léon McGregor が、UserVoice に投稿された興味深い提案を実装しました。この機能は gcli の ‘screenshot’ コマンドでかなり前から使用できていましたが、コンテキストメニュー項目になったため、より見つけやすく、また使いやすくなりました。スクリーンショットを作成すると、Firefox はダウンロード先ディレクトリにファイルをコピーします。

選択中の要素のスクリーンショットを作成する

タブでソースを表示

Firefox 41 より、右クリックしてページのソースを表示を選択すると、新しいウィンドウではなくタブで HTML ソースを表示します。これはとても多かった要望であり、早期に実装しようとしていました。しかし、表面上は単純な変更として始まりましたが実際はとても複雑でした。バグへのリンクを本節の末尾に掲載しましたので、ぞっとするような詳細をご覧ください。また重要なこととして、ページのソースを表示では Firefox のキャッシュから現状のままのソースを確実に表示するようにしたことがあります。つまり、新しいバージョンを取得しません。

ページのソースを表示すると、タブで表示するようになりました

ルールを追加するボタン

インスペクタの作業ではルールを追加できるととても便利であり、またこれは以前から要望があった Firebug の機能です。開発サイクルの最後に、実装に磨きをかけるためにいくらか時間を費やし、またコンテキストメニューのコマンドに加えて UI ボタンを配置して利便性を高めました。

新しい CSS 規則をすばやく追加できるボタンを、インスペクタに追加しました

“HAR としてコピー” と”HAR として保存”

Selenium のユーザにとってごく一般的である、Firebug 由来のもうひとつの機能が、現在のページを HAR アーカイブとしてエクスポートすることです。

ネットワークモニタから HAR アーカイブを直接エクスポートできます

その他の主な変更点

合わせて 140 個の開発ツールに関するバグを、6 月 1 日以降に修正しました。チームを代表して、バグを報告された方、パッチをテストした方、本バージョンの Firefox 開発ツールの改善に多くの時間を費やした方に感謝します。また、バグを解決された以下の貢献者に特に感謝します: edoardo.putti、fayolle-florent、15electronicmotor、veeti.paananen、sr71pav、sjakthol、ntim、MattN、lemcgregor3、indiasuny000。ありがとう!

  • Bug 1164210 – $$() should return a true Array
  • Bug 1077339 – Display keyboard shortcuts when hovering panel tabs
  • Bug 1163183 – Show HTML5 Forms pseudo elements in the rule view
  • Bug 1165576 – Netmonitor theme refresh
  • Bug 1049888 – Make the storage actor work in e10s and Firefox OS
  • Bug 987365 – Add pseudo-class lock options to rule view
  • Bug 1059882 – Frame selection command button should be visible by default
  • Bug 1143224 – Opening the netmonitor slows down requests on the page
  • Bug 1119133 – Keyboard shortcut to toggle devtools docking mode between last two positions
  • Bug 1024693 – Copy CSS declarations
  • Bug 1050691 – Click on a function on the console should go to the debugger

Firefox Developer Edition 41 をダウンロードしましょう。使用した感想や将来のリリースについてどう考えているかをお聞かせください。私たちは耳を傾けています。