본문 바로가기
Developer/Project

Chrome Extension Trouble Shooting

by 해적거북 2023. 1. 8.
728x90

Pomodoro Chrome Extension


목차

  1. Toolbar 아이콘 변경하기
  2. 사용할 Chrome API를 permission에 등록했는지 꼭 확인하기
  3. Extension은 열 때마다 초기화된 상태
  4. 제출할 Screenshot은 규격에 맞게 제출하기
  5. 참고

1. Toolbar 아이콘 변경하기

Extension의 초기 실행 당시에는 manifest.json 파일의 action속성에 있는 default_icon의 값으로 설정되어 있다. 이때 Chrome은 알아서 적당한 이미지를 골라서 최적화시켜 icon으로 보여준다.

512x512pixel의 icon이 들어가지는 스크린샷

하지만 임의로 변경하고 싶을 때(Chrome API을 이용하여 setIcon하는 경우)는 Chrome이 최적화까지 하지 않아서 다음과 같은 오류를 만날 수 있다.

512x512의 icon으로 setIcon하면 생기는 오류

이를 해결하려면 규격에 맞는 icon 파일을 만들어 불러오도록하면 된다.


2. 사용할 Chrome API를 permission에 등록했는지 꼭 확인하기

Chrome API를 사용하기 위해서 manifest.jsonpermissions 필드에 선언해 둬야 한다. 만약 선언하지 않고 Chrome API에 접근하는 경우 아래와 같은 오류를 만나게 되므로 주의해야 한다.

error with no permissions


3. Extension은 열 때마다 초기화된 상태

Extension은 현재 있는 브라우저, 웹 페이지의 환경이 아닌 독립된 공간에서 실행된다. Extension의 열고 닫음은 Extension을 껐다 키는 것과 동일하여, Extension을 열고 닫으면 새로운 공간을 다시 만들게 된다.

그런데 만약 Extension이 닫힘 상태에서 알림이나 어떠한 이벤트를 받고 싶다면, service worker를 선언하고 따로 코드를 작성해야한다. 아래 Extension의 Architecture를 참고하면 도움이 될 수 있다.

Content scripts


4. 제출할 screenshot은 규격에 맞게 제출하기

확장 프로그램을 완성하고 Chrome Web Store의 개발자 대시보드에서 확장 프로그램을 업로드할 때, 확장 프로그램의 설명, permissions에 선언한 기능이 각각 왜 필요한지, 아이콘, 캡쳐화면 등을 작성해야한다. 그 중에서 '캡쳐화면'에서 알 수 없는 오류를 계속 만났다. 일단 캡쳐화면 규격은 다음 사진에서와 같다.

Capture screen specification

여기서 1280x800pixel또는 640x400pixel이어야만 한다. 범위가 아닌 두 개의 선택지다. 공식문서에도 ScreenShots에 관하여 자세하게 설명되어있다. (나는 1280을 1200으로 잘못봐서 계속 오류가 났다는 것을 글을 쓰면서 알게되었다...)


5. 참고


728x90

댓글