[SEB FE] Section4 unit7 TDD - Test Builder (과제)

STEP ONE

detectNetwork.js

function detectNetwork(cardNumber) {
  /**
   * 주의사항: 'cardNumber'는 항상 문자열입니다.
   * 'Diner's Club' 카드 번호는 항상 38이나 39로 시작을 하고, 14 자리 숫자입니다.      => 조건 (slice(0,2), length)
   * 'American Express' 카드 번호는 항상 34 나 37로 시작하고, 15 자리 숫자입니다.     => 조건 (slice(0,2), length)
   * 이 글을 읽으셨다면, detectNetwork함수가 'Diner's Club', 'American Express'를
   * 정확히 검사할 수 있도록 만들고 브라우저 console 화면으로 돌아가세요.
   */

  if ((cardNumber.slice(0,2) === '38' || '39') 
      && (cardNumber.length === 14)) return "Diner's Club";
  else if ((cardNumber.slice(0,2) === '34' || '37') 
           && (cardNumber.length === 15)) return "American Express";

detectNetwork.test.js

describe("Diner's Club", function() {
 // 주의하세요, 테스트에도 버그가 존재할 수 있습니다...

 it("has a prefix of 38 and a length of 14", function() {
   if (detectNetwork("38345678901234") !== "Diner's Club") {
     throw new Error("Test failed");
   }
 });

 it("has a prefix of 39 and a length of 14", function() {
   if (detectNetwork("39345678901234") !== "Diner's Club") {
     throw new Error("Test failed");
   }
 });
});

describe("American Express", function() {
 // 항상 if/throw 구문으로 오류를 체크하는 것은 귀찮은 일이기 때문에,
 // 여기에 도움을 줄 수 있는 함수를 하나 제공했습니다. 입력값이 true가 아닐 경우 에러를 발생시킵니다.
 let assert = function(isTrue) {
   if (!isTrue) {
     throw new Error("Test failed");
   }
 };

 it("has a prefix of 34 and a length of 15", function() {
   assert(detectNetwork("343456789012345") === "American Express");
 });

 it("has a prefix of 37 and a length of 15", function() {
   assert(detectNetwork("373456789012345") === "American Express");
 });
});

테스트를 이런 식으로 수정했어야 하는 모양
근데 그래서 뭔가 재밌었다...ㅋㅋㅋㅋㅋㅋ 취향이었음
암튼 여기까지 하면 "Diner's Club" 과 "American Express"는 구분할 수 있게 되었고..
근데 여기서 이상했던 건 숫자 개수만 맞아도 나왔다는 것이다
&& 연산자를 사용했는데도 그래서 뭔가 의아했는데 아직도 원인을 모르겠음

STEP TWO

detectNetwork.js

❌❌❌❌❌

if ((cardNumber.slice(0,1) === '4')) {
    if (cardNumber.length === 13 || 16 || 19) {
      return "Visa";
    }
  } else if ((cardNumber.slice(0,2) === '51' || '52' || '53' || '54' || '55')) {
      if (cardNumber.length === 16) {
        return "MasterCard";
    } 
  } 

이건 이중 조건문을 썼던 이유가.. 스텝3에서 나오는데
그냥 길이가 16이기만 해도 계속 마스터카드가 나와서..^^
이게 아마 바로 전 문제랑 연결 됐던 ㄱㅔ 아니었을까..?
이렇게 해서 스텝2는 통과가 되지만... 3는 되지 않는다

detectNetwork.test.js

describe("Visa", function() {
  // Chai는 테스트에 필요한 헬퍼 함수들이 담긴 라이브러리입니다!
  // Chai는 이전에 만들었던 assert 함수와 동일한 기능을 하는 assert 함수를 제공합니다.
  // Chai가 제공하는 assert 함수를 어떻게 사용하는지 웹사이트의 공식 문서를 참고해보세요.
  //   http://chaijs.com/
  let assert = chai.assert;

  it("has a prefix of 4 and a length of 13", function() {
    assert(detectNetwork("4123456789012") === "Visa");
  });

  it("has a prefix of 4 and a length of 16", function() {
    assert(detectNetwork("4123456789012345") === "Visa");
  });

  it("has a prefix of 4 and a length of 19", function() {
    assert(detectNetwork("4123456789012345678") === "Visa");
  });
});

describe("MasterCard", function() {
  // Chai는 좀 더 영어 문법에 가까운 코드로 테스트를 작성할 수 있게 도와줍니다.
  // Expect 문법은 그 중 한가지이며, 다른 문법도 있습니다.
  // 이와 관련해 더 알고 싶다면, 공식 문서를 참고하세요.
  //   http://chaijs.com/api/bdd/
  let expect = chai.expect;

  it(FILL_ME_IN, function() {
    expect(detectNetwork("5112345678901234")).to.equal("MasterCard");
  });

  it(FILL_ME_IN, function() {
    expect(detectNetwork("5212345678901234")).to.equal("MasterCard");
  });

  it(FILL_ME_IN, function() {
    expect(detectNetwork("5312345678901234")).to.equal("MasterCard");
  });

  // expect 대신에 should라는 문법을 사용해서 스타일을 조금 변경할 수도 있습니다.
  // 사실 둘 중 어떤 것을 사용하는지는 중요하지 않습니다.
  // 스타일에 관련해서는 다음 사이트를 참조하세요. http://chaijs.com/guide/styles/
  // 다만 중요한 것은 스타일의 일관성을 유지하는 것입니다.
  // (우리는 공부를 하는 중이기 때문에 두가지 방법 모두를 사용해 보았습니다.)
  // 테스트를 작성하는 중에, 두가지 방법을 동시에 사용하려고 하면 진행되지 않을 것입니다.
  // expect나 should 둘 중에 한가지 방법을 선택해서 사용하세요.
  let should = chai.should();

  it("has a prefix of 54 and a length of 16", function() {
    detectNetwork("5412345678901234").should.equal('MasterCard');
  });

  it("has a prefix of 55 and a length of 16", function() {
    detectNetwork("5512345678901234").should.equal('MasterCard');
  });
});

https://www.chaijs.com/
참고해서 expert와 should 에 대한 공부가 필요했다.

npm install chai

STEP THREE

처음에 내가 썼던 코드 ❌

detectNetwork.js

  else if ((cardNumber.slice(0,4) === '6011') || 
           cardNumber.slice(0,2) === '65' || 
           (Number(cardNumber.slice(0,3)) >= 644 && 
            Number(cardNumber.slice(0,3))<= 649)){
   		 if (cardNumber.length === 16 || 19) {
   		   return "Discover" 
    	}
  } 

detectNetwork.test.js

describe("Discover", function() {
  // 함수가 없는 테스트는 "pending"이라는 표시가 뜨며 실행되지 않습니다.
  // 아래 테스트를 작성하고 테스트가 통과하도록 만드십시오.

    let should = chai.should();
    
    // 함수가 없는 테스트는 "pending"이라는 표시가 뜨며 실행되지 않습니다.
    
    // 아래 테스트를 작성하고 테스트가 통과하도록 만드십시오.
    
    
    it("has a prefix of 6011 and a length of 16", function(){
      detectNetwork("6011123456789012").should.equal("Discover")
    });
    
    it("has a prefix of 6011 and a length of 19", function(){
     detectNetwork("6011123456789012345").should.equal("Discover")
    });
    
    for( let prefix = 644; prefix < 650; prefix++){
      it('has a prefix of ' + prefix + ' and a length of 16', function(){
      detectNetwork(prefix.toString() + '1234567890123').should.equal("Discover")
      });
    }
    
    for( let prefix = 644; prefix < 650; prefix++){
      it('has a prefix of ' + prefix + ' and a length of 19', function(){
      detectNetwork(prefix.toString() + '1234567890123456').should.equal("Discover")
      });
    }
    
    it("has a prefix of 65 and a length of 16", function(){
      detectNetwork("6512345678901234").should.equal("Discover")
    });
    
    it("has a prefix of 65 and a length of 19", function(){
      detectNetwork("6512345678901234567").should.equal("Discover")
    });
});

내가 볼 땐 처음부터 어딘가가 잘못된거다... 이거...

레퍼런스 코드 📌

detectNetwork.js

 var detectNetwork = function(cardNumber) {
  /**
   * 주의사항: 'cardNumber'는 항상 문자열입니다.
   * 'Diner's Club' 카드 번호는 항상 38이나 39로 시작을하고, 14 자리 숫자입니다.
	@@ -20,10 +20,10 @@
   * 정확히 검사할 수 있도록 만들고 브라우저 console 화면으로 돌아가세요.
   */

  var cardNumberTwo = cardNumber.slice(0,2);
  var cardNumberThree = cardNumber.slice(0,3);
  var cardNumberFour = cardNumber.slice(0,4);
  var cardLength = cardNumber.length;

  if((cardNumberTwo === '38' || cardNumberTwo === '39') && cardLength === 14) {
    return 'Diner\'s Club';
  }
  else if ((cardNumberTwo === '34' || cardNumberTwo === '37') && cardLength === 15) {
    return 'American Express';
  }
  else if (cardNumber[0] === '4' && ([13,16,19].indexOf(cardLength) > -1) && ['4903','4905','4911','4936'].indexOf(cardNumberFour) === -1) {
    return 'Visa';
  }
  else if (Number(cardNumberTwo) >= 51 && Number(cardNumberTwo) <= 55 && cardLength === 16) {
    return 'MasterCard';
  }
  else if( cardNumberTwo === '65' || cardNumberFour === '6011' || (Number(cardNumberThree) >= 644 && Number(cardNumberThree) <= 649) && ([16,19].indexOf(cardLength) > -1)) {
    return 'Discover';
  }
};

detectNetwork.test.js

describe("Discover", function() {
  // 함수가 없는 테스트는 "pending"이라는 표시가 뜨며 실행되지 않습니다.
  // 아래 테스트를 작성하고 테스트가 통과하도록 만드십시오.
  let should = chai.should();
  //scope가 달라지므로 사용하고자 한다면 꼭 다시 불러와야 합니다.
  //let expect = chai.expect;
  it('has a prefix of 6011 and a length of 16', function() {
    should.equal(detectNetwork("6011123456789012"), "Discover");
    //expect(detectNetwork("6011123456789012")).to.equal("Discover");
  });
  it('has a prefix of 6011 and a length of 19', function() {
    should.equal(detectNetwork("6011123456789012345"), "Discover");
    //expect(detectNetwork("6011123456789012345")).to.equal("Discover");
  });
  it('has a prefix of 65 and a length of 16', function() {
    should.equal(detectNetwork("6512345678901234"), "Discover");
    //expect(detectNetwork("6512345678901234")).to.equal("Discover");
  });
  it('has a prefix of 65 and a length of 19', function() {
    should.equal(detectNetwork("6512345678901234567"), "Discover");
    //expect(detectNetwork("6512345678901234567")).to.equal("Discover");
  });
  for (let i = 644; i <= 649; i++) {
    it(`has a prefix of ${i} and a length of 16`, function() {
      should.equal(detectNetwork(`${i}1234567890123`), "Discover");
      //expect(detectNetwork(`${i}1234567890123`)).to.equal("Discover");
    });
    it(`has a prefix of ${i} and a length of 19`, function() {
      should.equal(detectNetwork(`${i}1234567890123456`), "Discover");
      //expect(detectNetwork(`${i}1234567890123456`)).to.equal("Discover");
    });
  }
});

일단 indexOf 메소드 를 사용한 것부터
봐야할 부분이 투성이었다