안녕하세요. 케이스입니다. 지난달 이후 DevTools의 새로운 기능을 알려드리는 다이제스트를 다시 전해드립니다.
Console의 새로운 기능
현재 Canary 버전인 Chrome 56에서는 DevTools 콘솔이 CodeMirror를 기반으로 합니다. 이를 통해 다음과 같은 다양한 새로운 기능을 사용할 수 있습니다
입력할 때 구문 강조 표시 이전에는 DevTools에서 코드 블록이 평가된 후에만 구문을 강조 표시할 수 있었습니다.
일치하는 괄호/대괄호/중괄호 강조 표시 괄호, 대괄호 또는 중괄호가 하나 더 있으면 DevTools에서 빨간색으로 강조 표시합니다.
커서가 괄호, 대괄호 또는 중괄호 옆에 있으면 일치하는 괄호, 대괄호 또는 중괄호가 회색으로 강조표시됩니다.
스마트 반품 이제 다중 줄 코드 블록을 입력할 때 DevTools는 Enter 키를 누를 때마다 새 줄을 만들지 아니면 코드를 실행할지 알 수 있습니다. 예를 들어 Console에서 다음 for 루프를 평가하려고 한다고 가정해 보겠습니다.
for (var i = 0; i < 5; i++) {
console.log(i);
}
이전에는 첫 번째 줄을 입력한 후 Enter를 누르면 DevTools가 줄을 평가하여 오류가 발생했습니다. 코드 블록을 새 줄로 계속하려면 Enter 키를 누르기 전에 Shift 키를 누르고 있어야 합니다. 반대로 이제 DevTools는 Enter 키를 누르면 예상대로 새 줄에서 코드 블록을 자동으로 이어줍니다.
여러 커서. Command (Mac) 또는 Control+Alt (Windows, Linux)를 누른 상태에서 클릭합니다.
이제 카나리아에서 상위가 아닌 컨텍스트가 빨간색으로 강조 표시됨
최근에 콘솔에서 작업했다면 실행 컨텍스트 선택기를 top가 아닌 값으로 설정하는 불편한 버그를 경험했을 수 있습니다.
이제 이 버그가 안정화 버전에서 수정되었지만, 안전을 위해 이제 카나리아 (Chrome 56)의 DevTools에서 선택기를 빨간색으로 강조 표시하여 top 컨텍스트에 있지 않다고 경고합니다.
새로운 사용자 에이전트: UC Browser
이제 네트워크 상태 창 탭에서 iOS, Android 또는 Windows Phone용 UC Browser를 선택할 수 있습니다.
공유는 곧 배려입니다
언제나 그렇듯이 DevTools와 관련된 의견이나 아이디어를 보내주세요.
- 간단한 질문이나 의견이 있으면 트위터에서 ChromeDevTools를 핑하거나 새로운 아이디어를 공유해 주세요.
- 긴 논의의 경우 메일링 리스트 또는 Stack Overflow를 사용하는 것이 가장 좋습니다.
- 문서 관련 문제는 문서 저장소에서 문제를 여세요.
- 언제든지 팀에 직접 연락하여 버그를 신고하거나 Crbug에서 기능을 요청할 수 있습니다.
다음 달까지
Kayce