Chrome 142 เบต้า

เผยแพร่เมื่อ: 1 ตุลาคม 2025

การเปลี่ยนแปลงเหล่านี้จะมีผลกับ Chrome 142 เวอร์ชันเบต้าสำหรับ Android, ChromeOS, Linux, macOS และ Windows เว้นแต่จะระบุไว้เป็นอย่างอื่น ดูข้อมูลเพิ่มเติมเกี่ยวกับฟีเจอร์เหล่านี้ได้จากลิงก์ที่ให้ไว้หรือใน ChromeStatus.com ดาวน์โหลด Chrome 142 เวอร์ชันเบต้าจาก Google.com สำหรับเดสก์ท็อปหรือ Google Play Store สำหรับ Android

CSS และ UI

คลาสเทียม :target-before และ :target-after

คลาสเทียมเหล่านี้จะจับคู่ตัวทำเครื่องหมายการเลื่อนที่อยู่ก่อนหรือหลังตัวทำเครื่องหมายที่ใช้งานอยู่ (ซึ่งตรงกับ :target-current) ภายในกลุ่มตัวทำเครื่องหมายการเลื่อนเดียวกัน ตามที่กำหนดโดยลำดับของ Flat Tree ดังนี้

  • :target-before: จับคู่ตัวทำเครื่องหมายการเลื่อนทั้งหมดที่อยู่ก่อนตัวทำเครื่องหมายที่ใช้งานอยู่ตามลำดับของ Flat Tree ภายในกลุ่ม
  • :target-after: จับคู่ตัวทำเครื่องหมายการเลื่อนทั้งหมดที่อยู่หลังตัวทำเครื่องหมายที่ใช้งานอยู่ตามลำดับของ Flat Tree ภายในกลุ่ม

การจัดตำแหน่งแบบสัมบูรณ์สำหรับองค์ประกอบ ::view-transition

การเปลี่ยนมุมมองจะใช้ต้นไม้ย่อยเทียมขององค์ประกอบ โดย ::view-transition จะเป็นรากของการเปลี่ยนนั้น ก่อนหน้านี้ องค์ประกอบ ::view-transition ได้รับการระบุให้มี position: fixed CSS Working Group ได้ตัดสินใจเปลี่ยนเป็น position: absolute และตอนนี้ Chrome ก็แสดงการเปลี่ยนแปลงดังกล่าวแล้ว

การเปลี่ยนแปลงนี้ไม่ควรสังเกตเห็นได้เนื่องจากบล็อกที่มีองค์ประกอบนี้ยังคงเป็นบล็อกที่มีสแนปช็อตในกรณีสัมบูรณ์หรือคงที่ ความแตกต่างที่สังเกตเห็นได้เพียงอย่างเดียวคือใน getComputedStyle

พร็อพเพอร์ตี้ activeViewTransition ในเอกสาร

View Transitions API ช่วยให้นักพัฒนาแอปเริ่มการเปลี่ยนภาพระหว่างสถานะต่างๆ ได้ จุดเริ่มต้นหลักของ SPA คือ startViewTransition() ซึ่งจะแสดงออบเจ็กต์การเปลี่ยน ออบเจ็กต์นี้มี Promise และฟังก์ชันการทำงานหลายรายการเพื่อติดตามความคืบหน้าของการเปลี่ยน และช่วยให้คุณจัดการการเปลี่ยนได้ เช่น ข้ามการเปลี่ยนหรือแก้ไขประเภทการเปลี่ยน

จาก Chrome 142 เป็นต้นไป นักพัฒนาแอปไม่จำเป็นต้องจัดเก็บออบเจ็กต์นี้อีกต่อไป พร็อพเพอร์ตี้ document.activeViewTransition แสดงออบเจ็กต์นี้ หรือ null หากไม่มีการเปลี่ยนที่กำลังดำเนินการอยู่

การเปลี่ยนแปลงนี้ยังมีผลกับการเปลี่ยน MPA ด้วย ซึ่งออบเจ็กต์จะใช้ได้ผ่านเหตุการณ์ pageswap และ pagereveal เท่านั้น ในการอัปเดตนี้ ระบบจะตั้งค่า document.activeViewTransition เป็นออบเจ็กต์นี้ตลอดระยะเวลาการเปลี่ยน

ไวยากรณ์ช่วงสำหรับการค้นหาคอนเทนเนอร์สไตล์และ if()

