DevTools의 새로운 기능 (Chrome 119)

Sofia Emelianova
Sofia Emelianova
GitHub

요소의 @property 섹션 개선 > 스타일

수정 가능한 @property 규칙

이제 요소 >의 해당 섹션에서 @property CSS at-rule을 수정할 수 있습니다. 스타일 창.

속성 규칙을 수정할 수 있도록 하기 전과 후

Chromium 문제: 1471123

잘못된 @property 규칙 관련 문제가 보고됨

이제 문제 탭에서 @property 규칙의 잘못된 선언과 관련된 문제가 보고됩니다.

문제 탭에 보고된 속성 규칙 관련 문제입니다.

Chromium 문제: 1473283

에뮬레이션할 기기 목록이 업데이트됨

설정을 탭합니다. 설정 >의 사용자 에이전트 문자열 브라우저 및 운영체제의 평균 사용량을 반영하도록 기기가 업데이트되었습니다. 이제 기기 모드에서 더 많은 최신 기기를 에뮬레이션할 수 있습니다.

기기 목록 업데이트 전후

Chromium 문제: 1479733

소스의 스크립트 태그에 인라인 JSON 프리티 인쇄

이제 Sources 패널에서 <script> HTML 태그에 예쁘게 인쇄되는 인라인 JSON을 지원하여 더 쉽게 디버깅할 수 있습니다.

스크립트 태그에서 인라인 JSON을 예쁘게 인쇄하기 전과 후

Chromium 문제: 406900, 1473875

콘솔의 비공개 필드 자동 완성

이제 콘솔의 클래스 범위 밖에서 필드를 평가할 때 비공개 클래스 필드를 자동 완성할 수 있습니다.

클래스 범위 밖의 비공개 클래스 필드의 자동 완성을 지원하기 전과 후입니다.

Chromium 문제: 1483848, 1381806

Lighthouse 11.1.0

이제 Lighthouse 패널에서 Lighthouse 11.1.0을 실행합니다. 변경사항 전체 목록을 확인하세요.

DevTools에서 Lighthouse 패널을 사용하는 기본적인 방법을 알아보려면 Lighthouse: 웹사이트 속도 최적화를 참고하세요.

Chromium 문제: 772558

접근성 개선

이제 스크린 리더가 다음 내용을 읽습니다.

  • 콘솔의 경고 및 오류
  • 콘솔 또는 소스에 코드를 붙여넣을 때 이 코드를 신뢰할 수 있나요? 대화상자의 텍스트

또한 Application 패널은 고대비 모드의 링크에서 발생하던 대비 문제를 수정했습니다.

Chromium 문제: 1485257, 1486643, 1485263

웹 SQL 지원 중단

애플리케이션 > Web SQL Database API가 더 이상 유지보수되지 않으므로 Chrome 123에서 Web SQL 섹션이 삭제됩니다. 이 버전은 예정된 삭제에 대한 섹션에 경고를 추가합니다.

웹 SQL 지원 중단 경고

자세한 내용은 웹 SQL 지원 중단 및 삭제를 참조하세요.

Chromium 문제: 1485966

애플리케이션의 스크린샷 가로세로 비율 유효성 검사 > 매니페스트

애플리케이션 > 이제 매니페스트 섹션에서 동일한 폼 팩터 (wide 또는 narrow)를 사용하는 웹 앱의 스크린샷의 가로세로 비율이 동일한지 확인합니다.

동일한 폼 팩터를 사용하는 스크린샷의 잘못된 가로세로 비율에 관한 경고

자세한 내용은 프로그레시브 웹 앱 디버그 및 웹 앱 매니페스트 추가를 참고하세요.

DevTools팀은 이 변경사항을 적용하고 이전 버전의 기타 매니페스트 경고 개선을 제공해 주신 알렉세이 로디오노프님께 감사를 표합니다.

Chromium 문제: 1476656

기타 주요 정보

다음은 이번 출시에서 주목할 만한 수정사항과 개선사항입니다.

  • 요소: <ph type="x-smartling-placeholder">
      </ph>
    • 확장 가능한 약식 (1149182) 아래에 긴 CSS 속성의 애니메이션 시간 함수 견본이 표시되지 않습니다.
    • 이제 contain-intrinsic-*의 자동 완성에서 잘못된 단일 auto 값을 제공하지 않습니다. auto <length> (1480415)이어야 하기 때문입니다.
    • 지원 중단되었거나 잘못된 -webkit-* 속성에 대한 지원이 삭제되었습니다 (1086089, 1030765).
  • Breakpoints: 중단점 유형이 변경될 때 중단점 수정 대화상자가 사라지는 버그를 수정했습니다. (1485782)
  • 성능: <ph type="x-smartling-placeholder">
      </ph>
    • 공연 기록 중 색상 파싱 오류가 수정되었습니다. (1480205)
    • 타이밍 트랙에 LCP가 표시되지 않는 버그를 수정했습니다 (1487136).
  • 네트워크: 이제 쿠키 설정 열에 차단된 쿠키 (1486903)를 제외하고 설정된 올바른 쿠키 수가 표시됩니다.
  • 이제 차단되지 않은 호스트로 이동한 후 DevTools 확장 프로그램이 로드됩니다 (1476264).
  • 확장 프로그램의 잘못된 스크립트 실행 컨텍스트 버그가 수정되었습니다. (1275331)

미리보기 채널 다운로드

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

Chrome DevTools 팀에 문의하기

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

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

DevTools의 새로운 기능

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