2023.12.28 ~ 2023.12.31 

후쿠오카를 같이 갔던 친구들끼리 오사카 교토 여행을 갑니다.

꽉 채운 3박 4일 여행을 가려고 합니다.

4박 5일은 살짝 길기도 하고, 일본의 연말은 모두가 쉬는 분위기라 가게도 문을 많이 닫을 거예요.

새해는 한국에서 보내야죠!

그래서 31일에는 한국으로 오는 일정을 짰습니다.

출발~!

수내역에서 공항버스를 타줍니다.

(친구가 버스 시간을 잘못 알아서 엄청 뛰었어요 ㅋㅋ)

공항버스는 미리 예약을 했어요.

인천공항에 도착 후 입국 수속을 마친 후 

 타코벨에서 간단하게 아침을 먹어줍니다.

https://g.co/kgs/F97kf8q 

비행기를 타고 아시아나 항공에서 주는 기내식도 먹어요.

미소 크림소스 닭고기 백반인데

브로콜리가 들어가서 남겼어요.

고추장을 넣어 먹으면 그나마 먹을만합니다.

이번 일본여행 너무 설레서 전날 밤새고 와서 그런지

기내식 먹느니 잠을 더자고 싶더라고요.

1시간 40분 정도 걸렸고 일찍 도착했습니다.

간사이 국제공항 도착!

도착하자마자 바로 자판기로 일제 음료를 마셔줍니다.

지하철을 타고 덴가차야 역에 내려서 

구름과자 한잔 피워주고요.

편의점 앞에 30% 확률로 재떨이가 있기 때문에 너무 좋았습니다.

첫날 숙소는 호텔 브라이튼 시티 오사카 기타하마 (Hotel Brighton City Osaka Kitahama)

입니다.

https://g.co/kgs/Bv4ndRX 

체크인 전에 왔으니 숙소에 짐을 놔주고 브런치를 먹으러 갑시다.

원래는 오사카 키타하마 레트로를 가려고 했으나

이른 오전에도 줄이 너무 길어서 돌아갔습니다.

https://g.co/kgs/exksYjC 

큰 건물사이 가운데 작은 집이 키타하마 레트로예요 

하늘이 참 맑네요.

일단 걸어줍니다.

걷다가 붕어빵의 아버지 격인 

타이야끼를 먹었습니다.

정말 맛있었어요.

흐물흐물 길거리 붕어빵과는 다른 맛이었어요.

길을 걷다가 쇼핑몰 Lucua (루쿠아)에 도착한 후 

Cafe La Pause에 도착했습니다.

https://g.co/kgs/njjDo25 

딸기 생크림 펜 케이크입니다.

저는 생크림을 잘 못 먹는데

이건 너무 맛있더라고요.

접시를 혀로 설거지해버렸습니다.

레몬 치즈케이크 

이것도 너무 이쁘고 맛있었어요.

저는 아이스크림을 넣은 커피플로트를 마셨습니다.

아이스크림을 수저로 퍼먹어도 되고

녹여서 커피와 같이 마셔도 돼요.

밥 먹고 주술회전 팝업스토어가 있길래 

가서 쇼핑 좀 했습니다.

저는 나루토 20주년 센쥬 하시라마 키링을 샀어요.

이제 제대로 된 한 끼 식사를 하려고

오사카 카미나리 스시로 갑니다.

https://g.co/kgs/B54ZiuZ 

일본에서 첫 끼였기 때문에

신중하게 메뉴를 고르다가

오마카세 12피스짜리를 시켰습니다.

물론 시원한 생맥주도 한잔 시켰고요.

5분 만에 다 먹었습니다.

너무 맛있었고, 사르르 녹았어요.

k-쿠우쿠우 초밥과는 다르게 신선하고 두툼해서 씹는 맛이 일품이었는데 말이죠!

그래서 참치 플래터를 하나 더 시켜서 먹었습니다.

이제야 뭘 먹은 것 같더라고요.

오사카 난바에서 

글리코상 앞에서 사진도 한번 찍어주고요!

총도 한번 쏴주고요

이건 근데 맞춰도 너무 약해서 상품 타기가 쉽지 않더라고요

그래도 재미 삼아 한번 해봤습니다.

오사카 신세카이도 한번 봐주고요.

요코즈나 쿠시카츠에 들어가 튀김 꼬치를 먹었습니다.

https://g.co/kgs/ewNJycp 

태블릿으로 주문가능하고

가라아케, 소바, 튀김 꼬치를 시켜서 

구름과자와 함께 

친구들과 인생얘기를 하면서 맛나게 먹었답니다.

여기서 맛있는 식사를 한 후 숙소까지 걸어가던 도중!

https://g.co/kgs/7uAbHE1 

타이토 스테이션에 들려 가챠와 인형 뽑기

간단한 오락을 즐겨주고요.

그리고 숙소까지 다시 와서 쉴 준비를 했습니다.

숙소는 침대 2개에 간이침대를 하나 더 놔주고

가격에 비해 정말 괜찮았습니다.

