Xterm.js 4.x開啟鼠標事件后鼠標點擊無效(:set mouse=a)

技術棧:vue + websocket + xterm.js

背景:需要支持頁面內的搜索(類似于瀏覽器的Ctrl + F效果)

有了需求,所以我去找到相關的插件可以實現這個功能 -- xterm-addon-search,但是根據文檔,該插件需要xterm的版本為4.x,而我的項目中的版本為3.x,所以進行了一波升級,升級之后沒感到什么明顯問題。

直到用戶反饋,Linux的vim模式下如果輸入了指令:set mouse=a啟用鼠標事件后,鼠標無法選中內容已經鼠標滑輪無法滾動內容。開始排查問題,通過對比的方法,發(fā)現舊版本確實是沒有問題,那么問題就出現在新版本這里來。但是,去官網查看文檔,并沒有提到相關的地方,很苦惱,最后只能去GitHub上體issue,沒想到開發(fā)人員真的回我了。

通過與開發(fā)人員的溝通,他理解為我的后端沒有對二進制流數據進行處理(因為onBinary里面得到的是二進制流數據),所以讓我和我的后端開發(fā)人員溝通。為什么新版本里面沒有對這個鼠標事件處理了呢?下面是開發(fā)者回答的原話:

The old way led to faulty input at app side due to an implicit UTF8 conversion of mouse reports. The new way circumvents this by splitting data sent from the terminal into onData (normal string data, can be UTF8 encoded) and onBinary (cannot be UTF8 encoded).

后來經過自己的摸索,我在onBinary里面打印data得到的是鼠標的二進制流數,但是發(fā)現,websocket并沒有將這些數據發(fā)送到后端,所以難怪對鼠標事件沒有響應。于是乎,我就在onBinary里面將data通過websocket發(fā)送到后端,結果真的可以了,蕪湖.......

this.term.onBinary(data => {
    this.socket.send(JSON.stringify({data}))
})

摸索出來之后,再回頭想想開發(fā)者說的話,就是舊版本的鼠標事件可能會造成程序的崩潰,所以現在把鼠標事件的處理權交到插件使用者的手上,但是這一點并沒有在文檔中體現出來,所以可能很多人都不知道,所以在這里記錄一下。

最后,我向開發(fā)者說了我的解決辦法之后,他說他注意到這點了,并表示讓團隊在demo中把這里體現出來,免得收到更多關于鼠標事件無效的報告。


image.png

image.png

這個問題就這樣解決啦,大家遇到同樣的問題可以查考一下。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,748評論 6 531
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 98,165評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,595評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,633評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,435評論 6 405
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 54,943評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,035評論 3 440
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,175評論 0 287
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 48,713評論 1 333
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,599評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,788評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,303評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,034評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,412評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,664評論 1 280
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,408評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,747評論 2 370

推薦閱讀更多精彩內容

  • DTD 介紹 DTD(Document Type Definition 文檔類型定義)是一組機器可讀的規(guī)則,它們定...
    lio_zero閱讀 2,661評論 0 9
  • Awesome GitHub Topic for Go Awesome Go golang-open-source...
    Liam_ml閱讀 3,743評論 2 14
  • 一、CSS問題 1.flex布局 display:flex; 在父元素設置,子元素受彈性盒影響,默認排成一行,如果...
    陳二狗想吃肉閱讀 609評論 0 9
  • 前端開發(fā)面試題 面試題目: 根據你的等級和職位的變化,入門級到專家級,廣度和深度都會有所增加。 題目類型: 理論知...
    怡寶丶閱讀 2,599評論 0 7
  • http://dart.goodev.org/guides/libraries/library-tour Numb...
    Zszen閱讀 4,682評論 0 51