web-ext และ addons.mozilla.org ใช้งาน Add-on Linter เพื่อขยาย WebExtensions
นอกจากนี้ยังสามารถใช้เป็นไบนารีและไลบรารีแบบสแตนด์อโลนได้
คุณสามารถดูข้อมูลเพิ่มเติมเกี่ยวกับ linter และกฎการใช้งานได้ในเอกสารประกอบของเรา
คุณต้องมี Node.js เพื่อใช้ linter ส่วนเสริม
หากต้องการตรวจสอบส่วนเสริมของคุณภายในเครื่อง ให้ติดตั้ง linter จาก npm:
# Install globally so you can use the linter from any directory on
# your machine.
npm install -g addons-linter
หลังการติดตั้ง ให้เรียกใช้ linter และนำไปยังไฟล์ส่วนเสริมของคุณ:
addons-linter my-addon.zip
หรือคุณสามารถชี้ไปที่ไดเร็กทอรี:
addons-linter my-addon/src/
Addons-linter จะตรวจสอบ Add-on ของคุณและแสดงข้อผิดพลาด คำเตือน และข้อความที่เป็นมิตรสำหรับ Add-on ของคุณ หากคุณต้องการข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกที่คุณสามารถเปิด/ปิดการใช้งานสำหรับแอปบรรทัดคำสั่ง ให้ใช้ตัวเลือก --help
:
addons-linter --help
addons-linter สามารถขยายส่วนขยายที่มีสิทธิพิเศษ ได้ก็ต่อ เมื่อมีการส่งตัวเลือก --privileged
ไปให้เท่านั้น ตัวเลือกนี้จะเปลี่ยนพฤติกรรมของ linter เป็น:
คุณสามารถใช้ linter เป็นไลบรารีได้โดยตรงเพื่อรวมเข้ากับกระบวนการพัฒนาของคุณได้ดียิ่งขึ้น
import linter from 'addons-linter' ;
const sourceDir = process . cwd ( ) ;
const linter = linter . createInstance ( {
config : {
// This mimics the first command line argument from yargs,
// which should be the directory to the extension.
_ : [ sourceDir ] ,
logLevel : process . env . VERBOSE ? 'debug' : 'fatal' ,
stack : Boolean ( process . env . VERBOSE ) ,
pretty : false ,
warningsAsErrors : false ,
metadata : false ,
output : 'none' ,
boring : false ,
selfHosted : false ,
// Exclude files:
shouldScanFile : ( fileName ) => true ,
} ,
// This prevent the linter to exit the nodejs application
runAsBinary : false ,
} ) ;
linter . run ( )
. then ( ( linterResults ) => ... )
. catch ( ( err ) => console . error ( "addons-linter failure: " , err ) ) ;
linter.output
ประกอบด้วยคุณสมบัติต่อไปนี้ (เหมือนกับประเภทรายงาน 'json'):
{
metadata : { ... } ,
summary : {
error , notice , warning ,
} ,
count ,
error : [ {
type : "error" ,
code , message , description ,
column , file , line
} , ... ] ,
warning : [ ... ] ,
notice : [ ... ]
}
หากคุณต้องการช่วยเราพัฒนา addons-linter ก็เยี่ยมมาก! การเริ่มต้นทำได้ค่อนข้างง่าย คุณเพียงแค่ต้องติดตั้ง Node.js บนเครื่องของคุณ
หากคุณติดตั้ง Node.js ต่อไปนี้เป็นการเริ่มต้นอย่างรวดเร็วในการติดตั้งการพึ่งพาการพัฒนาและดำเนินการทดสอบ
git clone https://github.com/mozilla/addons-linter.git
cd addons-linter
npm install
# Build the project.
npm run build
# Run the test-suite and watch for changes. Use `npm run test-once` to
# just run it once.
npm run test
คุณยังสามารถสร้างไบนารี addons-linter เพื่อทดสอบการเปลี่ยนแปลงของคุณได้
npm run build
# Now run it against your add-on. Please note that for every change
# in the linter itself you'll have to re-build the linter.
bin/addons-linter my-addon.zip
addons-linter ต้องใช้ Node.js v16 หรือสูงกว่า ดูไฟล์ .circleci/config.yml
ของเรา ซึ่งเป็นเวอร์ชัน Node.js ที่เราทดสอบอย่างเป็นทางการ
การใช้ nvm อาจเป็นวิธีที่ง่ายที่สุดในการจัดการโหนดหลายเวอร์ชันควบคู่กัน ดู nvm บน GitHub สำหรับรายละเอียดเพิ่มเติม
ติดตั้งการพึ่งพาด้วย npm:
npm install
สคริปต์ | คำอธิบาย |
---|---|
การทดสอบเวลาต่อนาที | ดำเนินการทดสอบ (เฝ้าดูการเปลี่ยนแปลง) |
npm [รัน] บิลด์ | สร้าง lib (ใช้โดย CI) |
ครอบคลุมการทดสอบการรัน NPM | ดำเนินการทดสอบด้วยความครอบคลุม (เฝ้าดูการเปลี่ยนแปลง) |
การทดสอบรัน NPM หนึ่งครั้ง | ทำการทดสอบหนึ่งครั้ง |
npm เรียกใช้ผ้าสำลี | รัน ESLint |
npm รันการทดสอบความครอบคลุมครั้งเดียว | ดำเนินการทดสอบหนึ่งครั้งโดยครอบคลุม |
npm รันการทดสอบการรวม linter | รันชุดทดสอบการรวมระบบของเรา |
npm วิ่งได้สวยขึ้น | จัดรูปแบบโค้ดฐานทั้งหมดโดยอัตโนมัติด้วย Prettier |
npm ทำงานสวยกว่า-ci | เรียกใช้ Prettier และล้มเหลวหากโค้ดบางส่วนมีการเปลี่ยนแปลงโดยไม่ได้รับการจัดรูปแบบ |
npm รัน prettier-dev | เปรียบเทียบและจัดรูปแบบไฟล์ต้นฉบับที่แก้ไขกับสาขาหลักโดยอัตโนมัติ |
คุณสามารถรัน npm run build
เพื่อสร้างไลบรารีได้
เมื่อคุณสร้างไลบรารี่แล้ว คุณสามารถใช้ CLI ใน bin/addons-linter
รัน npm test
ซึ่งจะคอยดูการเปลี่ยนแปลงไฟล์และรันชุดทดสอบอีกครั้ง
เรากำลังพยายามรักษาความครอบคลุมไว้ที่ 100% ใช้ข้อมูลความครอบคลุมในผลลัพธ์การทดสอบเพื่อดูว่าบรรทัดใดบ้างที่ไม่ครอบคลุม และตรวจสอบให้แน่ใจว่าบรรทัดเหล่านั้นครอบคลุม
เรากำลังใช้ Sinon เพื่อการยืนยัน การเยาะเย้ย ต้นขั้ว และอื่นๆ ดูเอกสาร Sinon สำหรับ API ที่พร้อมใช้งาน
Jest ถูกใช้เป็นตัวดำเนินการทดสอบ แต่ยังให้เครื่องมือที่เป็นประโยชน์อีกด้วย โปรดตรวจสอบให้แน่ใจว่าคุณได้อ่านเอกสารประกอบของพวกเขาสำหรับรายละเอียดเพิ่มเติม
เราใช้ pino ในการบันทึก:
LOG_LEVEL=debug jest test
--log-level [level]
เราใช้ Prettier เพื่อจัดรูปแบบโค้ด JavaScript ของเราโดยอัตโนมัติ และหยุดการถกเถียงเรื่องสไตล์ที่กำลังดำเนินอยู่ทั้งหมด ในฐานะนักพัฒนา คุณต้องรันมัน (ด้วย npm run prettier-dev
) ก่อนที่จะส่ง Pull Request
กระบวนการโลคัลไลเซชันนั้นคล้ายกันมากกับวิธีที่เราทำกับส่วนเสริมส่วนหน้า: โลแคลจะได้รับการอัปเดตในสาขา master
เสมอ PR ใด ๆ ที่เปลี่ยนแปลงหรือแนะนำสตริงที่โลคัลไลซ์ใหม่ควรถูกรวมเข้ากับ master
ก่อน
ในการอัปเดตโลแคล (เมื่อมีการเพิ่มสตริงที่แปลแล้วใหม่ลงในโค้ดเบส) ให้รันสคริปต์ต่อไปนี้จากสาขา master
สคริปต์นี้ดำเนินการขั้นตอน ทั้งหมด ที่อธิบายไว้ในเอกสารส่วนหน้าของส่วนเสริมโดยอัตโนมัติ โดยไม่มีขั้นตอนการยืนยันใดๆ
./scripts/run-l10n-extraction
โดยสรุปวิธีการทำงานของ linter คือการใช้แพ็คเกจเสริม แยกข้อมูลเมตาออกจากรูปแบบ xpi (zip) จากนั้นประมวลผลไฟล์ที่พบผ่านเครื่องสแกนเนื้อหาต่างๆ
เรากำลังพึ่งพา ESLint อย่างมากสำหรับ JavaScript Linting, Cheerio สำหรับการแยกวิเคราะห์ HTML รวมถึง fluent.js สำหรับการแยกวิเคราะห์ชุดภาษา
ไฟล์แต่ละประเภทมีเครื่องสแกน ตัวอย่างเช่น: ไฟล์ JavaScript ใช้ JavaScriptScanner
เครื่องสแกนแต่ละเครื่องจะดูไฟล์ที่เกี่ยวข้องและส่งแต่ละไฟล์ผ่านเครื่องแยกวิเคราะห์ ซึ่งจะส่งต่อไปยังชุดกฎที่จะค้นหาสิ่งที่เฉพาะเจาะจง
กฎจะถูกส่งออกผ่านฟังก์ชันเดียวในไฟล์เดียว กฎสามารถมีฟังก์ชันส่วนตัวที่ใช้ภายในได้ แต่โค้ดกฎไม่ควรขึ้นอยู่กับไฟล์กฎอื่น และไฟล์กฎแต่ละไฟล์ควรส่งออกกฎหนึ่งข้อ
แต่ละฟังก์ชันของกฎจะถูกส่งผ่านข้อมูลจากเครื่องสแกนเพื่อดำเนินการตรวจสอบเฉพาะสำหรับกฎนั้น โดยจะส่งคืนรายการของออบเจ็กต์ซึ่งจากนั้นจะถูกสร้างเป็นออบเจ็กต์ข้อความและถูกส่งไปยัง Collector
Collector เป็นที่เก็บในหน่วยความจำสำหรับออบเจ็กต์ข้อความตรวจสอบความถูกต้องทั้งหมดที่ "รวบรวม" ขณะที่เนื้อหาของแพ็คเกจถูกประมวลผล
แต่ละข้อความมีรหัสซึ่งเป็นกุญแจสำคัญด้วย มีข้อความซึ่งเป็นโครงร่างสั้นๆ ว่าข้อความนั้นแสดงถึงอะไร และคำอธิบายซึ่งมีรายละเอียดเพิ่มเติมว่าเหตุใดข้อความนั้นจึงถูกบันทึก ประเภทของข้อความจะถูกตั้งค่าเมื่อมีการเพิ่มข้อความ ดังนั้น หากจำเป็น ข้อความเดียวกันนี้อาจเป็นข้อผิดพลาด หรือ คำเตือน เป็นต้น
สุดท้ายเมื่อการประมวลผลเสร็จสิ้น linter จะส่งออกข้อมูลที่รวบรวมไว้เป็นข้อความหรือ JSON
เราปรับใช้กับ npm โดยอัตโนมัติโดยใช้ Circle CI หากต้องการเผยแพร่เวอร์ชันใหม่ ให้เพิ่มเวอร์ชันใน package.json
และสร้าง PR ตรวจสอบให้แน่ใจว่าหมายเลขเวอร์ชันของคุณสอดคล้องกับรูปแบบ semver เช่น: 0.2.1
หลังจากรวม PR แล้ว ให้สร้างรุ่นใหม่ที่มีชื่อแท็กเดียวกันกับเวอร์ชันใหม่ของคุณ เมื่อบิลด์ผ่านก็จะปรับใช้ มายากล!
ณ เดือนพฤศจิกายน 2021 ร้านขายยาได้รวมเข้ากับโปรเจ็กต์นี้แล้ว และ CLI ก็พร้อมใช้งานโดยการเรียกใช้ ./scripts/dispensary
dispensary
นี่คือกระบวนการ (ด้วยตนเอง) ในการอัปเดตห้องสมุด "ร้านขายยา":
src/dispensary/libraries.json
src/dispensary/libraries.json
หรือไม่ โปรดทราบว่าไลบรารีบางแห่ง เช่น React รองรับหลายเวอร์ชัน ดังนั้นเราจึงจำเป็นต้องตรวจสอบ "สาขา" แต่ละแห่งsrc/dispensary/libraries.json
npm run update-hashes
src/dispensary/libraries.json
และ src/dispensary/hashes.txt
หมายเหตุ: hashes.txt
จะถูกฝังลงในบันเดิล addons-linter
คำสั่ง scripts/update-dispensary-doc
อัพเดตรายการเพจรีลีสด้านบนตามไฟล์ src/dispensary/libraries.json
ซอร์สโค้ดนี้มีให้ภายใต้ Mozilla Public License 2.0
นอกจากนี้ บางส่วนของไฟล์สคีมามาจากซอร์สโค้ด Chromium:
ลิขสิทธิ์ (c) 2012 ผู้เขียน Chromium สงวนลิขสิทธิ์. การใช้ซอร์สโค้ดนี้อยู่ภายใต้ใบอนุญาตสไตล์ BSD ซึ่งสามารถพบได้ในไฟล์ LICENSE-CHROMIUM
คุณไม่ได้รับสิทธิ์หรือใบอนุญาตในเครื่องหมายการค้าของ Mozilla Foundation หรือฝ่ายใดๆ รวมถึงแต่ไม่จำกัดเพียงชื่อหรือโลโก้ของ Firefox
สำหรับข้อมูลเพิ่มเติม โปรดดู: https://www.mozilla.org/foundation/licensing.html