다만 아쉬운 점은 호텔 내에 스모킹룸이 없다는 점.. 

화장실도 깔끔했습니다.

세면장과 샤워실이 분리되어 있었고요.

어메니티(amenity)에 일회용 샤워타월도 제공되었습니다.

정말 재밌고 힘들었습니다.

우리는 여행을 가면 기본으로 하루에 15km씩 걷습니다.

시장이 반찬이라고 

극한의 배고픔을 끌어낸 후 먹는 생맥주와 음식은 말로 표현할 수 없을 정도로 좋거든요! 

그럼 1일 차 여행은 여기서 마무리하겠습니다!

2024년이지만 2023년을 돌아보며

여름에 가족여행을 갔던 추억을 되살려

포스팅을 해봅니다.

괌 가기 전 꿀팁 1가지!!!

skt 통신사 쓰는 분들은 

https://troaming.tworld.co.kr/poc/roaming/RO7.2.html

T로밍으로 쉽게 로밍해서 가는 걸 추천드려요.

비행기를 타고 갑니다.

구글에서 인천공황에서 괌까지 몇 시간 걸리는지 검색하면 아래와 같이 나옵니다.

5시간 정도라 생각하시면 되고요.

추석이라 그런지 사람이 엄청 많았습니다.

대한항공에서는 기내식을 주고 가는 동안 영화 2편 정도 보니까 도착했어요.

괌은 가족단위로 많이가서 애들 울음소리가 비행기부터 장난 아니네요ㅋㅋ

비행기에 내린 후 괌은 엄청 습하고 더운 걸 느낄 수 있었습니다.

카카오 택시를 타고 숙소까지 도착했습니다.

숙소는 두짓타니 입니다.

https://www.dusit.com/ko/specialoffers/?gad_source=1&gclid=CjwKCAiA4smsBhAEEiwAO6DEjWo6feVvPq-GnySvkCDxu8UUz2xjtUKfiJjOnWaYtpUD29TXe_Uj6xoCJGkQAvD_BwE&gclsrc=aw.ds

괌 - 미국

두짓 타니, 두짓 비치 거의 붙어있습니다.

로비는 이렇게 생겼어요~

1층은 로비 & 쇼핑 & 흡연구역이 있어요.

밤에 도착했습니다.

다음날 아침 숙소에서 바라본 오션뷰입니다.

속이 뻥 뚫릴 정도로 날씨도 좋고 경관도 좋았습니다.

호텔에서는 조식을 제공해 주기 때문에 매일 아침을 든든하게 먹었습니다.

(미국식 & 습한 날씨로 인해 음식이 다소 짤 수 있습니다.)

괌 둘러보기

#1 미니 남부투어

https://www.myrealtrip.com/offers/61121

(괌) 괌켈리네 미니 남부투어를 신청했습니다.

- 괌켈리네 남부투어는  (3군데)
1) 세티만 전망대
2) 메리조 부두
3) 솔레다드 요새

를 방문하고, 방문할 때마다 가이드분께서 사진을 찍어주십니다.

그리고 차를 통해 이동하면서 이곳저곳 설명도 해주시고요.

괌켈리네의 미니남부투어는 괌 관광청에서 정식 교육을 받고 시험에 통과한 전문 가이드와 함께 여행하고,
7-8인승 미니밴, 또는 15인승 밴으로 진행됩니다.

그리고 가이드분은 부부이십니다.

정말 유쾌하고 재밌게 여행했던 기억이 있어요.

가이드분 께서 말씀해주셨는데

괌은 중국인들이 안온데요.

그러고보니 일본인, 한국인이 엄청 많았습니다.

이렇게 괌 남부를 차를 타고 가면서 볼 수 있습니다.

내려서 사진도 찍고요.

#2 돌고래 요트 투어

돌고래를 볼 수 있는 요트 투어도 했는데요.

운이 없었죠..

돌고래는 못 보고 피곤해서 잠만 자다 왔습니다.

그래도 선상에서 롤을 먹으니까 맛은 있더라고요.

#3 괌 타오타오타씨 쇼

https://maps.app.goo.gl/qgzbR1FzXmNVvzHw7

쑈를 보면서 뷔페식사를 할 수 있습니다.

술도 주문할 수 있고요.

쑈가 끝난 후 한 번에 결제할 수 있습니다.

쑈가 끝난 후 댄서들과 사진도 찍을 수 있습니다!

맛집 투어

