aboutsummaryrefslogtreecommitdiff
path: root/files/es/tools/debugger/how_to/set_a_breakpoint/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/es/tools/debugger/how_to/set_a_breakpoint/index.html')
-rw-r--r--files/es/tools/debugger/how_to/set_a_breakpoint/index.html44
1 files changed, 44 insertions, 0 deletions
diff --git a/files/es/tools/debugger/how_to/set_a_breakpoint/index.html b/files/es/tools/debugger/how_to/set_a_breakpoint/index.html
new file mode 100644
index 0000000000..49376ffc9e
--- /dev/null
+++ b/files/es/tools/debugger/how_to/set_a_breakpoint/index.html
@@ -0,0 +1,44 @@
+---
+title: Set a breakpoint
+slug: Tools/Debugger/How_to/Set_a_breakpoint
+translation_of: Tools/Debugger/How_to/Set_a_breakpoint
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>Puedes establecer una interrupción incondicional en una de las siguientes maneras:</p>
+
+<ul>
+ <li>en el <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">panel de fuente</a>, haz clic en el número de línea para la línea que deseas la interrupción</li>
+ <li>in the <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">source pane</a>, activate the context menu while on the line you want to break at, and select "Add breakpoint"</li>
+ <li>in the <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">source pane</a>, highlight the line you want to break at and press <kbd>Ctrl</kbd> + <kbd>B</kbd> (Windows/Linux) or <code>Cmd</code> + <kbd>B</kbd> (macOS)</li>
+</ul>
+
+<p>When you display the context menu, you have a choice of setting either a breakpoint that will pause code execution when it reaches that line, an unconditional breakpoint, or a conditional breakpoint that will only pause the code if the conditions you define are met:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16433/set_breakpoint.png" style="border: 1px solid black; display: block; height: 353px; margin: 0 auto; width: 593px;"></p>
+
+<p>If you choose to set a conditional breakpoint, you will be able to add the condition:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16436/edit_conditional_breakpoint.png" style="border: 1px solid black; display: block; height: 324px; margin: 0px auto; width: 525px;"></p>
+
+<p>Each breakpoint is shown in two places in the debugger:</p>
+
+<ul>
+ <li>the <a href="/en-US/docs/Tools/Debugger/UI_Tour#Breakpoints_list">breakpoints list</a> shows the filename and line number for the breakpoint
+
+ <p><img alt="" src="https://mdn.mozillademos.org/files/16434/list_breakpoints.png" style="border: 1px solid black; display: block; height: 325px; margin: 0px auto; width: 313px;"></p>
+ </li>
+ <li>the line in the <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">source pane</a> is marked with a blue arrow if you set an unconditional breakpoint, or an orange arrow if the breakpoint is <a href="/en-US/docs/Tools/Debugger/How_to/Set_a_conditional_breakpoint">conditional</a>. <img alt="" src="https://mdn.mozillademos.org/files/16435/breakpoints_in_code.png" style="border: 1px solid black; display: block; height: 324px; margin: 0px auto; width: 525px;"></li>
+</ul>
+
+<p>Starting in Firefox 67, you can set a column breakpoint on a complex line of code, such as one that makes multiple function calls. For example, if you try to set a breakpoint on the following line, you will have three possible locations for a breakpoint: at the point where the variable value is set, at the call to <code>parse</code>, or at the call to <code>getItem</code>.</p>
+
+<pre class="brush: js">tasks = JSON.parse(localStorage.getItem('todoList'));</pre>
+
+<p>Possible breakpoints are shown with indicators. The following image shows the line in the debugger. As soon as you click on the line, the three indicators show the possible breakpoints. The default breakpoint is set to the first column. In the image, the second column breakpoint was chosen which you can confirm in the Breakpoints section on the right where it shows that the breakpoint is on the call to <code>parse</code>.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16576/column_breakpoint.png" style="border: 1px solid black; display: block; margin: 0px auto;"></p>
+
+<p>Column breakpoints allow you to break at multiple points on the same line. In the previous example, you could have selected both the call to <code>parse </code>and the call to <code>getItem</code>, or even all three columns to break at each of the possible locations.</p>
+
+<p>In cases where you set breakpoints on multiple columns, the currently active columns breakpoint will be highlighted in the Breakpoints side panel.</p>