Revert "Resolve conficts / Update translation."

This reverts commit 5166404.

Author: odsantos

1-js/03-code-quality/01-debugging-chrome/article.md

@@ -8,7 +8,7 @@ Aqui, vamos utilizar o Chrome porque tem muitas funcionalidades, mas a maioria d
 
 ## O painel "*Sources*"
 
-A versão do seu Chrome pode parecer um pouco diferente, mas ainda assim deverá ser óbvio o que lá encontre.
+A versão do seu Chrome pode parecer um pouco diferente, mas ainda assim deveria ser óbvio o que lá encontre.
 
 - Abra a [página exemplo](debugging/index.html) no Chrome.
 - Ative as ferramentas do desenvolvedor com `key:F12` (Mac: `key:Cmd+Opt+I`).
@@ -20,7 +20,7 @@ Aqui está o que poderá ver, se o estiver a fazer pela primeira vez:
 
 O botão de alternador <span class="devtools" style="background-position:-172px -98px"></span> abre o separador com os ficheiros.
 
-Vamos clicar nele, e selecionar `hello.js` na vista de árvore de recursos apresentada. Aqui está o que deveria ser mostrado:
+Vamos clicar nele, e selecionar `hello.js`  na vista de árvore de recursos apresentada. Aqui está o que deveria ser mostrado:
 
 ![](chrome-tabs.svg)
 
@@ -46,31 +46,32 @@ Por exemplo, aqui `1+2` resulta em `3`, e `hello("debugger")` não retorna nada,
 
 Vamos examinar o que se passa dentro do código da  [página exemplo](debugging/index.html). Em `hello.js`, clique no número de linha `4`. Sim, exatamente sobre o dígito `4`, não sobre o código.
 
-Parabéns! Você estabeleceu um ponto-de-interrupção (*breakpoint*). Por favor, clique também no número de linha `8`.
+Parabéns! Estabeleceu um ponto-de-interrupção (*breakpoint*). Por favor, clique também no número de linha `8`.
 
 Deveria se parecer com (a azul é onde deveria ter clicado):
 
 ![](chrome-sources-breakpoint.svg)
 
-Um *breakpoint* é um ponto no código onde o *debugger* (depurador de erros) irá automáticamente fazer uma pausa na execução do JavaScript.
+Um *breakpoint* é um ponto no código onde o *debugger* (depurador de erros) irá automáticamente efetuar uma pausa na execução do JavaScript.
 
 Enquanto a execução do código estiver suspensa, podemos examinar variáveis correntes, executar comandos na consola, etc. Por outras palavras, podemos nele depurar erros (*debug it*).
 
 Podemos sempre encontrar uma lista de *breakpoints* no painel à direita. É útil quando temos muitos *breakpoints* em vários ficheiros. Ela permite-nos:
+
 - Rápidamente saltar para a linha do breakpoint no código (ao clicar sobre ele no painel à direita).
 - Temporáriamente desativar o breakpoint, ao desmarcá-lo (*unchecking it*).
 - Remover o breakpoint, clicando com o botão direito do rato e selecionando *Remove*.
 - ...E assim por diante.
 
 ```smart header="*Breakpoints* condicionais"
-*Clicando com o botão direito do rato* sobre um número de linha nos permite criar um *breakpoint condicional*. Apenas será ativado quando a expressão inserida for verdadeira.
+*Clicando com o botão direito do rato* sobre um número de linha permite-nos criar um *breakpoint condicional*. Apenas será ativado quando a expressão inserida for verdadeira.
 
 É prático quando apenas precisarmos de parar para um certo valor numa variável, ou para certos parâmetros numa função.
 ```
 
 ## O comando *debugger*
 