1. 도스 버거
(https://g.co/kgs/vmZaequ)

skt 10% 할인!

괌에서는 어떤 식당이던지 skt 할인이 되어서 좋았습니다.

한국음식점인 줄 알았어요.

미국 본연의 맛을 느낄 수 있습니다.

카운터에서 주문 후 받아와서 먹으면 돼요.

2. 캘리포니아 피자 키친

https://maps.app.goo.gl/AGQJ2Sk4F4YweK2y7

샐러드 피자를 먹을 수 있습니다.

3. LongHorn Steakhouse

https://maps.app.goo.gl/VvprqCLDm4nj13Ji6

스테이크 집입니다.

넓고 맛있습니다.

그런데 역시 한국이 좋은 이유는 

빨리빨리 문화가 있기 때문이죠.

지정된 서버가 있기 때문에 필요한 게 있으면 무조건 그 서버와 눈을 마주쳐야 합니다.

다른 서버를 부르면 이 테이블 담당 서버를 불러주겠다고 하고 기본 5~10분은 기다려야 돼요.

답~ 답 했습니다.

옆에 쇼핑몰도 있으니 ~ 밥 먹고 쇼핑!!

4. Eat Street Grill

https://maps.app.goo.gl/Prcrm3RysePEQFDi8

여기는 음식이 짜지 않아서 좋았어요.

밥 이랑 스테이크 뚝 딱 해치웠습니다.

괌 정말 좋았지만

어딜 가나 사람 많은 건 제 스타일이 아니더라고요.

가더라도 사람이 없을 때 가면 좋을 것 같습니다.

오랜만에 10번째 에피소드입니다.

오늘은 일하면서 들어본 이상한 단어와 웃픈 에피소드에 대해서 말해보려고 합니다.

#1 아삭하게 해주세요.

제가 아웃소싱에서 일할 때였습니다.

고객사에서 급한 일감이 들어왔는데요.

언제까지 해야 하는지 물어봤는데

돌아온 대답은 "아삭하게"였습니다.

아삭하게? 뭘 아삭하게 하라는 거지?

어느 지역 사투리지??

야무지게 하라는 건가???

평소 사투리를 쓰시던 분이셔서 

어느지역 사투리인지 검색을 하다가

ASAP이라는 단어를 검색하고 

깊은 탄식을 내뱉은 적이 있습니다.

As Soon As Possible

빨리빨리 / 가능한 (최대한) 빨리라는 뜻입니다.

본래 1900년대 중반에 미군에서 사용되던 단어이고,

미군에서 퍼져 보통 사람들 사이에도 적잖게 사용되는 단어라고 합니다.

에이에스에피라고 하거나 글자를 그대로 읽어서 에이쌥, 아삽이라고 읽기도 합니다.

사람마다 다르게 말한다고는 하지만

 다만 영어권 원어민이 “아삽”이라고 읽는 경우는 없다고 합니다.

즉, 고객사에서는 가능한 빨리 업무를 수행해 달라고 했었지만

저는 야무지게 하라는 뜻으로 이해했던 그런 해프닝이 있었습니다!

#2 tl;dr로 말씀드릴게요~.

오늘 있었던 일입니다.

앱 배포 때 minor 한 버그를 포함시켜야 할지 말지를 논의하고 있었습니다.

제가 답변 내용을 크게 보지 않고

변경점이라는 포인트에 집중하다 보니 

어떤 의미인지 다시 여쭤봤습니다.

저는 tl;dr이

채팅으로 대화를 했기 때문에

한/영 키를 잘못 누른 상태에서 입력하신 줄 알았습니다.

역시나 검색해 보니 

아래와 같이 나왔습니다.

TL;DR

TL;DR, 풀어서 "too long; didn't read"(너무 길어서 읽지 않았다)라는 뜻입니다.

응답이 되는 어떠한 텍스트가 그 길이 때문에 무시되고 있다는 것을 말하는 인터넷 속어입니다.

인터넷에서 글이 지나치게 길어 이를 비난하거나 글을 줄이는 것을 조언하기 위해 쓰는

'생략'과 흡사한 단어입니다.

즉, 두괄식으로 요점만 말해주겠다.라고 이해할 수 있겠습니다.

TL; DR로 한번 표현을 해보면

TL;DR : 이번 배포에 포함시키지 말죠! 
(뒤의 내용~~~ )

이런 식으로 응용해 볼 수 있겠네요.

오늘은 일하면서 처음 들어본 생소한 단어에 대해서 

재밌게 풀어보는 시간을 가졌는데요

일할 때 처음 듣는 단어라고 너무 거부감을 가지거나 놀라지 마시고

적극 활용한다면 지식도 얻고 업무처리도 빠르게 할 수 있습니다.

그럼 이만!

오늘 포스팅할 내용은

나는 어떤 강점이 있는 QA 엔지니어일까? 

태크블로그에 작성했던 글에 대한 회고입니다.

https://tech.socarcorp.kr/qa/2023/05/15/qa-skills-marktang.html

올해 1월에 새로운 회사로 이직한 이후로, TECH 블로그에 글을 업로드하는 것은

제 목표 중 하나이자 작은 소망이었습니다.

.면접 때 블로그 운영 경험을 어필한 후,

수습기간 동안 TECH 블로그에 글을 작성하는 과제를 제안 받았고,

이를 위해 3개월 동안 글을 작성했습니다.

당연히 하루 종일 글만 작성한 것은 아니었고,

온보딩을 받고 업무도 진행하다 보니 글을 작성하는 기간이 길어졌습니다.

호기롭게 TECH 블로그에 등록될 글감을 작성하려고 보니, 주제는 어떻게 선정해야할지가 막막했습니다.

첫번째 : 주제 정하기

QA엔지니어로써 TECH 블로그에 주제를 정하기 위해 5가지의 큰 기준을 잡아봤습니다.

1. 관심 분야 파악:  자신이 관심 있는 기술, 도구, 프로그래밍 언어, 프레임워크 등을 파악합니다.

자신의 전문성을 강조할 수 있는 주제를 선택하여 독자들에게 정보를 공유하고 피드백을 받는 형태로 글감을 작성합니다.

2. 업계 동향과 트렌드: QA 시장에 최신 업계 동향과 트렌드를 파악합니다. 새로운 기술의 도입, 현재 시장의 트렌드, 미래에 대한 핵심기술을 선정하여 독자들과 토론하는 형태으로 글감을 작성합니다.

3. 문제 해결과 가이드: QA엔지니어 또는 Software엔지니어(Dev)가 자주 마주치는 문제를 해결하는 방법이나, 실용적인 가이드를 제공하는 주제를 선정하여 독자들에게 가이드를 전달하는 형태로 글감을 작성합니다.

4. 프로젝트 경험 공유: 자신이 진행한 프로젝트나 QA 경험을 공유하는 주제를 선정합니다. 프로젝트의 참여한 QA 엔지니어의 A to Z 를 공유하고, 어려웠던점이나 갈등이 있었던경우 어떻게 극복했는지 본인의 경험을 독자들에게 전달하여 공감대를 형성할 수 있드록 글감을 작성합니다.

5. 튜토리얼과 팁: QA 엔지니어가 사용하는 특정 기술이나 도구의 사용법을 소개하는 튜토리얼이나,  유용한 팁을 제공하는 주제를 선정합니다. 본인의 주관적인 생각도 좋지만 정보의 전달은 객관적으로 정확하게 전달되도록 글감을 작성합니다.

관심 분야, 문제 해결과 가이드, (프로젝트) 경험 공유

저는 이 3가지 기준을 잘 조합해서 글을 작성하기로 했습니다.

주제는 "QA 엔지니어로 어떻게 성장을 해야할까?" 로 말이죠!

두번째 : 대상 독자, 독자가 얻을 수 있는 내용 정하기

주제를 선정하였으므로 

이제 두번째는 내 글을 누가 읽어줬으면 좋겠고, 어떤 정보를 얻어가면 좋을지 고민해야 됩니다.

대상 독자에 맞게 어휘력, 단어 사용을 고려해야 합니다.

또한 누구나 아는 내용을 적는 양산형 정보글을 작성하는 건 개인 블로그에서 충분히 작성해왔으니.. 

독자가 얻을 수 있는 내용을 확실하게 정해야 합니다.

저는 위와 같이 대상 독자와 독자가 얻을 수 있는 내용을 정하였습니다.

세번째 : 글의 주요 내용은?

.주제와 대상 독자가 정해졌으니, 글의 주요 내용을 정해야 합니다. 

제 경험에서 발생한 문제를 먼저 공유해드리고, 이 문제는 독자들이 궁금해하고 관심있어하는 주제일 것입니다. 

또한, 문제 해결을 위해 어떻게 노력하고 있는지에 대해 글을 설계하으므로 

위의 인과관계가 물 흐르듯 자연스럽게 이어져야 읽기에도 편한 글이 될 것입니다.

머릿말 : redgate의 Test Engineering Skill Map (https://www.red-gate.com/blog/test-engineering-skills-map)을 참고하여 QA엔지니어는 어떤 Skill 을 향상시켜야 하는지 방향성을 제공해 줍니다.
(쏘카 QA팀도 해당내용을 참고하여 본인이 어떤 Skill이 부족한지 확인하고 장기적인 Skill up 목표를 세워 달려나갑니다.)
내가 QA엔지니어로써 어떤 부분이 부족한지 확인하고, 구체적인 목표를 달성할 수 있습니다.
QA Skill영역은 단순히 노력이냐, 재능이냐 두 가지의 불분명한 관점이 아닌 Specialist, Product/Domain, Leadership, Project를 기준으로 여러 가지 사례를 확인하며 보다 구체적인 관점으로 QA Skill을 완성시킬 수 있습니다.

서론 :   전 직장에서 면접관 업무를 진행했던 경험으로 여러 면접자들이 Skill을 어필하지 못했던 사례에 대해 알아봅니다. 그리고 본인이 느꼈던 착오에 대해 간단하게 설명합니다. 

 본론 : 주요 Skill 과 각 항목에는 어떤 능력들이 필요한지 알 수 있습니다. 쏘카에서 본인이 QA엔지니어로 성장하기 위해 어떤 목표를 설정하고 진행하는지 확인할 수 있습니다.

 결론 : 본론을 바탕으로 QA엔지니어가 어떻게 자신을 단련시키고, 어필하는지에 대해 제 생각을 정리하여 글을 마무리합니다.

위의 3가지 단계로 글을 작성하였습니다.

여기서 끝!

이라고 생각하였으나

막상 글을 작성하고 보니 일기장인지, 어떤 내용을 전달하려고 하는지 감이 오지 않았습니다.

뭐가 잘못된 것일까?

1. 정보 공유를 위한 목적이아닌 위에서 언급했던 수습과제를 끝내기 위해 작성한 글 같다.

2. 글의 목적이 명확하지 않다. (QA SKILL 에 관한 내용인지 REDGATE에 대한 설명인지...)

3. 과도한 접속사 사용으로 글을 읽기에 불편하고, 문장이 길다.

4. 한글 영문 혼용규칙을 설정하지 않아 어디서는 엔지니어, 어디서는 Engineer ...

5. 본문과 내 경험과 맞지 않다..

등 여러 피드백을 받고 다시 작성을 했습니다...

글을 작성하는데만 초점을 둔 결과였습니다.

결국 다시 피드백을 보고 하나씩 수정을 하였고,

이 과정에서는 많은 분들의 도움이 있었습니다.

우여곡절 끝에 SOCAR  Tech Blog 에 제가 작성한 글이 올라가게 되었습니다!

링크드인에서도 확인가능 합니다.

https://www.linkedin.com/posts/socarkr_scitcu-qzcstkrzorxgqyy-qa-activity-7066276503264645120-wNdw?utm_source=share&utm_medium=member_android 

QA엔지니어로써 막연한 목표만 가지고 계신 분들에게는 도움이 되었으면 합니다.

1년에 1개이상의 글감을 TECH 블로그에 등록 할 수있도록

QA분야에 많은 관심을 가지고 업무에 임하는것이 이번년도 작은 목표입니다.!

이번 글을 작성하면서 

저를 제일 많이 도와주신 분께 책 선물도 받았습니다.

"우리글 바로 쓰기"

우리가 모르고 사용하고 있는 외래어 표현에 대해 우리말로 어떻게 표현할 수 있는지 

우리말 표현에 대한 이야기와 방법에 대해 알 수 있습니다.

앞으로 제 블로그도 외래어 표현을 자제하고 

아름다운 우리말로 작성될 수 있도록 노력할 것입니다.

그리고

"조직의 습관을 바꾸는 일"

책도 선물받았는데요.

(아직 한글자도 못봤어요 ㅠㅠ)

이건 다음에 리뷰할 수 있도록 살펴봐야 겠습니다. 허허

그럼 오늘은 여기까지 ㅡ ★

오늘 포스팅할 내용은

state-of-quality-report-2022

을 주관적으로 분석한 글입니다.

관련 자료는 아래 링크에서 다운로드하여보실 수 있습니다.

제 글을 읽으시기전에 한 번 본인의 생각은 어떤지 

정하고 보시는 걸 추천드려요.

팀 내에서만 공유했지만 혼자보기 아까워서 개인 블로그에 올립니다~!

https://katalon.com/state-quality-2022

요약

Katalon 에서 소프트웨어 품질에 대한 설문 조사와 분석을 바탕으로 작성된 리포트입니다.

QA 업계에서 일어나는 변화, 테스트 자동화와 인공지능 기술의 활용 등에 대한 정보를 제공하는 문서입니다.

머리말

요즘 빠르게 변화하는 세상에서, 조직들은 소프트웨어 품질(QA) 관행에서의 개선을 위해 내부와 외부 모두를 살펴야 합니다. 소프트웨어 품질을 빠른 속도로 제공하는 데에 대한 강점과 약점을 결정하기 위해 자신들의 관행에서 생성된 정보와 데이터를 수집하고 분석해야 합니다. 동시에, 그들은 각자의 산업에서 현재 상황과 트렌드를 찾아내야 합니다.

이 보고서는 3,000명 이상의 응답자를 대상으로 한 조사 결과를 바탕으로, 현재 소프트웨어 품질의 상태를 스냅숏으로 담아내며, QA 기술, 관행, 도구에 대한 통찰력과 트렌드를 예측합니다. 우리의 연구는 소프트웨어 엔지니어, QA 엔지니어, 분석가 및 관리자를 대상으로 조사되었으므로, 이러한 소프트웨어 품질을 보장하는 데 직접 관여하는 사람들의 의견과 목소리를 반영합니다.

본문

결론(이라 쓰고 3줄 요약이라고 적기)

자동화 테스트는 생각보다 많은 팀이 사용하지 않는다.

그럼에도 필요한 기술이다.

왜냐면 자동화를 도입한 팀들은 시간과 비용을 절약했기 때문이다.

상업적인 목적으로 만들어진 자료이기 때문에 100% 맹신할 필요는 없습니다.

그냥 이런 흐름이 있구나~라고 가볍게 보는 걸 추천드려요!

58 page 중에 3분의 1 정도는 Katalon이 어떤 회사인지... 알 수 있습니다.

참고 링크

https://xmlangel.kr/posts/2023-04-10-Katalon-2022-Report : 다른 분들은 어떻게 분석했나 보고 싶었는데 해당 블로그가 많은 도움을 주었습니다.

위 글은 Katalon에서 만든 자료를 제 개인적인 생각을 넣어서 분석한 글이기 때문에 모든 저작권 및 권한은 Katalon에 있습니다.

안녕하세요!

무작정 강의 듣고 따라 하기 2탄이자 마지막 시간입니다.

2023.03.19 - [자동화 QA로 단단해지기/cypress로 단단해지기] - [cypress]#01_cypress 무작정 강의 듣고 따라 하기 01

오늘은 계산기 애플리케이션을 테스트하는 코드를 작성해 볼 것입니다.

그럼 거두절미하고 

바로 시작하겠습니다.

vscode 실행 ~ cypress open

./node_modules/.bin/cypress open

요구사항 파악하기

## 🎯 기능 요구사항

- [ ] 2개의 숫자에 대해 덧셈이 가능하다.
- [ ] 2개의 숫자에 대해 뺄셈이 가능하다.
- [ ] 2개의 숫자에 대해 곱셈이 가능하다.
- [ ] 2개의 숫자에 대해 나눗셈이 가능하다.
- [ ] AC(All Clear)버튼을 누르면 0으로 초기화 한다.
- [ ] 숫자는 한번에 최대 3자리 수까지 입력 가능하다.
- [ ] 계산 결과를 표현할 때 소수점 이하는 버림한다.

테스트 케이스 작성 및 테스트할 링크 연결

describe("계산기 어플 테스트", () => {
  beforeEach(() => {
    cy.visit("http://127.0.0.1:5500/index.html");
  });

계산기 어플 테스트라는 test suite를 작성할 것이고

beforeEach를 통해 매번 테스트는 visit("링크")로 시작합니다.

첫 번째 요구사항 

it("2개의 숫자에 대해 덧셈이 가능하다.",()=>{
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("+").click();
    cy.get(".digit").contains("1").click();
    cy.get(".operation").contains("=").click();
    cy.get("#total").should("have.text","3");
  });

it으로 첫 번째 testcase("2개의 숫자에 대해 덧셈이 가능하다")를 작성합니다.

우리는 숫자에 대한 클래스와 사칙연산에 대한 클래스가 무엇인지 알아야 합니다.

숫자는 digit , 사칙연산 버튼은 operation입니다.

첫 번째 숫자. digit에서 2를 contain 한 button을 click 해줍니다.

그리고. operation에서 + button을 click 해줍니다.

두 번째 숫자. digit에서 1을 contain 한 button을 click 해줍니다.

그리고 계산의 결과 값을 알기 위해 = button 을 click 해줍니다.

그 결과 (#total)는

should (여야만 합니다.) "have.text", "3"(3을 가진 텍스트여야 합니다.)

두 번째 ~ 네 번째 요구사항

it("2개의 숫자에 대해 뺄셈이 가능하다.",()=>{
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("-").click();
    cy.get(".digit").contains("1").click();
    cy.get(".operation").contains("=").click();
    cy.get("#total").should("have.text","1");
  });


  it("2개의 숫자에 대해 곱셈이 가능하다.",()=>{
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("x").click();
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("=").click();
    cy.get("#total").should("have.text","4");
  });


  it("2개의 숫자에 대해 나눗셈이 가능하다.",()=>{
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("/").click();
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("=").click();
    cy.get("#total").should("have.text","1");
  });

위의 덧셈 테스트 코드와 별로 다를 게 없습니다.

각 사칙연산에 맞는 button을 입력해 줍니다.

다섯 번째 요구사항

it("AC버튼을 누르면 0으로 초기화" ,()=>{
    cy.get(".digit").contains("2").click();
    cy.get(".modifier").contains("AC").click();
    cy.get("#total").should("have.text", "0");
  });

AC버튼을 누르면 0으로 초기화되도록 testcase를 작성합니다.

초기화하기 전에 사전 조건은 

계산기에 값이 있어야 합니다.

따라서 2를 먼저 입력해 줍니다.

그리고. modifier에 포함된 AC button을 클릭해 줍니다.

그러면 결과 값(#total)은 should (여야만 합니다.) "have.text", "0"(0을 가진 텍스트여야 합니다.)

여섯 번째 요구사항

  it("숫자는 한번에 최대 3자리수까지 입력", ()=>{
    cy.get(".digit").contains("1").click();
    cy.get(".digit").contains("2").click();
    cy.get(".digit").contains("3").click();
    cy.get(".digit").contains("4").click();
    cy.get("#total").should("have.text", "123");
  });

이 계산기 애플리케이션은 숫자를 한 번에 최대 3 자릿수까지 입력 가능합니다.

따라서 3자리수까지 입력 가능한지 확인을 하기 위해

1~4를 클릭해 줍니다.

원래대로라면 1234 가 나오겠지만 애플리케이션 특성상 123 만 출력되어야 합니다.

그러면 결과 값(#total)은 should (여야만 합니다.) "have.text", "123"(123을 가진 텍스트여야 합니다.)

일곱 번째 요구사항

it("계산 결과를 표현할 때 소수점 이하는 버림한다.", ()=>{
    cy.get(".digit").contains("1").click();
    cy.get(".operation").contains("/").click();
    cy.get(".digit").contains("2").click();
    cy.get(".operation").contains("=").click();
    cy.get("#total").should("have.text","0");
  });

이 계산기 애플리케이션은 소수점 이하는 버립니다.

그래서 1 나누기 2를 하면 0.5 가 나오게 되지만

이 계산기 애플리케이션은 0 만 나오게 됩니다.

결과 값(#total)은 should (여야만 합니다.) "have.text", "0"(0을 가진 텍스트여야 합니다.)

테스트 결과

이 계산기 어플리케이션 과제를 끝으로

https://inf.run/Yb4d

강의가 마무리되었습니다.

이제 어떻게 응용해 볼지는 다음시간에 알아보도록 하겠습니다.

무작정 따라 해봤고

무작정 이해해 봤습니다.

그럼 다음시간에 만나요~

안녕하세요!!

오늘은 처음 써보는 유머글입니다.

인터넷에서 재밌는 걸 봤는데

이걸 QA 엔지니어 관점에서 봤을 때

단위테스트만 진행하고 통합테스트를 진행하지 않은 결과물

관련한 짤(gif)을 보도록 하겠습니다.

옷 다 젖는 수도꼭지

잠금장치만 확실한 문

이중 보안

보는 사람만 재미있는 워터 슬라이드

좋지 못한 곳에 설치된 물비누 디스펜서

위의 짤(gif)만 봐도

왜 통합테스트가 이뤄져야 하는지 이해가 되시죠??

그냥 웃고 넘길 수 있는 짤(gif) 지만

QA엔지니어 관점에서 다시 보니 웃음과 교훈도 얻을 수 있었습니다.

그럼 이만!

출처 : https://m.cafe.daum.net/dotax/Elgq/3359298?svc=topRank

오늘은 cypress 2번째 시간입니다.

2023.03.19 - [자동화 QA로 단단해지기/cypress로 단단해지기] - [cypress]#00_cypress 무작정 시작해 보기 전에! 자동화 왜 합니까?

첫번째는 왜 자동화가 필요하고, E2E TEST가 무엇인지에 대해 간단하게 알아봤습니다.

오늘은 cypress 무작정 시작을 위해 인프런에서 눈에 띄는 강의를 발견해서

따라해보는 시간을 갖도록 하겠습니다.

https://inf.run/Yb4d

하루만에 Cypress로 작성하는 자바스크립트 E2E 테스트 코드 강의입니다.

11개 수업에 45분이라는 부담스럽지 않은 수강시간입니다.

물론 유료입니다.

저는 회사에서 교육비 지원이 되기 때문에 이걸 아주 잘 활용해볼 예정입니다.

자 그럼  교육 과정에 대한 자세한 설명은 생략하고 무작정 따라해보겠습니다.

궁금하면 인프런 가입 해서 제가 적은 링크 따라가시면 됩니다.

저는 MAC 환경으로 시작하겠습니다.

수업을 위한 git hub 저장소를 로컬에 clone 하기

교육용 git hub 저장소에서 코드를 복사 한 후 터미널에서 git clone 진행

$ git clone https://github.com/~~~~

교육내용에서 과제를 주고 이를 어떻게 해결하는지 알려주는 방식입니다.

처음 해볼 과제는 counter 하는 방법입니다.

vscode 에 Live Server 확장

Live Sever 를 다운 받아 주어야

Open with Live Server 항목이 생깁니다.

그래야 이제 내가 테스트할 페이지 URL 을 확인할 수 있습니다.

클릭하면 아래와 같은 테스트 페이지가 나오게 됩니다.

vscode 이동 후 터미널을 열고 cypress 를 설치합니다.

터미널을 열어 준 후

https://www.cypress.io/

에 접속해서 문서대로 따라만 하면됩니다.

문서가 비록 영문이지만 잘 정리되있습니다.

꼭 확인해보세요.

https://docs.cypress.io/guides/getting-started/installing-cypress

npm install cypress --save-dev

를 입력해 줍니다.

설치하고 cyperss 열기

https://docs.cypress.io/guides/getting-started/opening-the-app

./node_modules/.bin/cypress open

The long way with the full path 방식으로 cypress open 합니다.

Welcome to Cypress!

화면을 확인하고

E2E Testing 을 클릭합니다.

Choose a browser화면에서

사용할 브라우저를 선택하고

Start E2e Testing in Chrome 를 눌러줍니다.

E2E specs 에 도착했습니다.

여기서는 examples 로 어떻게 동작하는지에 대한 예시를 간단하게 보여줍니다.

 과제를 하기 위해 New spec 을 클릭해서 cy.js 파일을 만들어주거나

vscode에서 e2e 폴더 하위에 cy.js 파일을 만들어줍니다.

과제 분석

이 counter 라는 서비스의 요구사항은 무엇일까요?

- [ ] counter의 초기값은 0이다.
- [ ] + 버튼을 클릭 시 count가 1증가한다.
- [ ] - 버튼을 클릭 시 count가 1감소한다.
- [ ] + 버튼을 클릭 시 count가 10이 넘는 경우 더이상 증가하지 못한다. (Max 값이 10)
- [ ] - 버튼을 클릭 시 count가 0보다 작아지는 경우 감소하지 못한다. (Min 값이 0)
- [ ] reset 버튼을 클릭 시 counter가 0으로 초기화된다.

위의 요구사항에 맞게 테스트 코드를 짜야합니다.

과제하기 1. 서비스 접속하기

describe("example counter app", () => {
  beforeEach(() => {
      cy.visit("http://127.0.0.1:5500/index.html");
  });
});

어떤 테스트 코드들인지 묶어주는 함수 describe

beforeEach 하나의 테스트 코드(it)들을 실행시키기전에 실행하는 함수

it 하나의 테스트 코드 

cy.visit 을 사용해서 테스트할 페이지를 방문한다.

사진에서 보이는 것처럼 

테스트 케이스마다 BEFORE EACH 로 테스트할 사이트를 visit 해줍니다.

그리고 it 에 적은 테스트 케이스를 볼 수 있습니다.

과제하기 2. 첫번째, 두번째, 세번째 요구사항 진행

describe("example counter app", () => {
  beforeEach(() => {
      cy.visit("http://127.0.0.1:5500/index.html");
  });

  it("최초의 카운터 값을 0으로 보여준다", () => {
      cy.get("#value").invoke("text").should("eq","0");
  });

  it("+버튼 클릭 count 1 증가한다",() => {
    // 먼저 기존 값으 가져오고
    // + 값 클릭
    // 변화된 값이 기존값 + 1인지 체크
    cy.get("#value")
    .invoke("text")
    .then((value) => {
      const preValue = Number(value);
    cy.get(".increase-btn").click();
    cy.get("#value")
    .invoke("text")
    .should("eq", String(preValue + 1));
  });
});

it("-버튼 클릭 count 1 감소한다", ()=> {
  // + 버튼 클릭 해서 1로 만듬
  // 기존 값 1 가져오고
  // - 버튼 클릭
  // 변화된 값이 기존값 0인지 체크
  cy.get(".increase-btn").click();
  cy.get("#value")
  .invoke("text")
  .then((value)=>{
    const preValue = Number(value);
    cy.get(".decrease-btn").click();
    cy.get("#value")
    .invoke("text")
    .should("eq", String(preValue - 1));
  });
})

it 최초의 카운터 값을 0으로 보여줍니다.

html의 span 의 요소 #value 가 어떤 값이여야 합니다.

invoke 를 써서 text 값을 가져옵니다.

그 값이 should ("eq" , "0") 0 과 같아야 합니다.

it + 버튼을 클릭하면 count 1 증가합니다.

html 에서 + 버튼에 대한 class 를 확인 후 가져온 후 클릭

cy.get(".increase-btn").click();

then 으로 메소드를 체이닝(연결) 시켜줍니다.

숫자비교를 위해 String 사용합니다.

두번째와 같은 방법으로 세번째 과제 clear 입니다.

과제하기 3. 네번째, 다섯번째 요구사항 진행

it("+ 버튼을 클릭 시 count가 10이 넘는 경우 더이상 증가하지 못한다. (Max 값이 10)", ()=> {
  for(let i=0; i<11; i++) {
    cy.get(".increase-btn").click();
  }
  cy.get("#value").invoke("text").should("eq","10");
});

it("- 버튼을 클릭 시 count가 0보다 작아지는 경우 감소하지 못한다. (Min 값이 0)", ()=>{
  cy.get(".decrease-btn").click();
  cy.get("#value").invoke("text").should("eq","0");
});

For 문을 사용해 + 버튼을 클릭합니다.

이런식으로 계속 클릭하는 것을 볼 수 있습니다.

그리고 다섯번째 요구사항은

그리고 0에서 - 버튼을 눌럿을 경우 0보다 작아지지 않아야 하므로

-버튼을 클릭 한 다음 0과 비교를 합니다.

과제하기 4. 여섯번째 요구사항

it(" reset 버튼을 클릭 시 counter가 0으로 초기화된다.", () =>{
  cy.get(".increase-btn").click();
  cy.get(".reset-btn").click();
  cy.get("#value").invoke("text").should("eq","0");
});

reset 버튼을 클릭하기 위해 임의의 값을 주고

reset btn 클래스를 사용해서 reset btn 을 클릭하면

그 값은 0 과 같아야 합니다.

잘 돌아가는지 봅시다.

이렇게 해서 설치부터 ~ 간단한 과제까지 마무리 해보았습니다.

저도 무작정 따라하다보니 이게 한 15~20 분과정인데

3시간은 걸린것 같습니다.

처음이라 그런지 쉽지않네요.

자주 해봐야 실력이 늘겠죠?

다음 과제는 계산기 테스트 코드를 작성하는 과제를 진행할 예정 입니다.

그럼 이만!