macOS가 사용하는 웹뷰 Inspect 하기

• 맥 터미널에서 아래 커맨드를 입력하면 시스템이 사용하는 웹뷰에서 "Inspect Element" 메뉴가 활성화되어,
  시스템 대화 창의 모든 웹뷰를 기존 웹사이트 처럼 개발자도구로 살펴보기 가능
  defaults write NSGlobalDomain WebKitDeveloperExtras -bool true
  defaults write -g WebKitDeveloperExtras -bool YES
• 애플 엔지니어들이 WebKit의 비표준 CSS키워드를 사용하여, 시스템 API로 개발된 macOS UI를 웹에서 그대로 구현한 방법들을 볼 수 있게 됨
  → 예) 애플 뮤직의 가족공유 탭에선 React를 쓴것도 볼 수 있고, 웹 컴포넌트 같은 것도 보임
• 이를 통해서 Webkit/Safari 의 특정 기능들이 제공되는 이유를 살펴볼 수 있음
  → 예) CSS4 폰트 모듈이 시스템 폰트를 지원하는 것. font-family : -apple-system

[spilist2]

와 신기하네요. 그런데 이런 건 어떻게 알아내는 건지도 궁금했는데 그 얘기는 없어서 아쉽군요.

[spilist2]

답변 쓰레드: https://twitter.com/samhenrigold/status/1503179818879401987

i was interested in figuring out how the itunes store app works. running a proxy and inspecting the HTML by hand was a pain in the ass so i started looking online for any pref values i could write to enable dev tools.

I couldn’t find anything, so I juiced the strings (https://macworld.com/article/192447/findhidden.html) out of the itunes binary and webkit frameworks explicitly looking for keys that could be helpful. Couldn’t find anything for iTunes but the entries I found enabled the inspector elsewhere!

[xguru]

찾아보니 WebkitDeveloperExtras 항목을 켜는건 꽤 오래전부터 알려져 있었던 것 같아요. Stackoverflow에 12년전 질문이 있네요.
https://stackoverflow.com/questions/695038/…
최근에 와서야 애플이 시스템에서 웹뷰를 쓰기시작한게 아닐까 생각이 듭니다.

[spilist2]

맥 기본 앱들을 어떻게 인스펙트할 생각을 했는지, 그래서 인스펙트 방법은 어떻게 알았는지 (저 커맨드의 존재 등) 사고 과정이 궁금해서 트위터로 물어봤는데.. 알려진 방법이었군요.
답변을 해줄지 모르겠지만 답변이 달리면 여기에도 공유하겠습니다.