-Podemos também pausar o código utilizando o comando `debugger`, desta forma:
+Podemos também suspender o código utilizando o comando `debugger`, desta forma:
 
 ```js
 function hello(name) {
@@ -86,10 +87,9 @@ function hello(name) {
 
 É muito conveniente quando estivermos num editor de código e não quisermos mudar para o navegador, e de seguida, nas ferramentas do desenvolvedor deste, procurar no programa (*script*) pelo local onde colocar o breakpoint.
 
-
 ## Pause e dê uma vista de olhos
 
-No nosso exemplo, `hello()` é chamada durante o carregamento da página, assim a forma mais fácil para ativar o *debugger* (depois de termos colocado os *breakpoints*) é recarregar a página. Assim, vamos pressionar `key:F5` (Windows, Linux) ou `key:Cmd+R` (Mac).
+No nosso exemplo, `hello()` é chamada durante o carregamento da página, assim a forma mais fácil para ativar o *debugger* (depois de termos colocado os *breakpoints*) é refrescar (*reload*) a página. Assim, vamos pressionar `key:F5` (Windows, Linux) ou `key:Cmd+R` (Mac).
 
 Como o breakpoint está estabelecido, é feita uma pausa na execução na quarta linha:
 
@@ -99,16 +99,17 @@ Por favor, abra as secções de dropdown informacionais à direita (possuem etiq
 
 1. **`Watch` -- mostra valores correntes de expressões.**
 
-    Pode clicar no mais `+` e inserir uma expressão. O *debugger* mostrará o seu valor em qualquer altura, e é automáticamente recalculado ao longo do processo de execução.
+    Pode clicar no mais `+` e inserir uma expressão. O *debugger* mostrará o seu valor em qualquer momento, e é automáticamente recalculado ao longo do processo de execução.
 
 2. **`Call Stack` -- mostra a sequência de chamadas de funções aninhadas.**
 
-    No presente momento, o *debugger* está dentro da chamada a `hello()`, invocada por código em `index.html` (não a partir de uma função, por isso o nome "*anonymous*" ["anónimo"]).
+    No presente momento, o *debugger* está dentro da chamada a `hello()`, invocada por código em `index.html` (não a partir de uma função, por isso o nome "*anonymous*").
 
     Se clicar num item nessa pilha (*stack*) (por exemplo, em "*anonymous*"), o *debugger* saltará para o código correspondente, e todas as suas variáveis poderão ser igualmente examinadas.
+
 3. **`Scope` -- variables atuais.**
 
-    `Local` mostra variáveis locais de funções. Também, poderá ver os seus valores destacados exatamente sobre o código-fonte.
+    `Local` mostra variáveis locais de funções. Também, poderá ver os seus valores em destaque exatamente sobre o código-fonte.
 
     `Global` possui variáveis globais (aquelas fora de qualquer função).
 
@@ -119,43 +120,80 @@ Por favor, abra as secções de dropdown informacionais à direita (possuem etiq
 Agora, é altura para *rastrearmos* (*trace*) o código.
 
 Existem botões para isso no topo do painel direito. Vamos interagir com eles.
-<!-- https://github.com/ChromeDevTools/devtools-frontend/blob/master/front_end/Images/src/largeIcons.svg -->
+
 <span class="devtools" style="background-position:-146px -160px"></span> -- "Resume": continue a execução, atalho (*hotkey*) `key:F8`.
 : Retoma a execução. Se não houver *breakpoints* adicionais, a execução simplesmente prossegue e o *debugger* perde o controlo.
 
   Aqui está o que poderemos ver após um clique sobre ele:
 
   ![](chrome-sources-debugger-trace-1.svg)
 
-  A execução prosseguiu, atingiu outro *breakpoint* dentro de `say()` e fez uma pausa lá. Dê uma vista de olhos sobre a "*Call stack*" à direita. Aumentou por mais uma chamada. Estamos dentro de `say()` agora.
+  A execução prosseguiu, atingiu outro *breakpoint* dentro de `say()` e foi suspensa lá. Dê uma vista de olhos sobre a "*Call stack*" à direita. Aumentou por mais uma chamada. Estamos dentro de `say()` agora.
 
 <span class="devtools" style="background-position:-200px -190px"></span> -- "Step": execute o próximo comando, atalho (*hotkey*) `key:F9`.
 : Executa a próxima instrução. Se o clicarmos agora, o `alert` será mostrado.
 
-    Clicando repetidamente irá percorrer todas as instruções do *script*, uma a uma.
+<<<<<<< HEAD
+  Continuando a clicar nele, passará por todas as instruções do programa, uma por uma.
 
 <span class="devtools" style="background-position:-62px -192px"></span> -- "Step over": execute o próximo comando, mas *mas não vá para dentro de uma função*, atalho `key:F10`.
-: Similar ao comando "Step" anterior, mas com um comportamento diferente se a instrução seguinte for uma chamada de função. Isto é: não uma incorporada (*built-in*), como `alert`, mas uma função sua.
+: Similar ao comando "Step" anterior, mas com um comportamento diferente se a próxima instrução for uma chamada de função. Isto é: não uma incorporada (*built-in*), como `alert`, mas uma função sua.
+=======
+There are buttons for it at the top of the right panel. Let's engage them.
+<!-- https://github.com/ChromeDevTools/devtools-frontend/blob/master/front_end/Images/src/largeIcons.svg -->
+<span class="devtools" style="background-position:-146px -168px"></span> -- "Resume": continue the execution, hotkey `key:F8`.
+: Resumes the execution. If there are no additional breakpoints, then the execution just continues and the debugger loses control.
+>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
 
-    O comando "Step" vai para dentro dela e pausa a execução na sua primeira linha, enquanto "Step over" executa a chamada de função invisivelmente, saltando o interior da função.
+  O comando "Step", vai para dentro dela e suspende a execução na sua primeira linha, ao contrário de "Step over" que executa essa chamada de função aninhada invisívelmente, saltando sobre o funcionamento interno da função.
 
-    A execução faz depois uma pausa imediatamente depois da função.
+  É feita uma pausa na execução imediatemente depois dessa função.
 
-    Isto, é bom se você não estiver interessado em ver o que acontece dentro da função.
+  É bom, se não estivermos interessados em ver o que acontece dentro da chamada de função.
 
+<<<<<<< HEAD
 <span class="devtools" style="background-position:-4px -194px"></span> -- "Step into", atalho `key:F11`.
-: É similar a "Step", mas com um comportamento diferente no caso de chamadas de funções assíncronas. Se você estiver a começar a aprender JavaScript, então pode ignorar a diferença, porque ainda não temos chamadas assíncronas.
+: Similar a "Step", mas com um comportamento diferente no caso de chamadas de funções assíncronas. Se estiver a começar a aprender JavaScript, então poderá ignorar a diferença, porque ainda não temos chamadas assíncronas.
 
-    Futuramente, apenas tome nota que o comando "Step" ignora ações assíncronas, tais como `setTimeout` (chamada de função agendada), que são executadas mais tarde. O "Step into", vai para dentro do seu código, esperando pela sua execução se necessário. Para mais detalhes, veja o [DevTools manual](https://developers.google.com/web/updates/2018/01/devtools#async).
+  Futuramente, apenas tome nota que o comando "Step" ignora ações assíncronas, tais como `setTimeout` (chamada de função agendada), que são executadas mais tarde. O "Step into", vai para dentro do seu código, esperando pela sua execução se necessário. Para mais detalhes, veja o [DevTools manual](https://developers.google.com/web/updates/2018/01/devtools#async).
 
 <span class="devtools" style="background-position:-32px -194px"></span> -- "Step out": continue a execução até ao fim da função atual, atalho `key:Shift+F11`.
-: Continua a execução e faz uma pausa na última linha da função atual. É útil quando acidentalmente entrámos para uma chamada aninhada usando <span class="devtools" style="background-position:-200px -190px"></span>, mas ela não nos interessa, e queremos prosseguir para o seu final o mais rápidamente possível.
+: Continue a execução e a faça uma pausa na última linha da função atual. É útil quando acidentalmente entrámos para uma chamada aninhada usando <span class="devtools" style="background-position:-200px -190px"></span>, mas ela não nos interessa, e queremos prosseguir para o seu final o mais rápidamente possível.
 
 <span class="devtools" style="background-position:-61px -74px"></span> -- ative/desative todos os *breakpoints*.
 : Esse botão não move a execução. Simplesmente liga/desliga *breakpoints* em grupo.
 
 <span class="devtools" style="background-position:-90px -146px"></span> -- ative/desative a pausa automática em caso de erro.
-: Quando ativo, e as ferramentas do desenvolvedor estiverem abertas, um erro no código automáticamente pausa a sua execução. Então, poderemos analisar variáveis para ver o que ocorreu de errado. Assim, se o código falhar por um erro, podemos abrir o *debugger*, ativar esta opção e recarregar a página, afim de vermos onde falhou e qual o contexto nesse momento.
+: Quando ativo, e as ferramentas do desenvolvedor estão abertas, um erro no código automáticamente suspende a sua execução. Então, poderemos analizar variáveis para ver o que ocorreu de errado. Assim, se o código falhar por um erro, pode-se abrir o *debugger*, ativar esta opção e refrescar a página, afim de se observar onde falhou e qual o contexto nesse momento.
+=======
+<span class="devtools" style="background-position:-200px -190px"></span> -- "Step": run the next command, hotkey `key:F9`.
+: Run the next statement. If we click it now, `alert` will be shown.
+
+    Clicking this again and again will step through all script statements one by one.
+
+<span class="devtools" style="background-position:-62px -192px"></span> -- "Step over": run the next command, but *don't go into a function*, hotkey `key:F10`.
+: Similar to the previous the "Step" command, but behaves differently if the next statement is a function call. That is: not a built-in, like `alert`, but a function of our own.
+
+    The "Step" command goes into it and pauses the execution at its first line, while "Step over" executes the nested function call invisibly, skipping the function internals.
+
+    The execution is then paused immediately after that function.
+
+    That's good if we're not interested to see what happens inside the function call.
+
+<span class="devtools" style="background-position:-4px -194px"></span> -- "Step into", hotkey `key:F11`.
+: That's similar to "Step", but behaves differently in case of asynchronous function calls. If you're only starting to learn JavaScript, then you can ignore the difference, as we don't have asynchronous calls yet.
+
+    For the future, just note that "Step" command ignores async actions, such as `setTimeout` (scheduled function call), that execute later. The "Step into" goes into their code, waiting for them if necessary. See [DevTools manual](https://developers.google.com/web/updates/2018/01/devtools#async) for more details.
+
+<span class="devtools" style="background-position:-32px -194px"></span> -- "Step out": continue the execution till the end of the current function, hotkey `key:Shift+F11`.
+: Continue the execution and stop it at the very last line of the current function. That's handy when we accidentally entered a nested call using <span class="devtools" style="background-position:-200px -190px"></span>, but it does not interest us, and we want to continue to its end as soon as possible.
+
+<span class="devtools" style="background-position:-61px -74px"></span> -- enable/disable all breakpoints.
+: That button does not move the execution. Just a mass on/off for breakpoints.
+
+<span class="devtools" style="background-position:-90px -146px"></span> -- enable/disable automatic pause in case of an error.
+: When enabled, and the developer tools is open, a script error automatically pauses the execution. Then we can analyze variables to see what went wrong. So if our script dies with an error, we can open debugger, enable this option and reload the page to see where it dies and what's the context at that moment.
+>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
 
 ```smart header="Continue até aqui"
 Ao clicar com o botão direito do rato sobre uma linha de código, abre-se o menu de contexto com uma valiosa opção com o nome "Continue até aqui" (*Continue to here*).