Chrome ปรับปรุงการค้นหาสไตล์ CSS และฟังก์ชัน if() โดยเพิ่มการรองรับไวยากรณ์ช่วง

การค้นหาสไตล์จะขยายออกไปนอกเหนือจากการจับคู่ค่าที่แน่นอน (เช่น style(--theme: dark)) นักพัฒนาแอปสามารถใช้โอเปอเรเตอร์การเปรียบเทียบ (เช่น > และ <) เพื่อเปรียบเทียบพร็อพเพอร์ตี้ที่กำหนดเอง ค่าตัวอักษร (เช่น 10px หรือ 25%) และค่าจากฟังก์ชันการแทนที่ เช่น attr() และ env() การเปรียบเทียบที่ถูกต้องทั้ง 2 ฝั่งต้องแสดงผลเป็นประเภทข้อมูลเดียวกัน โดยจำกัดไว้ที่ประเภทตัวเลขต่อไปนี้ <length>, <number>, <percentage>, <angle>, <time>, <frequency> และ <resolution>

ตัวอย่าง

เปรียบเทียบคุณสมบัติที่กำหนดเองกับความยาวตัวอักษร

@container style(--inner-padding > 1em) {
  .card {
    border: 2px solid;
  }
}

เปรียบเทียบค่าตัวอักษร 2 ค่า

@container style(1em < 20px) {
  /* ... */
}

การใช้ช่วงสไตล์ใน if()

.item-grid {
  background-color: if(style(attr(data-columns, type<number>) > 2): lightblue; else: white);
}

Interest Invokers (แอตทริบิวต์ interestfor)

Chrome เพิ่มแอตทริบิวต์ interestfor ลงในองค์ประกอบ <button> และ <a> แอตทริบิวต์นี้จะเพิ่มลักษณะการทำงาน "ความสนใจ" ให้กับองค์ประกอบ เมื่อผู้ใช้ "แสดงความสนใจ" ในองค์ประกอบ ระบบจะทริกเกอร์การดำเนินการในองค์ประกอบเป้าหมาย เช่น การแสดงป๊อปโอเวอร์ User Agent จะตรวจหาเมื่อผู้ใช้ "แสดงความสนใจ" ในองค์ประกอบผ่านวิธีการต่างๆ เช่น การวางตัวชี้เหนือองค์ประกอบ การกดปุ่มลัดพิเศษบนแป้นพิมพ์ หรือการกดค้างองค์ประกอบบนหน้าจอสัมผัส เมื่อมีการแสดงหรือสูญเสียความสนใจ ระบบจะทริกเกอร์ InterestEvent ในเป้าหมาย ซึ่งมีการดำเนินการเริ่มต้นสำหรับป๊อปโอเวอร์ เช่น การแสดงและซ่อนป๊อปโอเวอร์

พร็อพเพอร์ตี้ font-language-override

Chrome เปิดตัวการรองรับพร็อพเพอร์ตี้ CSS font-language-override พร็อพเพอร์ตี้นี้ช่วยให้นักพัฒนาแอปแทนที่ภาษาของระบบที่ใช้สำหรับการแทนที่ Glyph ของ OpenType ได้โดยการระบุแท็กภาษา 4 ตัวอักษรใน CSS โดยตรง

ซึ่งช่วยให้ควบคุมการจัดตัวพิมพ์ได้อย่างละเอียด ซึ่งมีประโยชน์อย่างยิ่งสำหรับเนื้อหาหลายภาษาหรือฟอนต์ที่มี Glyph ที่แตกต่างกันไปตามภาษา

แอตทริบิวต์ download ในองค์ประกอบ <a> ของ SVG

Chrome เปิดตัวการรองรับแอตทริบิวต์ download ในอินเทอร์เฟซ SVGAElement ซึ่งสอดคล้องกับข้อกำหนด SVG 2 แอตทริบิวต์ download ช่วยให้ผู้เขียนระบุได้ว่าจะให้ดาวน์โหลดเป้าหมายของไฮเปอร์ลิงก์ SVG แทนที่จะไปยังเป้าหมายนั้น ซึ่งจะสะท้อนลักษณะการทำงานที่รองรับอยู่แล้วใน HTMLAnchorElement แอตทริบิวต์นี้ช่วยส่งเสริมความสามารถในการทำงานร่วมกันในเบราว์เซอร์หลักๆ และรับประกันลักษณะการทำงานที่สอดคล้องกันระหว่างองค์ประกอบ <a> ของ HTML และ SVG รวมถึงปรับปรุงประสบการณ์ของนักพัฒนาแอปและความคาดหวังของผู้ใช้

