# class:coverage ### class: Coverage v0.9.0 Coverage 收集相關頁面使用的 JavaScript 和 CSS 部分的信息。 使用 JavaScript 和 CSS 覆蓋率來獲取初始百分比的例子 執行代碼： ``` // 啟用 JavaScript 和 CSS 覆蓋await Promise.all([ page.coverage.startJSCoverage(), page.coverage.startCSSCoverage()]);// 導航至頁面await page.goto('https://example.com');// 禁用 JavaScript 和 CSS 覆蓋const [jsCoverage, cssCoverage] = await Promise.all([ page.coverage.stopJSCoverage(), page.coverage.stopCSSCoverage(),]);let totalBytes = 0;let usedBytes = 0;const coverage = [...jsCoverage, ...cssCoverage];for (const entry of coverage) { totalBytes += entry.text.length; for (const range of entry.ranges) usedBytes += range.end - range.start - 1;}console.log(`Bytes used: ${usedBytes / totalBytes * 100}%`); ``` *使用 [Istanbul](https://github.com/istanbuljs) 輸出一個覆蓋率表格，見 [puppeteer-to-istanbul](https://github.com/istanbuljs/puppeteer-to-istanbul).* #### Methods - [coverage.startCSSCoverage(options)](#?product=Puppeteer&version=v1.11.0&show=api-coveragestartcsscoverageoptions)v0.9.0 - [coverage.startJSCoverage(options)](#?product=Puppeteer&version=v1.11.0&show=api-coveragestartjscoverageoptions)v0.9.0 - [coverage.stopCSSCoverage()](#?product=Puppeteer&version=v1.11.0&show=api-coveragestopcsscoverage)v0.9.0 - [coverage.stopJSCoverage()](#?product=Puppeteer&version=v1.11.0&show=api-coveragestopjscoverage)v0.9.0 ### Methods #### coverage.startCSSCoverage(options)v0.9.0 - `options` <[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")> 覆蓋范圍的配置項 - `resetOnNavigation` <[boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Boolean_type "Boolean")> 是否重置每個導航的覆蓋范圍。默認是 `true`。 - returns: <[Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise")> Promise that resolves when coverage is started #### coverage.startJSCoverage(options)v0.9.0 - `options` <[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")> 覆蓋范圍的配置項 - `resetOnNavigation` <[boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Boolean_type "Boolean")> 是否重置每個導航的覆蓋范圍。默認是 `true`。 - `reportAnonymousScripts` <[boolean](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Boolean_type "Boolean")> 是否應報告頁面生成的匿名腳本。 默認為 `false`。 - returns: <[Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise")> Promise that resolves when coverage is started > **注意** 匿名腳本指的是沒有關聯 URL 的腳本。 它們是使用 `eval` 或 `new Function` 在頁面上動態創建的腳本。如果`reportAnonymousScripts` 設置為 `true`，匿名腳本將使用 `__puppeteer_evaluation_script__` 作為其URL。 #### coverage.stopCSSCoverage()v0.9.0 - returns: <[Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise")<[Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array "Array")<[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")>>> Promise that resolves to the array of coverage reports for all stylesheets - `url` <[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type "String")> 樣式表 URL - `text` <[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type "String")> 樣式表內容 - `ranges` <[Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array "Array")<[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")>> 所使用的StyleSheet范圍。 范圍已排序且不重疊。 - `start` <[number](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type "Number")> 包含文字的起始偏移量 - `end` <[number](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type "Number")> 文本中的結尾偏移，獨占 > **注意** CSS Coverage 不包含沒有 sourceURL 的動態注入式樣式標簽。 #### coverage.stopJSCoverage()v0.9.0 - returns: <[Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise "Promise")<[Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array "Array")<[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")>>> Promise that resolves to the array of coverage reports for all non-anonymous scripts - `url` <[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type "String")> 腳本 URL - `text` <[string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#String_type "String")> 腳本內容 - `ranges` <[Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array "Array")<[Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object "Object")>> 已執行的腳本范圍。 范圍已排序且不重疊。 - `start` <[number](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type "Number")> 包含文字的起始偏移量 - `end` <[number](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type "Number")> 文本中的結尾偏移，獨占 > **注意** JavaScript Coverage 默認情況下不包含匿名腳本。 但是，具有 sourceURL 的腳本將被上報。  puppeteer.js中文網|class:coverage puppeteer.js中文文檔, puppeteer chrome, puppeteer firefox, puppeteer api 中文文檔 puppeteer.js中文網包含了Puppeteer中文文檔，最新資訊，應用案例等。Puppeteer 是一個 Node 庫，它提供了一個高級 API 來通過 DevTools 協議控制 Chromium 或 Chrome。