@@ -165,7 +203,7 @@ Ao clicar com o botão direito do rato sobre uma linha de código, abre-se o men
 
 ## Logging
 
-Para mostrar na consola algo existente no código, existe a função `console.log`.
+Para mostrar algo existente no código na consola, existe a função `console.log`.
 
 Por exemplo, isto mostra os valores de `0` a `4` na consola:
 
@@ -176,21 +214,28 @@ for (let i = 0; i < 5; i++) {
 }
 ```
 
-Utilizadores comuns não vêm essa saída (*output*), ela está na consola. Para a ver, abra o separador Console nas ferramentas do desenvolvedor, ou pressione `key:Esc` se estiver num outro separador: isso abre a consola embaixo nesse separador.
+Utilizadores comuns não vêm essa saída (*output*), ela estará na consola. Para a ver, abra o separador Console nas ferramentas do desenvolvedor, ou pressione `key:Esc` se estiver num outro separador - isso abre a consola abaixo nesse separador.
 
-Se tivermos mensagens (*logging*) suficientes no nosso código, então poderemos ver o que nele se passa a partir desses registos, dispensando o *debugger*.
+Se mostrarmos mensagens (*logging*) suficientes no nosso código, então poderemos ver o que nele se passa a partir desses registos, dispensando o *debugger*.
 
 ## Resumo
 
-Como podemos ver, existem três formas principais para fazer uma pausa num *script*:
+<<<<<<< HEAD
+Como podemos ver, existem três formas principais para efetuar uma pausa num *script*:
 1. Um *breakpoint* (ponto-de-interrupção).
 2. As instruções `debugger`.
 3. Um erro (se as ferramentas do desenvolvedor [*dev tools*] estiverem abertas, e o botão <span class="devtools" style="background-position:-90px -146px"></span> estiver "ativo").
+=======
+As we can see, there are three main ways to pause a script:
+1. A breakpoint.
+2. The `debugger` statements.
+3. An error (if dev tools are open and the button <span class="devtools" style="background-position:-90px -146px"></span> is "on").
+>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
 
 Enquanto suspenso, podemos depurar erros - examinar variáveis e rastear o código para ver onde a sua execução contém erros.
 
-Existem muitas mais opções nas ferramentas do desenvolvedor do que as cobertas aqui. O manual completo está em <https://developers.google.com/web/tools/chrome-devtools>.
+Existem muitas mais opções nas ferramentas do desenvolvedor do que as cobertas aqui. O manual completo está em <https://developers.google.com/web/tools/chrome-devtools> (no topo, à direita, poderá escolher o idioma).
 
-A informação neste capítulo é suficiente para iniciar a depuração de erros (o *debugging*), mas mais tarde, especialmente se trabalhar muito com o navegador, por favor consulte o manual e procure por funcionalidades mais avançadas nas ferramentas do desenvolvedor.
+A informação neste capítulo é suficiente para iniciar a depuração de erros (o *debugging*), mas mais tarde, especialmente se trabalhar muito com o navegador (*browser*), por favor consulte o manual e procure por capacidades mais avançadas de ferramentas do desenvolvedor.
 
 Oh, também pode clicar em vários locais nas *dev tools* e ver o que acontece. Provávelmente, é a rota mais rápida para aprender sobre as *dev tools*. Não se esqueça de também clicar com o botão direito do rato e dos menus de contexto!