ความเท่าเทียมกันระหว่างอุปกรณ์เคลื่อนที่และเดสก์ท็อปสำหรับโหมดการแสดงผลองค์ประกอบ Select

การใช้แอตทริบิวต์ size และ multiple จะทำให้แสดงผลองค์ประกอบ <select> เป็นกล่องรายการในหน้าเว็บหรือปุ่มที่มีป๊อปอัปได้ อย่างไรก็ตาม โหมดเหล่านี้ไม่มีให้บริการอย่างสอดคล้องกันใน Chrome สำหรับอุปกรณ์เคลื่อนที่และเดสก์ท็อป การแสดงผลกล่องรายการในหน้าเว็บไม่มีให้บริการในอุปกรณ์เคลื่อนที่ และปุ่มที่มีป๊อปอัปไม่มีให้บริการในเดสก์ท็อปเมื่อมีแอตทริบิวต์ multiple

การอัปเดตนี้จะเพิ่มกล่องรายการลงในอุปกรณ์เคลื่อนที่และป๊อปอัปการเลือกหลายรายการลงในเดสก์ท็อป รวมถึงตรวจสอบว่าการเลือกใช้แอตทริบิวต์ size และ multiple จะส่งผลให้เกิดโหมดการแสดงผลเดียวกันในอุปกรณ์เคลื่อนที่และเดสก์ท็อป สรุปการเปลี่ยนแปลงได้ดังนี้

  • เมื่อแอตทริบิวต์ size มีค่ามากกว่า 1 ระบบจะใช้การแสดงผลในหน้าเว็บเสมอ ก่อนหน้านี้อุปกรณ์เคลื่อนที่จะไม่สนใจค่านี้
  • เมื่อตั้งค่าแอตทริบิวต์ multiple โดยไม่มีแอตทริบิวต์ size ระบบจะใช้การแสดงผลในหน้าเว็บ ก่อนหน้านี้อุปกรณ์เคลื่อนที่จะใช้ป๊อปอัปแทนกล่องรายการในหน้าเว็บ
  • เมื่อตั้งค่าแอตทริบิวต์ multiple ด้วย size=1 ระบบจะใช้ป๊อปอัป ก่อนหน้านี้อุปกรณ์เดสก์ท็อปจะใช้กล่องรายการในหน้าเว็บ

การเปิดใช้งานของผู้ใช้แบบ Sticky ในการนำทางที่เริ่มต้นโดย Renderer ในต้นทางเดียวกัน

Chrome จะรักษาสถานะการเปิดใช้งานของผู้ใช้แบบ Sticky ไว้หลังจากที่หน้าเว็บเปลี่ยนไปเป็นหน้าเว็บอื่นในต้นทางเดียวกัน การไม่มีการเปิดใช้งานของผู้ใช้ในหน้าเว็บหลังการนำทางจะป้องกันไม่ให้มีการใช้งานบางกรณี เช่น การแสดงแป้นพิมพ์เสมือนเมื่อโฟกัสอัตโนมัติ ซึ่งเป็นการบล็อกนักพัฒนาซอฟต์แวร์ที่ต้องการสร้าง MPA ผ่าน SPA

การดำเนินการนี้ไม่ครอบคลุมคำขอนำทางที่เริ่มต้นโดยเบราว์เซอร์ (โหลดซ้ำ การนำทางประวัติ URL ที่พิมพ์ในแถบที่อยู่ และอื่นๆ)

Web API

WebGPU: ฟีเจอร์ primitive_index

WebGPU เพิ่มความสามารถใหม่ที่ไม่บังคับซึ่งแสดงผล Shader ในตัวใหม่ของ WGSL, primitive_index โดยจะแสดงดัชนีต่อ Primitive ให้กับ Fragment Shader ในฮาร์ดแวร์ที่รองรับ ซึ่งคล้ายกับ Shader ในตัว vertex_index และ instance_index ดัชนี Primitive มีประโยชน์สำหรับเทคนิคกราฟิกขั้นสูง เช่น Geometry แบบเสมือน

WebGPU: รูปแบบ Texture ระดับ 1 และระดับ 2

ขยายการรองรับรูปแบบ Texture ของ GPU ด้วยความสามารถต่างๆ เช่น การแนบการแสดงผล การผสม การสุ่มตัวอย่างหลายรายการ การแก้ปัญหา และการผูกพื้นที่เก็บข้อมูล

