Front End Development Libraries - Javascript calculator test 9 wont pass

[rafafb1997]

Hi, im currently doing the JavaScript calculator project and the test 9 wont pass, but i cant really find where the problem is.

I have dig into the test file and test 9 consists of two simple expressions, and apparently it passes the first one only.

Here is the JavaScript code:

//funcion para limpiar el display  
const clearDisplay = () => {
  $(document).ready(function(){
    $("#display").html("0");
  });
}

let op = false;

$(document).ready(function(){
  // jQuery para introducir numeros en el display, tambien está implementado el que no haya numeros que empiecen por multiples zeros
  $(".btn-primary").click(function(){
   if($("#display").html() === "0" | op){
    $("#display").html($("#" + this.id).html());
    op = false;
   } else {
    $("#display").append($("#" + this.id).html());
   }
    
   });
  
 //Bloque p de codigo para las operaciones, implementado para que solo se pueda poner un simbolo despues de un numero
 
  $(".btn-secondary").click(function(){
   let x = $("#display").html(); 
   let pattern = /.*\d$/;
   if(pattern.test(x)){
    $("#display").append($("#" + this.id).html());
     op = false;
   }
   
   });
  
   //Bloque de codigo para el resultado
  $("#equals").click(function(){
   let x = $("#display").html();
   $("#display").html(eval(x));
   op = true;
  });
 
  
});

And the Html:

<div class="calculator container-md py-1">
  <!--<div class="row px-1">
    <p class="col-12 text-end result">01234567890</p>
  </div>-->
  <div class="row px-1">
    <p id="display" class="col-12 text-end current">0</p>
  </div>
  <div class="row px-1">
   <button id="clear" class="col-6 btn btn-danger" onclick="clearDisplay()">AC</button>
   <button id="divide" class="col-3 btn btn-secondary ">/</button>
   <button id="multiply" class="col-3 btn btn-secondary">*</button>
  </div>
  <div class="row px-1">
    <button id="seven" class="col-3 btn btn-primary">7</button>
    <button id="eight" class="col-3 btn btn-primary" >8</button>
    <button id="nine" class="col-3 btn btn-primary">9</button>
    <button id="subtract" class="col-3 btn btn-secondary">-</button>
  </div>
  <div class="row px-1">
    <button id="four" class="col-3 btn btn-primary">4</button>
    <button id="five" class="col-3 btn btn-primary" >5</button>
    <button id="six" class="col-3 btn btn-primary">6</button>
    <button id="add" class="col-3 btn btn-secondary">+</button>
  </div>
  <div class="row px-1">
    <div class="col-9">
      <div class="row">
        <button id="one" class="col-4 btn btn-primary">1</button>
        <button id="two" class="col-4 btn btn-primary" >2</button>
        <button id="three" class="col-4 btn btn-primary">3</button>
      </div>
      <div class="row">
        <button id="zero" class="col-8 btn btn-primary">0</button>
        <button id="decimal" class="col-4 btn btn-primary">.</button>
      </div>
    </div>
    <button id="equals" class="col-3 btn btn-success">=</button>
  </div>
</div>

And the project: https://codepen.io/rafaelmartinezhuertas/full/XWEGLNq

[twhite96]

Seems to be passing now.