除錯工具更新

早在 2012 年，我介紹了 DataTables 除錯工具的第一個版本。今天，我很樂意推出更新版本，其中引入了許多新功能，並更加注重隱私。

DataTables 除錯工具可以用作書籤小工具，也可以簡單地從除錯工具網站複製幾行程式碼並貼到瀏覽器的控制台中執行。載入後，除錯工具現在會顯示一個包含四個操作選項的介面

表格摘要資訊：這對於查看您頁面上的表格概述、其資料來源和處理模式非常有用。
版本資訊：顯示您頁面上正在使用的 DataTables 軟體版本資訊，並與可用的最新版本進行比較（指出是否有可用的升級）。
執行常見測試：我們發現許多使用者在使用 DataTables 時會遇到一些相同的問題。這些問題在 DataTables 中並非總是容易或適合測試，因此 DataTables 除錯工具填補了這個空白，並會通知您任何已發現的組態錯誤問題以及如何處理它們。
上傳資料：與之前一樣，您可以選擇將有關表格的資訊上傳到除錯伺服器。但是，雖然之前這是自動發生的，但現在您需要明確點擊上傳按鈕才能執行此操作。我們也變更了存取除錯資訊的方式，因此只有 SpryMedia 的員工才能看到除錯追蹤。

使用除錯工具

有關如何在您的頁面上執行除錯工具的完整詳細資訊，請參閱除錯工具網站。但是，您只需打開瀏覽器的控制台，複製/貼上以下 Javascript，然後按 Enter 即可

var n = document.createElement('script');
n.setAttribute('language', 'JavaScript');
n.setAttribute('src', 'https://debug.datatables.net/debug.js');
document.body.appendChild(n);

開放原始碼

除錯工具的客戶端元件現在是開放原始碼，如果您有興趣，我們鼓勵您查看原始碼 - 特別是新增任何可能有用的新測試。程式碼是 TypeScript，只需輸入 gulp 即可編譯為 Javascript。請務必先執行 npm install 以載入任何相依性。

歡迎提出 Pull Request - 程式碼使用 Prettier 和 Tab 鍵進行格式化。

測試

新除錯工具最有趣的方面之一是它能夠在客戶端本機執行測試，確保頁面上 DataTables 的完整性。我們計劃在適當的時候根據論壇的支援請求新增新的測試。這裡的目標是捕獲可以透過程式碼檢查的組態錯誤，而無需增加 DataTables 核心及其擴充套件的程式碼大小。

如果您有興趣貢獻任何新的測試，請將您的測試新增為 js/tests 目錄中的新檔案。您應該匯入 ../lib 檔案，其中包含測試的通用函式庫函式，包括建立新測試的方法。

測試應傳回一個物件陣列，其中包含 table、level 和 msg 屬性，詳細說明已偵測到的任何錯誤（如果測試函式不符合要求，TypeScript 將顯示錯誤！）。典型測試的結構可能如下所示

import * as lib from '../lib';

lib.createTest('Test name', function($) {
    let out = [];

    if (!$.fn.dataTable) {
        return out;
    }

    $.fn.dataTable.tables({ api: true }).iterator('table', function(settings, i) {
        ...
    });

    return out;
});

您還必須將新檔案新增至 js/tests/index.ts 中的清單，以確保它包含在除錯工具中。然後執行 gulp 以建立新的除錯工具，並在您的瀏覽器中執行它（當然，根據需要更新路徑！）

var n = document.createElement('script');
n.setAttribute('language', 'JavaScript');
n.setAttribute('src', '/path/to/debug/index.js?rand=' + new Date().getTime());
document.body.appendChild(n);

支援請求

我們使用除錯工具的目標是協助您協助我們處理任何支援請求。在請求協助時，我們需要有關您如何使用 DataTables 及其擴充套件的資訊 - 除錯工具通常可以為我們提供該資訊（對於非樣式相關的問題）。因此，如果無法進行測試案例（測試案例仍然是首選！），我們將越來越多地要求提供除錯追蹤。

祝您使用愉快！