c29130811

아래와 같은 1, 2, 3 등 값의 통해 Cell 안에 그래프를 표기하는 방법 스프레드 시트에 Test Case를 관리하다 보니, 한눈에 결과 처리 되는 것을 보고 싶은게 나의 니즈 사항이였고, 수치를 볼것인가 가시적으로 볼 것인가 찾아보고 있었다. 그냥 이쁘게 삽질하고 싶었음.. 잠깐만 봐도 수식이 매우 더럽다..ㅋㅋㅋㅋ SPARKLINE(A2:E2,{"charttype","bar";"max",40}) 이런 식으로 첫번째는 데이터의 범위 또는 배열과 두번째는 차트의 옵션을 취한다. chattyp은 위에 보다시피 bar, line, column 등이 있고, color는 1, 2까지 설정이 가능하다. 색상이 2개까지 되다 보니, 미 진행인 부분과 Fail 로 인해 결과 처리 되는 것까지만 입력을 시켰다. ..

CSS (Cascading Style Sheet) 의 약자로 HTML 문서를 꾸며주는(Style) 역할을 하며, 우선 순위와 상속에 따라 스타일 규칙이 적용 됨. CSS의 작성 .content { color: black; font-style: italic; } HTML 요소에서 Style을 적용할 요소를 선택 후, {} 중괄호에 CSS Style의 속성과 값의 형태를 입력하여 지정 함. CSS Specifications 모든 웹 표준 기술(HTML, CSS, Javascript)은 표준 조직 (W3C, WHATWG, ECMA, Khronos) 에서 게시한 문서로 정의된다고 함. ECMA - MDN Web Docs Glossary: Definitions of Web-related terms | MDN Ec..

흔한 회고 글 작년의 나는 어땠을까 블로그 글도 소홀했고, 일도 많은 부분에 아쉬움이 남았으며, 투자도 쉽지 않았고, 개인 역량도 운동도 많은 부분에서 된 게 없는 아쉽기만 한 한해로 기억이 난다. 정말 이룬 게 없는 한 해가 되다 보니 자괴감이 드는군 ㅋㅋ 우선 크게 QA 팀에 신규 입사자분들이 와서 늘어났지만, 아직 많은 부분에서 합이 안 맞았고, 이슈가 여럿 보이기 시작했다. 또한 프로젝트가 늘어나면서 필리핀에 계신 QA 분과도 협업을 하게 되는 것 등 일이 많았다. (세상에 왜 이리 뭔가 이슈가 많지?) 연말부터 우선 QA 팀의 협업을 맞춰보기 위해 draw.io 에서 QA Process에 맞춰 우리가 하는 것들을 정리해보기로 했다. 또한 간단히 주에 한 번씩 우리가 했던, 해갈 것들에 대해 간단..

보통 이슈로 등록한 티켓들은 개발 단에 Client 단의 이슈인지, Back 단의 이슈인지 핑퐁을 하다가 정착을 한다. 물론 QA에서 어디 단에 이슈인지 명확히 알고 할당(Assign)을 하면 다행이지만, 우리가 다 어떻게 알겠는가?!!? ㅋㅋㅋ 그리고 할당을 했다고 하더라도 개발의 수정 방향에 따라 Back 단에 이슈를 Front에서 처리하거나 할 수 있지 않는가? (응답이 2xx라는 가정하에서만) 그래도 이슈를 파악하기 위해 Back 단의 이슈인지 Front 단에 이슈인지 개발자 도구까지 꺼내 볼 줄 안다면 개발자들과의 대화가, 업무가, 내 이해도가, 나의 업무 퀄리티가 높아지지 않겠는가? 그렇다. 크롬의 개발자 도구와 친해져 보자! 이 창에서는 너무 많은 정보를 우리에게 끊임없이 제공해주려고 하는데..

Terms Black-box testing, code coverage, functional testing, interoperability testing, load testing, maintainability testing, performance testing, portability testing, reliability testing, security testing, specification-based testing, stress testing, structure testing, usability testing, white-box testing. Background A group of test activities can be aimed at verifying the software system (or a ..

변수와 상수, 함수의 이름을 식별자(identifier)라고 하며, 다음과 같은 규칙을 따른다. 반드시 글자나, 달러 기호($), 밑줄(_)로 시작한다. 글자와 숫자, 달러 기호, 밑줄만 쓸 수 있다. 𝜋 나 ⊇ 같은 유니코드 문자도 가능하다. 예약어는 식별자로 쓸 수 없다. (ex. function, break, case, catch 등.. 자세한건 mozilla 참고) 자바 스크립트에서 식별자 표기법은 여러가지이지만, 가장 널리 쓰는 두 가지는 아래와 같음. 카멜 케이스 (camel case) currentTime, userName, userAgent 등 중간중간의 대문자가 낙타의 혹처럼 보인다고 해서 지어진 표기법 스네이크 케이스 (snake case) current_time, user_name, ..

우리는 하루에도 열심히 Jira나 Mantis나 우리가 관리하는 Bug Tracking System에 많은 티켓들을 생성한다.이렇게 생성된 버그나 결함 티켓에는 많은 정보를 갖고 있으며, 다른 사람들에게 공유되고, 판단하게 하는 기준이 되기도 한다. 쓰다 보면 개발자와, 기획자와 디자이너와 사담이 많아지는 경우가 더러 많더라.그 당시에는 쓴다고 썼는데, 또다시 읽어보면 오탈자라든지, 내용이 맞지 않다던지 산으로 가고 있더라지?간단하지만 중요한걸 왜 이리 넘겼나 싶다.  생각해보면, 우리가 등록한 버그나 결함 티켓에는 이슈에 대한 기본 정보부터 릴리즈를 할 수 있냐 없냐의 정보까지 갖고 있는 엄청난 녀석이다.  그렇지만 우린 바쁘다는 핑계로 항상 대충 적고 있진 않았을까? 반성을 해보자. 내가 쓴 글을 관..

docs.cypress.io/guides/references/best-practices Best Practices | Cypress Documentation Real World Practices The Cypress team maintains the Real World App (RWA), a full stack example application that demonstrates best practices and scalable docs.cypress.io 보통, 자동화를 시작하게 되면 selector부터 찾다가 선택할 수 없는 값이 없다면 대게 Xpath를 사용하게 되는 거 같다. * Xpath 사용법 (바로가기) 하지만 개인적으로 Xpath는 의미(semantic)를 파악하기 쉽지 않으며, tag가 달..

테스트 하려는 web에서 파일 업로드가 있는 경우, 아래 npm 모듈을 통해 지원이 가능하다. www.npmjs.com/package/cypress-file-upload cypress-file-uploadA Cypress command for file uploadwww.npmjs.com각 여러가지 형태로 지원이 된다.  // HTML5 file inputcy.get('[data-cy="file-input"]') .attachFile('myfixture.json');// Attaching multiple filescy.get('[data-cy="file-input"]') .attachFile(['myfixture1.json', 'myfixture2.json']);// Drag-n-drop component..

Cypress는 사용자 임의적 Command 생성 및 사용에 대해 지원을 해준다. (공식 사이트) Cypress > Support > commands.js 에 Command 를 등록 및 사용을 하면 된다. 가령 예제로, inputValue 라는 나만의 Command를 만들어볼 경우, commands.js 에 아래와 같이 등록을 한다. 등록 Cypress.Commands.add('inputValue', (selector, value) => { cy.get(selector) .type(value) .should('have.value', value) }) selector에 value 값을 입력하고, value가 출력되는지 확인하는 command를 작성 사용 it('input에 text 값이 입력되어야 한다.'..