พร็อพเพอร์ตี้ `dataTransfer` สำหรับเหตุการณ์อินพุต insertFromPaste, insertFromDrop และ insertReplacementText

ป้อนข้อมูลพร็อพเพอร์ตี้ dataTransfer ในเหตุการณ์อินพุตด้วยค่า inputType เป็น insertFromPaste, insertFromDrop และ insertReplacementText เพื่อให้เข้าถึงข้อมูลคลิปบอร์ดและการลากและวางได้ระหว่างการดำเนินการแก้ไขในองค์ประกอบ contenteditable

ออบเจ็กต์ dataTransfer มีข้อมูลเดียวกันกับที่ใช้ได้ระหว่างเหตุการณ์ beforeinput

ฟีเจอร์นี้ใช้ได้กับองค์ประกอบ contenteditable เท่านั้น สำหรับตัวควบคุมแบบฟอร์ม (textarea, input) ลักษณะการทำงานจะยังคงเหมือนเดิม

พร็อพเพอร์ตี้นี้ทำให้ Chrome ทำงานร่วมกับ Safari และ Firefox ได้

เซสชันสื่อ: เพิ่มเหตุผลลงในรายละเอียดการดำเนินการ enterpictureinpicture

เพิ่ม enterPictureInPictureReason ลงใน MediaSessionActionDetails ที่ส่งไปยังการดำเนินการ enterpictureinpicture ใน Media Session API ซึ่งช่วยให้นักพัฒนาแอปแยกความแตกต่างระหว่างการดำเนินการ enterpictureinpicture ที่ผู้ใช้ทริกเกอร์อย่างชัดแจ้ง (เช่น จากปุ่มใน User Agent) กับการดำเนินการ enterpictureinpicture ที่ User Agent ทริกเกอร์โดยอัตโนมัติเนื่องจากเนื้อหาถูกบดบัง

การปรับแต่งตามบริบทของ Web Speech API

การอัปเดตนี้ช่วยให้เว็บไซต์รองรับการปรับแต่งตามบริบทสำหรับการจดจำเสียงพูดได้โดยการเพิ่มรายการวลีการจดจำลงใน Web Speech API

นักพัฒนาแอปสามารถระบุรายการวลีและอัปเดตวลีเหล่านั้นเพื่อปรับแต่งโมเดลการจดจำเสียงพูดให้รองรับวลีเหล่านั้น ซึ่งจะช่วยปรับปรุงความแม่นยำและความเกี่ยวข้องสำหรับการจดจำเสียงพูดเฉพาะโดเมนและการจดจำเสียงพูดที่ปรับให้เหมาะกับแต่ละบุคคล

การตรวจสอบโทเค็น MIME *+json ที่เข้มงวดมากขึ้นสำหรับโมดูล JSON

ปฏิเสธการตอบสนองของสคริปต์โมดูล JSON ที่ประเภทหรือประเภทย่อยของประเภท MIME มีจุดโค้ดโทเค็นที่ไม่ใช่ HTTP (เช่น ช่องว่าง) เมื่อจับคู่กับ *+json ซึ่งสอดคล้องกับข้อกำหนด MIME Sniffing และเครื่องมืออื่นๆ และเป็นส่วนหนึ่งของพื้นที่ที่เน้นโมดูล Interop2025

FedCM - รองรับการแสดงต้นทาง iframe ของบุคคลที่สามใน UI

ก่อน Chrome 142, FedCM จะแสดงเว็บไซต์ระดับบนสุดใน UI เสมอ

การดำเนินการนี้ใช้ได้ดีเมื่อ iframe เป็นของบุคคลที่หนึ่งในเชิงแนวคิด (เช่น foo.com อาจมี iframe foostatic.com ซึ่งไม่มีความหมายต่อผู้ใช้)

แต่หาก iframe เป็นของบุคคลที่สามจริงๆ การแสดงต้นทาง iframe ใน UI จะดีกว่าเพื่อให้ผู้ใช้เข้าใจได้ดียิ่งขึ้นว่าตนกำลังแชร์ข้อมูลเข้าสู่ระบบกับใคร ตัวอย่างเช่น โปรแกรมแก้ไขรูปภาพอาจฝังอยู่ในเว็บแอปเผยแพร่หนังสือและอาจต้องการให้ผู้ใช้เข้าถึงไฟล์ที่จัดเก็บไว้ก่อนหน้านี้ด้วยโปรแกรมแก้ไขรูปภาพ ตอนนี้ความสามารถนี้พร้อมใช้งานแล้ว

