在iframe中模擬縮小代碼中的React事件

Question

我有文件main.js和test.js，其中包含已編譯的clojurescript代碼。

當我打開my-site.com/test，它加載test.js，它增加了一個iframe來加載my-site.com/main的頁面，這反過來負荷main.js。 test.js然後在iframe內測試與my-site.com/main的各種用戶交互。

問題是我使用的是React，所以我需要模擬React事件。我使用iframe結構的部分原因是因爲我瞭解到React.addons.TestUtils未被加載到縮小的代碼中。我認爲，通過將test.js未縮小，我將能夠使用其版本React.addons.TestUtils.Simulate來模擬React事件main.js，即使後者被縮小。我認爲這將使我能夠測試生產代碼。

我通過大量的試驗和錯誤發現那是什麼，當main.js不精縮，我可以用它的Simulate就好了版本，但是當它已經過壓縮，我不能元素main使用Simulate從test.js。

我對不對？如果庫沒有加載到相關窗口中，是否可以使用React.addons.TestUtils.Simulate？是否有可能做我想做的事情，還是有更好的辦法？

Answer 1

經過數小時的反覆試驗，我終於發現我根本不需要使用ReactTestUtils.Simulate。我以前從未能在我的React DOM中觸發事件，但事實證明，我需要做的就是將bubbles: true設置爲常規Event，因爲它會觸發相應的React事件。

而且，因爲我試圖模擬事件爲「KEYUP」，我還發現，我不能設置which或keyCode財產上KeyboardEvent，在瀏覽器中至少（which和keyCodeare deprecated）。所以我不得不改變我的聽衆尋找event.key而不是event.which。 （我仍然在尋找which來適應舊的瀏覽器，但我首先檢查key）。

這工作：

inputElement.dispatchEvent(new KeyboardEvent("keyup", {key: "Enter", bubbles: true}); 

希望這樣可以節省別人有些麻煩！