Show GN: OTP 복사-붙여넣기가 귀찮아서 자동 입력 크롬 확장을 만들었습니다

회사 어드민 페이지들이 로그인할 때마다 Google OTP를 요구합니다. 처음엔 폰을 꺼내서 봤고, 그 다음엔 Authenticator류 크롬 확장을 써봤는데 결국 확장 열고 → 코드 복사하고 → 입력창에 붙여넣고 → 로그인 버튼 누르는 과정은 그대로더라고요. 하루에 수십 번 하다 보니 이것도 일이다 싶어서, 아예 페이지에 들어가면 OTP가 알아서 입력되고 로그인까지 눌러주는 확장을 만들었습니다. 예전 같으면 "만들면 편하겠다" 생각만 하고 시간이 없어서 못 했을 텐데, 이번엔 클로드 코드(Claude Code)한테 시켜보니 생각보다 일이 금방 끝났습니다. "크롬 확장으로 바꿔줘"부터 시작해서, 기능 추가 → 스토어 심사 준비 → 스크린샷 제작까지 대화로 진행했고, 심사도 한 번에 통과했습니다. 동작은 단순합니다. 사이트별로 URL 패턴, Secret Key, OTP 입력창 선택자, 로그인 버튼 선택자를 등록해두면, 해당 페이지에 진입했을 때 확장이 TOTP를 계산해서 채우고 버튼을 눌러줍니다. 재밌었던 건, 제가 요구한 건 "자동으로 입력되게 해줘" 수준이었는데 세부적인 부분은 클로드가 알아서 챙겼다는 점입니다: Secret Key를 QR 코드로 등록하게 해달라고 했더니, jsQR을 번들해서 현재 탭 스캔/이미지 업로드 둘 다 오프라인으로 동작하게 만들었습니다. CSS 선택자를 모르는 사람도 쓸 수 있게 화면에서 클릭하면 선택자가 잡히는 요소 선택기를 넣었는데, 팝업이 페이지 클릭 시 닫혀버리는 문제를 storage.session에 폼 상태를 저장했다 복원하는 식으로 알아서 풀더라고요. 스토어 심사 얘기를 꺼내니까 <all_urls> 권한이 심사에 불리하다며, 사용자가 등록한 사이트에만 optional_host_permissions로 권한을 요청하는 구조로 먼저 리팩토링을 제안했습니다. 사내망 http 페이지에서는 content script에 crypto.subtle이 없다는 것도 클로드가 잡아서, TOTP 계산(RFC 6238)을 background 서비스 워커로 옮겼습니다. 크롬 match pattern이 포트를 지원하지 않는 문제도 권한은 호스트 단위로 받고 정확한 URL 매칭은 content script에서 하는 식으로 우회했고요. 서버 호출, 트래킹, 계정 전부 없고 OTP 계산은 전부 확장 안에서 합니다. 당연한 얘기지만, 로그인하는 브라우저에 TOTP 시크릿을 넣는 순간 "별도 기기"라...