2016-06-12 186 views
0

Chrome控制檯非常好,我正在使用它作爲我的應用程序的開發環境。將自定義點擊事件綁定到Chrome控制檯上

我想定製它進一步爲我的具體用例。例如,與在控制檯中單擊DOM元素的JavaScript對象版本時相同的方式,DOM元素會自動檢查,我想在主頁面中觸發自定義函數。

這可能嗎?

謝謝。

回答

1

Chrome DevTools API沒有公開任何允許您修改我理解的擴展模塊中控制檯模塊的行爲的任何內容。

如果你需要一個特定的行爲只爲你自己,你可以分叉存儲庫和周圍的代碼。

我花了一點時間作爲一項學習任務進行調查。我通過在非停靠模式下打開DevTools,然後打開另一個實例來檢查DevTools代碼。我在代碼中找到了處理控制檯模塊的click事件的區域。

  1. 在當前頁面中,我創建了一個包含兩個DOM元素的對象,以便您可以看到懸停將檢查元素並單擊元素選項卡中的實際選擇元素。

Test objects

  • 控制檯模塊中的功能_messageClicked在一些階段中一個click事件之後調用。我在那裏放了一個斷點,因爲我在代碼中發現了click - 我最好猜測,因爲我根本不知道代碼庫。
  • Inspecting DevTools 1

  • 走出這個功能後,我們發現mouseClicked也處理它的檢查模塊,以及reveal函數被調用是假想的地方實際上是檢查邏輯。
  • 你可能可能在這個函數調用之前添加你自己的邏輯來調用被檢查窗口中的函數。檢查員模塊具有對chrome.devtools.inspectedWindow的引用。

    Inspecting DevTools 2

    如果你能得到的東西在這裏工作,壞處是你不會有任何新功能或更新爲Chrome DevTools,所以它真的只是DevTools的局部修改。如果你能夠添加一個不是特定於你自己的代碼的更通用的功能,你可以嘗試在Chromium Projects網站上建議它,並可能提出拉請求。

    這似乎有點工作會涉及任何一種方式。

    +0

    很好的回答。感謝您通過您的流程走過我。 – Harry