반응형

안녕하세요, 가야태자 @talkit 입니다.

지난 편에서 티스토리 반자동 포스팅기를 만들었다고 했습니다.

오늘은 그 도구가 저에게 거짓말을 한 이야기입니다.


화면에는 있는데, 발행하니 없었습니다

터미널에 이렇게 찍혔습니다.

✅  title 입력 — 36자
✅  body 입력 — 3310자
✅  태그 입력 [...]

화면에도 본문이 멀쩡히 보였습니다. 마크다운이 서식으로 예쁘게 들어가 있었고요.

예약 발행하고 미리보기를 눌렀더니 본문이 없었습니다.

제목만 있고, 태그만 있고, 내용은 텅 비어 있었습니다.


왜 그랬나

티스토리 마크다운 에디터는 CodeMirror입니다. 평범한 입력창이 아니라 그 위에 그려지는 편집기고, 값은 CodeMirror 인스턴스가 들고 있습니다.

그래서 이렇게 넣었습니다.

el.CodeMirror.setValue(text);

화면은 찼습니다. 그런데 티스토리가 저장할 때 읽는 건 CodeMirror가 아니라 그 아래 숨어 있는 textarea였습니다. setValue() 는 CodeMirror 안에서 끝나고, 그 값을 아래로 흘려보내는 경로를 타지 않았던 겁니다.

CodeMirror (화면)  →  숨은 textarea  →  저장
      ↑                    ↑
   여기만 채움           비어 있었음

진짜 문제는 그게 아니었습니다

값을 잘못 넣은 것보다 더 나쁜 게 있었습니다.

제가 확인을 이렇게 했거든요.

cm.setValue(text);
return cm.getValue().length;   // 3310

제가 쓴 값을 제가 되읽고 있었습니다.

당연히 3,310자가 나오죠. 방금 넣었으니까요. 저장되는 곳은 보지도 않고 "3,310자 입력 성공"이라고 보고했습니다.

그 보고를 믿고 예약 발행을 눌렀고, 빈 글이 하나 올라갔습니다.


이거 어디서 많이 본 장면입니다

성능 테스트에서 똑같은 일이 납니다.

측정 지점을 잘못 잡으면 전부 통과했다고 나옵니다. 부하를 걸었는데 실제로는 안 걸렸고, 응답 시간을 쟀는데 실제 사용자가 겪는 구간이 아니었고. 그런데 리포트에는 초록불이 뜹니다.

제가 예전 글에서 "99%가 3초 이내였는데 나머지 1%가 1분이었다"고 쓴 적이 있습니다. 그때도 평균만 봤으면 통과였습니다.

측정하는 쪽과 검증하는 쪽이 같으면, 그건 검증이 아닙니다.


어떻게 고쳤나

두 가지를 바꿨습니다.

① 저장되는 곳에서 확인합니다

화면 3310자 / 연결 textarea 3310 / editor-tistory 3310

세 곳을 다 찍습니다. 화면만 차 있고 저장 쪽이 비면 실패로 봅니다.

② 넣는 방법을 바꿨습니다

프로그램으로 값을 심는 대신, 사람이 붙여넣는 것과 같은 길로 갑니다. 편집기를 클릭하고 전체 선택해서 지운 뒤 키보드 입력으로 넣습니다. 그러면 브라우저가 진짜 입력 이벤트를 만들고, 티스토리 쪽 처리가 정상으로 돕니다.

손으로 붙여넣었을 땐 잘 됐거든요. 되는 길이 있으면 그 길로 가는 게 맞습니다.


그래서 남긴 문구

지금은 실패하면 이렇게 말합니다.

⚠️  화면에는 3310자가 들어갔지만 저장용 값이 비어 있습니다.
    발행 전에 미리보기로 본문을 꼭 확인하세요.

그리고 성공했을 때도 미리보기로 확인하라고 합니다.

밖에서 "저장될 것"을 확실히 아는 방법이 없기 때문입니다. 숫자는 참고일 뿐이고, 눈으로 보는 게 마지막 검증입니다.

도구를 만들면서 배운 게 이겁니다. 도구가 "성공"이라고 하면, 그게 무엇을 근거로 한 성공인지 봐야 합니다.

다음 편에는

  • 제가 손으로 눌러도 안 되던 이야기. 그게 원인을 찾은 결정적 단서였습니다

읽어 주셔서 감사합니다.

다음 주 월요일에 뵙겠습니다. 제가 손으로 눌러도 안 되던 이야기입니다.

반응형

+ Recent posts