การแยกกระบวนการที่ผูกกับต้นทาง

เปลี่ยนนโยบายการแยกกระบวนการจากการล็อกกระบวนการไปยังเว็บไซต์ (เช่น example.com) เป็นการล็อกกระบวนการไปยังต้นทางที่เฉพาะเจาะจง (เช่น foo.example.com)

Chrome กำลังเปลี่ยนไปใช้โมเดลการแยกกระบวนการแบบละเอียดมากขึ้นที่เรียกว่า "การแยกต้นทาง" เพื่อเพิ่มความปลอดภัย Chrome ใช้ "การแยกเว็บไซต์" ซึ่งจัดกลุ่มต้นทางต่างๆ จากเว็บไซต์เดียวกัน เช่น a.example.com และ b.example.com ลงในกระบวนการ Renderer เดียว

การแยกต้นทางจะแยกต้นทางแต่ละรายการ (เช่น https://foo.example.com) ไว้ในกระบวนการ Renderer ของตัวเอง ซึ่งช่วยเสริมความแข็งแกร่งให้กับสถาปัตยกรรมความปลอดภัยของ Chrome โดยการปรับขอบเขตกระบวนการให้สอดคล้องกับโมเดลความปลอดภัยพื้นฐานของเว็บที่อิงตามต้นทาง ซึ่งให้การปกป้องที่ดียิ่งขึ้นจากช่องโหว่ที่อาจเกิดขึ้นภายในเว็บไซต์

เหตุการณ์ pointerrawupdate ที่ทำงานร่วมกันได้จะแสดงเฉพาะในบริบทที่ปลอดภัย

ข้อกำหนด PointerEvents จำกัด pointerrawupdate ไว้ที่บริบทที่ปลอดภัยในปี 2020 โดยซ่อนทั้งการทริกเกอร์เหตุการณ์และ Listener เหตุการณ์ส่วนกลางจากบริบทที่ไม่ปลอดภัย การอัปเดตนี้ทำให้ Chrome สอดคล้องกับข้อกำหนดที่อัปเดตและทำงานร่วมกับเบราว์เซอร์หลักอื่นๆ ได้

ช่วงทดลองใช้จากต้นทางที่อยู่ระหว่างดำเนินการ

ใน Chrome 142 คุณสามารถเลือกใช้ช่วงทดลองใช้จากต้นทางใหม่ต่อไปนี้ origin trials

ข้อมูลเข้าสู่ระบบเซสชันที่ผูกกับอุปกรณ์

วิธีให้เว็บไซต์ผูกเซสชันกับอุปกรณ์เครื่องเดียวอย่างปลอดภัย

ช่วยให้เซิร์ฟเวอร์ผูกเซสชันกับอุปกรณ์ได้อย่างปลอดภัย เบราว์เซอร์จะต่ออายุเซสชันเป็นระยะๆ เมื่อเซิร์ฟเวอร์ขอ โดยมีหลักฐานการครอบครองคีย์ส่วนตัว

พูลซ็อกเก็ต TCP ต่อเว็บไซต์ระดับบนสุด

การทดลองนี้จะประเมินผลกระทบของการเปลี่ยนขนาดพูลซ็อกเก็ต TCP ต่อโปรไฟล์จาก 256 (ค่าเริ่มต้น) เป็น 513 ขณะที่เพิ่มขีดจำกัดต่อเว็บไซต์ระดับบนสุดที่ 256 (เพื่อให้แน่ใจว่าไม่มี 2 แท็บที่จะใช้พูลจนหมด) เราได้ศึกษาความเป็นไปได้ในการเพิ่มขีดจำกัดต่อโปรไฟล์เป็น 512 แล้วและไม่พบผลลัพธ์เชิงลบ ขีดจำกัดต่อเว็บไซต์ระดับบนสุดที่ 256 เท่ากับขีดจำกัดต่อโปรไฟล์เริ่มต้น ดังนั้นจึงไม่ควรส่งผลเสียต่อประสิทธิภาพ ระบบจะกำหนดขีดจำกัดเหล่านี้แยกกันสำหรับพูล WebSocket และพูลซ็อกเก็ตปกติ (HTTP)

เราตั้งใจที่จะเปิดตัวการทดลองนี้โดยตรงหากไม่มีผลเสียเกิดขึ้น