RSS DEV 커뮤니티
팔로우
Claude를 위한 작업 패널을 구축하면서 발견한 MCP 앱의 두 가지 미해결 버그
저자는 Claude 대화 내에 지속적인 작업 패널을 표시하는 오픈 소스 MCP 서버인 Wingman을 개발했습니다. 이를 위해 저자는 견고하다고 생각한 MCP Apps와 관련 SDK를 활용했습니다. 그러나 문서화되지 않은 두 가지 심각한 버그로 인해 상당한 개발 시간이 소요되었습니다. 첫 번째 버그는 `resourceUri`의 위치에 관한 것으로, `structuredContent` 내부가 아닌 `CallToolResult` 객체의 최상위 `_meta`에 있어야 합니다. 도구에서 일반 사전(dictionary)을 반환하면 `_meta`가 잘못 중첩되어 호스트가 렌더링할 리소스를 찾지 못하게 될 수 있습니다.
수정 방법은 `_meta`가 올바르게 배치된 적절한 `CallToolResult` 객체를 반환하는 것입니다. 두 번째 주요 버그는 CSS 특이성 문제로 인해 `[hidden]` 속성이 재정의되는 것에서 비롯되었습니다. 사용자 정의 스타일시트의 명시적인 `display` 규칙이 JavaScript에 의해 의도된 대로 요소를 숨기는 것을 방해했습니다. `[hidden]` CSS 규칙에 `!important`를 추가하는 한 줄로 세 가지 별도의 UI 문제가 동시에 해결되었습니다.
추가적으로, MCP Apps 호스트 내에서 세 가지 iframe 샌드박스 제약 조건이 발견되었습니다. `confirm()`은 조용히 실패하고, `navigator.clipboard.writeText`는 사용할 수 없으며, `Blob`/`URL.createObjectURL` 다운로드는 차단됩니다. 이러한 제한 사항은 인라인 확인 사용 및 `sendMessage`를 통해 콘텐츠를 다시 라우팅하는 것과 같은 해결 방법이 필요합니다. 저자는 이러한 API 실패가 일반적으로 오류가 아닌 조용한 비작동으로 이어져 진단하기 어렵다고 강조합니다. 궁극적으로 두 가지 주요 버그 모두 초기 검사 지점에서 한 단계 떨어진 문제와 관련이 있었으며, 디버깅 중에 이러한 중간 단계를 확인하는 것의 중요성을 강조합니다. Wingman은 MIT 라이선스로 PyPI에서 사용할 수 있습니다.
