GapDebug :: Mobile App Debugger
GapDebug Simplify Your Debugging Experience GapDebug is a comprehensive mobile debugging tool that bridges the gap left by other debugging options. Operating on both the Windows and Mac platforms, GapDebug allows debugging of hybrid mobile apps, such as PhoneGap and Cordova, on modern iOS and Android devices. And, GapDebug is always free for local debugging. GapDebug + PhoneGap = Seamless App Tuni
Chrome DevToolsのTipsをひたすら集めたブログ『DevTools Tips』 | 100SHIKI
これ、いいすね。 なにかと便利なChromeのDevToolsのTipsを集めたブログがDevTools Tipsだ。 しかもテキストによる説明はそこそこに、アニメーションで見せてくれるでわかりやすい。 DevToolsが使えると開発がぐっと効率的になるのでざっと眺めてみるといいだろう。 あなたが知らないTipsが見つかるといいですな。
WebIDE, Storage inspector, jQuery events, iframe switcher + more – Firefox Developer Tools Episode 34 – Mozilla Hacks - the Web developer blog
WebIDE, Storage inspector, jQuery events, iframe switcher + more – Firefox Developer Tools Episode 34 A new set of Firefox Developer Tools features has just been uplifted to the Aurora channel. These features are available right now in Aurora, and will be in the Firefox 34 release in November. This release brings new tools (storage inspector, WebIDE), an updated profiler, and handy enhancements to
Mozilla Launches Experimental Tool For Cross-Browser Debugging | TechCrunch
When you are building Web apps — and especially when you are debugging them — all the subtle differences between the different browsers start coming into play. Testing on every single browser is a hassle and there are no good tools available that help you easily automate these tests, partly because the different browsers’ developer tools can’t talk to each other. Mozilla, however, has now built an
Rails アプリケーション開発で役に立ったJavaScript デバッグの小技｜TechRacho by BPS株式会社
Chrome devtools でイベント監視 いろいろなJavaScriptプラグインを使っていると イベントの伝播を止めてしまうような動作をするものを使ってしまうことがあります。 function を割り当てたいイベントが止められていると厄介です。 代用できるイベントが生き残っていればそちらを使ってしまいたいです。 そんな時、どんなイベントが発生しているのかは Chrome devtools のmonitorEvents で確認することができます。 https://developer.chrome.com/devtools/docs/commandline-api#monitoreventsobject-events 第一引数で監視対象、第二引数でイベントを指定します。 monitorEvents(window, "resize"); イベントの指定はイベント名だけでなく、"mouse
JavaScript Error- and XHR Log Recording With Every Bug Report – Mozilla Hacks - the Web developer blog
JavaScript Error- and XHR Log Recording With Every Bug Report Let’s start with a story. A user story: A friend of mine called me in the middle of the day with a very strange request. He told me “Could you come over and help me to fill-in a form”. I was surprised as filling forms is the easiest thing to do online, isn’t it? Even for not so-tech-savvy people. So I went to my friend’s home and surpri
Firefox OS/Performance/Debugging OOMs - MozillaWiki
This page was last modified on 1 February 2015, at 13:59. Privacy policy About MozillaWiki Mobile view
モバイルWeb開発に役立つ！Chrome DevToolsの新機能「デバイスモード」
モバイルWeb開発に役立つ！Chrome DevToolsの新機能「デバイスモード」 Tomomi Imura（Slack） 今回のGoogle I/OはAndroidに特化していた傾向が強く、WebテクノロジーやChromeの扱いが比較的小さかったせいもあり、多くのWebフロントエンドディベロッパーは不満を感じた部分もありました。 そこでその中の数少ないChromeのセッションの中から、私が興味深く感じたクロスデバイス開発にはこの先欠かせなくなると思われる Chrome DevToolsの新機能についてレポートします。 このセッションを行ったPaul Bakaus氏（以下、ポール氏）は、かつてjQuery UIやAvesゲームエンジンを開発したことでも知られています。一時期日本に在住していたこともあるので、この記事を読んでいる皆さんには既になじみのある方かもしれません。現在はGoogle
Deb.js·JavaScriptのデバッグを効率化する小さなライブラリ MOONGIFT
最近のWebブラウザの進化によってJavaScript開発はとても便利になっています。ブレイクポイントを差し込んだり、コンソールを使うことでどんどん開発が進められるようになっているでしょう。 そんなJavaScript開発をさらに便利にしてくれそうなソフトウェアがDeb.jsです。ごくごく小さなデバッガーです。 Deb.jsの使い方 Chrome ウェブストアで公開されていますので、インストールします。 こちらがインストール画面です。 インストールされるとDebアイコンが追加されます。 こんな感じでURLに?debjsを追加すると自動で読み込まれるようになります。 任意の関数に.deb()を追加するとスタックとレースされるようになります。 引数や返り値、実行時間などもとれて便利です。 色分けもされるので分かりやすいですね。 開発効率向上を考えると、デバッグ方法は色々知っておいて損はないでし
Introducing the Canvas Debugger in Firefox Developer Tools – Mozilla Hacks - the Web developer blog
The Canvas Debugger is a new tool we’ll be demoing at the Game Developers Conference in San Francisco. It’s a tool for debugging animation frames rendered on a Canvas element. Whether you’re creating a visualization, animation or debugging a game, this tool will help you understand and optimize your animation loop. It will let you debug either a WebGL or 2D Canvas context. You can debug an animati
Firefox の開発ツールに追加された新機能（2014 年 5 月 2 日版） | Mozilla Japan ブログ
最新の Firefox の開発ツールに追加された新機能をご紹介します。 ご紹介する新機能は 2014 年 5 月 2 日にリリースされた Firefox Aurora でお使いになれます。 ボックスモデルの編集インスペクタで要素を選択するとその要素のマージンや幅などが表示されますが、表示されている数値をダブルクリックすることで、ボックスモデルの各値を編集できるようになりました。 ここでの編集した内容は、その場でレンダリング結果に反映されます。 数値を直接入力する以外に、Alt と矢印キーの上下で数値が 0.1 ずつ増減できます。これで位置の微調整もより効率的に行えます。 また Shift キーと矢印キーの上下で、数値を10ずつ増減できます。 Eyedropperインスペクタに付属のカラーピッカーに Eyedropper がつきました。 これで色を取得するピクセルを、文字通りピクセル単位で指
覚えておきたいDevToolsのコマンドラインAPIまとめ - Qiita
DevTools、使ってますか？ もはやChromeじゃないと開発できないくらいに飼い慣らされています。 ブレークポイントやconsole.logなど基本的な使い方から、TimelineとAuditsを使ってのパフォーマンス計測などなど、DevToolsのポテンシャルは計り知れません。 個人的にはConsole APIが好きなんですが、今回はConsoleパネルで使える Command Line API の使い方についてまとめてみました。 $_ $_には最後に評価した式の結果が保存されています。 Console上で計算を行なった場合や、$セレクタなどでDOMを検索した結果など、最後の結果が常に保存されます。 $0 〜 $4 $0から$4にはElementsパネルで選択した要素が5つ保存されています。$0が最後に選択した要素で数字が増えるごとに過去に選択した要素になります。 $0は特に使いや
Chrome/Firefox の JavaScript Debugger でステップ実行時にライブラリ・フレームワークをスキップする - Qiita
JavaScript のデバッガ、便利ですよね。つかって、ますよね! Chrome, Firefox 両方の Developer Tool (Web Inspector) には JavaScript デバッガが付属しています。両者には Event Listener Breakpoints 機能が存在し、特定イベントのリスナ全部にブレークポイントを仕掛ける事が可能です。 しかし、jQuery の $.on, $.bind, その他 $.click(fn) 等でイベントハンドラを定義すると jQuery の中で addEventListeners が呼ばれ内部で処理をした後に実際に jQuery に渡した関数が呼ばれます。 そのため、JavaScript デバッガは jQuery 内部でブレークし本来飛んでほしいはずの関数に一発で飛んでくれません。 そこで Firefox には Library
Frida • A world-class dynamic instrumentation toolkit
Dynamic instrumentation toolkit for developers, reverse-engineers, and security researchers. Scriptable Inject your own scripts into black box processes. Hook any function, spy on crypto APIs or trace private application code, no source code needed. Edit, hit save, and instantly see the results. All without compilation steps or program restarts. Portable Works on Windows, macOS, GNU/Linux, iOS, wa
Chrome DevTools now lets you see how websites behave on mobile devices (video)
Chrome DevTools now lets you see how websites behave on mobile devices (video) Developing a mobile-friendly website can be daunting. How do you account for the many, many devices that will see your page? If you grab Google's new Chrome 32 beta, that kind of testing should be trivial. The desktop browser's DevTools for Mobile can now emulate the behavior of mobile gadgets down to their display reso
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
大手Webサービスがクライアント側で発生したJavaScriptのエラーをどう収集しているのか まとめ - Qiita
Measuring power consumption on phones – Mozilla Hacks - the Web developer blog
Firefox 開発ツールの再紹介 パート 2: スクラッチパッドとスタイルエディタ
Firefox 開発ツールの再紹介 パート 1: Web コンソールと JavaScript デバッガ
サイバーエージェント、自社のスマホ向けアプリ開発ツール「beez」「adbkit」をOSSで公開
