DevTools의 새로운 기능 (Chrome 108)

비활성 CSS 속성에 대한 힌트

이제 DevTools가 유효하지만 가시적인 효과가 없는 CSS 스타일을 식별합니다. Styles 창에서 DevTools가 비활성 속성을 페이드 아웃합니다. 규칙 옆에 있는 아이콘 위로 마우스를 가져가면 규칙이 눈에 띄는 효과가 없는 이유를 알 수 있습니다.

비활성 CSS 속성에 대한 힌트입니다.

Chromium 문제: 1178508

Recorder 패널에서 XPath 및 텍스트 선택기 자동 감지

이제 Recorder 패널에서 XPath 및 텍스트 선택기를 지원합니다. 사용자 플로우 기록을 시작하면 녹음기가 자동으로 요소의 XPath 및 가장 짧은 고유 텍스트를 선택기로 선택합니다(사용 가능한 경우).

XPath 및 텍스트 선택기를 설정할 수 있습니다.

Chromium 문제: 1327206,1327209

쉼표로 구분된 표현식 단계별 수행

이제 디버깅 중에 쉼표로 구분된 표현식을 단계별로 실행할 수 있습니다. 이렇게 하면 최소화된 코드의 디버그 가능성이 향상됩니다.

쉼표로 구분된 표현식을 단계별로 실행합니다.

이전에는 DevTools가 세미콜론으로 구분된 표현식을 통한 스테핑만 지원했습니다.

아래 코드를 살펴보면

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

트랜스파일러와 축소자는 이를 쉼표로 구분된 표현식으로 변환할 수 있습니다.

function bar(){return foo(),foo(),42}

축소된 코드와 작성된 코드는 단계별 실행 동작이 다르기 때문에 이 경우 디버깅 중에 혼란이 발생합니다. 소스 맵을 사용하여 축소된 코드를 원본 코드의 측면에서 디버그할 때 더 혼란스러울 수 있습니다. 개발자가 세미콜론 (툴체인에서 쉼표로 변환된 후드)을 확인하지만 디버거가 세미콜론을 멈추지 않기 때문입니다.

Chromium 문제: 1370200

무시 목록 설정 개선

설정 > 무시 목록으로 이동합니다. DevTools의 디자인이 개선되어 단일 스크립트나 스크립트 패턴을 무시하는 규칙을 구성할 수 있습니다.

무시 목록 탭

Chromium 문제: 1356517

기타 주요 정보

다음은 이번 버전에서 주목할 만한 수정사항입니다.

  • 스페이스바를 누르면 스타일 창의 CSS 속성 이름이 자동 완성됩니다. (1343316)
  • 요소 패널의 탐색경로에서 자동 스크롤을 삭제합니다. (1369734)

미리보기 채널 다운로드

Chrome Canary, Dev 또는 베타를 기본 개발 브라우저로 사용해 보세요. 이러한 미리보기 채널을 통해 최신 DevTools 기능에 액세스하고, 최첨단 웹 플랫폼 API를 테스트하고, 사용자보다 먼저 사이트에서 문제를 발견할 수 있습니다.

Chrome DevTools 팀에 문의하기

다음 옵션을 사용하여 게시물의 새로운 기능과 변경사항 또는 DevTools와 관련된 다른 사항에 대해 논의하세요.

  • crbug.com을 통해 제안이나 의견을 보내주세요.
  • DevTools에서 옵션 더보기   더보기   > 도움말 > DevTools 문제 신고를 사용하여 DevTools 문제를 신고하세요.
  • @ChromeDevTools에서 트윗하세요.
  • DevTools의 새로운 기능 YouTube 동영상 또는 DevTools 도움말 YouTube 동영상에 의견을 남겨주세요.

DevTools의 새로운 기능

DevTools의 새로운 기능 시리즈에서 다룬 모든 내용 목록입니다.

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Chrome 101

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82가 취소되었습니다.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59