The Chromium Chronicle #4: ทดสอบฟีเจอร์แพลตฟอร์มเว็บของคุณด้วย WPT

ตอนที่ 4: โดย Robert in Waterloo ออนแทรีโอ (กรกฎาคม 2019)
ตอนก่อนหน้า

หากคุณใช้ Blink ก็อาจรู้จัก web_tests (ชื่อเดิมคือ LayoutTests) web-platform-tests (WPT) อยู่ใน web_test/external/wpt WPT คือ วิธีที่แนะนำในการทดสอบฟีเจอร์เปิดเผยบนเว็บ เนื่องจากฟีเจอร์ดังกล่าวที่แชร์กับผู้ใช้อื่นๆ ผ่าน GitHub การทดสอบมี 2 ประเภทหลักๆ ได้แก่ การทดสอบโต้แย้ง และการทดสอบ testharness.js

การทดสอบอ้างอิงจะทำและเปรียบเทียบภาพหน้าจอของ 2 หน้า โดยค่าเริ่มต้น ภาพหน้าจอ จะใช้หลังจากที่เหตุการณ์ load เริ่มทำงาน หากคุณเพิ่มชั้นเรียน reftest-wait ลงในเอลิเมนต์ <html> ระบบจะถ่ายภาพหน้าจอเมื่อมีการนำคลาสออก การทดสอบที่ปิดใช้หมายถึงการครอบคลุมการทดสอบลดลง โปรดระวังเกี่ยวกับแบบอักษร ความไม่สม่ำเสมอ ใช้แบบอักษร Ahem หากเป็นไปได้

testharness.js เป็นเฟรมเวิร์ก JavaScript สำหรับทดสอบอะไรก็ได้ ยกเว้นการแสดงภาพ เมื่อเขียนการทดสอบ testharness.js โปรดให้ความสำคัญกับช่วงเวลา และอย่าลืมทำให้สภาพความเป็นไปทั่วโลกปลอดภัยด้วย

การหมดเวลาที่ไม่สม่ำเสมอและ สถานะที่อาจรั่วไหล เช่น

ไม่ควรทำ
<script>
promise_test(async t => {
  assert_equals(await slowLocalStorageTest(), "expected", "message");
  localStorage.clear();
});
</script>

การทดสอบที่ดีกว่าด้วยระยะหมดเวลาที่นาน การทำความสะอาด:

ควรทำ
<meta name="timeout" content="long">
<script>
promise_test(async t => {
  t.add_cleanup(() => localStorage.clear());
  assert_equals(await slowLocalStorageTest(), "expected", "message");
});
</script>

ใช้ testdriver.js หากต้องการให้การทำงานอัตโนมัติไม่พร้อมใช้งานบนเว็บ คุณสามารถใช้ท่าทางสัมผัสของผู้ใช้จาก test_driver.bless สร้างข้อความที่ซับซ้อน อินพุตที่เชื่อถือได้กับ test_driver.action_sequence ฯลฯ

WPT ยังมีฟีเจอร์ฝั่งเซิร์ฟเวอร์ที่เป็นประโยชน์บางรายการผ่านชื่อไฟล์ การทดสอบแบบหลายทั่วโลก (.any.js และเพื่อนในกลุ่มนี้) ทำการทดสอบเดียวกันในที่ต่างๆ ขอบเขต (window, worker ฯลฯ) .https.sub.html ขอให้โหลดการทดสอบ ผ่าน HTTPS พร้อมการสนับสนุนการแทนที่ฝั่งเซิร์ฟเวอร์เหมือนด้านล่าง:

var anotherOrigin = "https://&#123;&#123;hosts[][www1]}}:&#123;&#123;ports[https][0]}}/path/to/page.html";

คุณเปิดใช้ฟีเจอร์บางอย่างในสตริงการค้นหาได้ด้วย baz.html?pipe=sub|header(X-Key,val)|trickle(d1) เปิดใช้การแทนที่ เพิ่ม X-Key: val ที่ส่วนหัวของการตอบกลับ และหน่วงเวลา 1 วินาทีก่อนที่จะตอบกลับ ค้นหา "ไปป์" ได้ที่ web-platform-tests.org

WPT สามารถทดสอบลักษณะการทำงานที่ยังไม่ได้ระบุในข้อมูลจำเพาะได้ด้วย ตั้งชื่อการทดสอบเป็น .tentative หากคุณต้องการใช้ Blink ภายใน API (เช่น testRunner, internals) ตั้งการทดสอบใน web_tests/wpt_internal

ระบบจะส่งออกการเปลี่ยนแปลงที่ทำกับ WPT ไปยัง GitHub โดยอัตโนมัติ คุณจะเห็น ความคิดเห็นจากบ็อตใน CL ของคุณ การเปลี่ยนแปลงของ GitHub จากผู้ให้บริการรายอื่นก็ อย่างต่อเนื่อง เพื่อรับข้อบกพร่องที่ส่งมาโดยอัตโนมัติเมื่อมีการดำเนินการไม่สำเร็จใหม่ ถูกนำเข้าแล้ว ให้สร้างไฟล์ OWNERS ในไดเรกทอรีย่อยใน WPT ดังนี้

# TEAM: your-team@chromium.org
# COMPONENT: Blink>YourComponent
# WPT-NOTIFY: true
emails-here-will-be-cc@chromium.org

แหล่งข้อมูลเพิ่มเติม

  • หากต้องการทราบวิธีการทำงานของการทดสอบในเบราว์เซอร์อื่นๆ และการทำงานร่วมกัน ฟีเจอร์ของคุณคืออะไร ใช้ wpt.fyi
  • หากต้องการเอกสารประกอบเพิ่มเติมเกี่ยวกับ API, หลักเกณฑ์, ตัวอย่าง, เคล็ดลับ และอื่นๆ ไปที่ web-platform-tests.org