2 files changed, 116 insertions, 0 deletions
diff --git a/files/ja/conflicting/tools/debugger/how_to/search/index.html b/files/ja/conflicting/tools/debugger/how_to/search/index.html
new file mode 100644
index 0000000000..4f3391c8b1
--- /dev/null
+++ b/files/ja/conflicting/tools/debugger/how_to/search/index.html
@@ -0,0 +1,69 @@
+---
+title: 検索とフィルタ
+slug: Tools/Debugger/How_to/Search_and_filter
+translation_of: Tools/Debugger/How_to/Search
+translation_of_original: Tools/Debugger/How_to/Search_and_filter
+---
+<div>{{ToolsSidebar}}</div><p><a href="/ja/docs/Tools/Debugger/UI_Tour#toolbar">ツールバー</a>のスクリプトフィルタを使用して、デバッガ内にある項目を検索できます:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13214/debugger-filter.png" style="display: block; height: 351px; margin-left: auto; margin-right: auto; width: 904px;"></p>
+
+<p>接頭辞をつけずに文字列を入力すると、<a href="/ja/docs/Tools/Debugger/UI_Tour#Source_list_pane">ソースリストペイン</a>に一覧表示されているソースから検索します。</p>
+
+<p>いずれかの特殊文字による検索演算子を接頭辞として付加することで、さまざまな検索機能を提供します。</p>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">接頭辞</th>
+   <th scope="col">機能</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>なし</td>
+   <td><a href="/ja/docs/Tools/Debugger/UI_Tour#Source_list_pane" title="#source-list-pane">ソースリストペイン</a>に表示しているスクリプトの絞り込みを行います。</td>
+  </tr>
+  <tr>
+   <td>!</td>
+   <td>すべてのファイルから文字列を検索します。</td>
+  </tr>
+  <tr>
+   <td>@</td>
+   <td>すべてのファイルから、指定した文字列を含む関数定義を検索します。</td>
+  </tr>
+  <tr>
+   <td>#</td>
+   <td>
+    <p>現在<a href="/ja/docs/Tools/Debugger/UI_Tour#Source_pane" title="#source-pane">ソースペイン</a>で開いているファイルから文字列を検索します。</p>
+
+    <p>検索した後に Enter キーを押下すると、マッチした箇所を巡ります。</p>
+   </td>
+  </tr>
+  <tr>
+   <td>:</td>
+   <td>現在<a href="/ja/docs/Tools/Debugger/UI_Tour#Source_pane" title="#source-pane">ソースペイン</a>で開いているファイルで、指定した行へ移動します。</td>
+  </tr>
+  <tr>
+   <td>*</td>
+   <td><a href="/ja/docs/Tools/Debugger/UI_Tour#Variables_pane" title="#variables-pane">変数ペイン</a>に表示している変数の絞り込みを行います。</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>これらのオプションは、フィルタ内をクリックしたときにポップアップ表示します。また、<a href="/ja/docs/Tools/Debugger/UI_Tour#Source_pane" title="#source-pane">ソースペイン</a>のコンテキストメニューでもアクセスできます。</p>
+
+<p>接頭辞を組み合わせて、より強力な問い合わせが可能です。例えば:</p>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <td>file.js:12</td>
+   <td>"file.js" を開いて 12 行目へ移動します。</td>
+  </tr>
+  <tr>
+   <td>mod#onLoad</td>
+   <td>ファイル名に "mod" を含むすべてのファイルから、文字列 "onLoad" を検索します。</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/ja/conflicting/tools/debugger/how_to/set_watch_expressions/index.html b/files/ja/conflicting/tools/debugger/how_to/set_watch_expressions/index.html
new file mode 100644
index 0000000000..74c0db4345
--- /dev/null
+++ b/files/ja/conflicting/tools/debugger/how_to/set_watch_expressions/index.html
@@ -0,0 +1,47 @@
+---
+title: 変数を調査、編集、ウォッチする
+slug: 'Tools/Debugger/How_to/Examine,_modify,_and_watch_variables'
+translation_of: Tools/Debugger/How_to/Set_Watch_Expressions
+translation_of_original: 'Tools/Debugger/How_to/Examine,_modify,_and_watch_variables'
+---
+<div>{{ToolsSidebar}}</div><div class="note">
+<p>この機能は、まだ新しいデバッガーでサポートしていません。現時点で必要である場合は、about:config で設定項目 "devtools.debugger.new-debugger-frontend" を <code>false</code> に設定して、古いデバッガーに戻すことができます。</p>
+
+<p>古いデバッガーのドキュメントは、<a href="/ja/docs/Tools/Debugger_%28before_Firefox_52%29">デバッガー (Firefox 52 より前)</a> をご覧ください。</p>
+</div>
+
+<h2 id="Examine_variables" name="Examine_variables">変数を調査する</h2>
+
+<p>コードがブレークポイントで停止したときはデバッガーの <a href="/ja/docs/Tools/Debugger/UI_Tour#Variables_pane" title="#variables-pane">変数ペイン </a>で、変数の状態を調査できます:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13216/debugger-variables-pane.png" style="display: block; height: 335px; margin-left: auto; margin-right: auto; width: 903px;"></p>
+
+<p>変数はスコープによってグループ化されます: Function スコープには <code>user</code> や <code>greeting</code> といった関数で定義したローカル変数はもちろん、ビルトインの <code>arguments</code> および <code>this</code> 変数も表示します。同様にグローバルスコープでは <code>localStorage</code> や <code>console</code> といったビルトインのグローバル変数だけでなく、<code>greetme</code> といった独自に定義したグローバル変数も表示します。</p>
+
+<p>それぞれのオブジェクトは三角印をクリックすると、プロパティを表示するように拡張できます。</p>
+
+<p>変数名にマウスポインターを重ねると、その変数に関する付加情報を提供するツールチップを表示します。これらのプロパティの意味について、詳しくは <a href="/ja/docs/JavaScript/Reference/Global_Objects/Object/defineProperty" title="JavaScript/Reference/Global_Objects/Object/defineProperty"><code>Object.defineProperty()</code></a> をご覧ください。</p>
+
+<p><a href="/ja/docs/Tools/Debugger/How_to/Search_and_filter" title="#script-filter">スクリプトフィルター</a> で "*" 修飾子を使用するか、(<a href="/ja/docs/Tools/Debugger/Settings" title="#debugger-settings">デバッガーの設定</a> で有効にしている場合は) 変数フィルターボックスに入力することで、表示する変数をフィルターできます。</p>
+
+<p>{{EmbedYouTube("dxCvnixpM_Q")}}</p>
+
+<p>ソース内に存在する変数が JavaScript エンジンの最適化により削除されている場合は、変数ビューに変数を表示しますが値は <code>(optimized away)</code> となっており、編集ができません。以下のスクリーンショットでは、変数 <code>upvar</code> が最適化で削除されています:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10169/optimized-out.png" style="display: block; height: 235px; margin-left: auto; margin-right: auto; width: 332px;"></p>
+
+<h2 id="Modify_variables" name="Modify_variables">変数を変更する</h2>
+
+<p>コードがブレークポイントで停止したときに、デバッガーの <a href="/ja/docs/Tools/Debugger/UI_Tour#Variables_pane" title="#variables-pane">変数ペイン</a> で変数を変更できます。変数の現在の値をクリックすると、そこに入力できるようになります:</p>
+
+<p>{{EmbedYouTube("FKG-jkvSpq8")}}</p>
+
+<h2 id="Watch_an_expression" name="Watch_an_expression">式をウォッチする</h2>
+
+<p>ウォッチ式は、実行が停止するたびに評価される式です。よって、これらの式の結果を調査できます。これらは、コード内で必ずしも調査を行える状態であるとは限らない不変量の調査ができる点が役に立ちます。"ウォッチ式を追加" と表示されているボックスをクリックして、コードをステップ実行したときに出力内容を監視したい JavaScript 式を入力することで、ウォッチ式を追加します。</p>
+
+<p>そして、コードの実行を開始します。コードのステップ実行を始めるまでウォッチ式は何も行いませんので、ブレークポイントに達するまでは何も起きません。ブレークポイントに達すると、アクティブな式とその値を表示するボックスが現れます:</p>
+
+<p>{{EmbedYouTube("CwGU-5wKRw0")}}</p>
+
+<p>コードをステップ実行して、値の変化に応じた式の結果をウォッチできます。値が変わるたびに、ボックスが一時的に黄色に光ります。式の隣にある "x" 印のアイコンをクリックすると、ウォッチ式を削除できます。またもちろん、ウォッチ式は同時に複数設定できます。</p>