Move search handler for text to only trigger within the text input

Signed-off-by: Julius Härtl <[email protected]>

Author: juliusknorr

src/components/EditorWrapper.vue

@@ -233,14 +233,12 @@ export default {
 		this.saveStatusPolling = setInterval(() => {
 			this.updateLastSavedStatus()
 		}, 2000)
-		document.addEventListener('keydown', this._keyUpHandler, true)
 	},
 	beforeDestroy() {
 		this.close()
 	},
 	methods: {
 		async close() {
-			document.removeEventListener('keydown', this._keyUpHandler, true)
 			clearInterval(this.saveStatusPolling)
 			if (this.currentSession && this.syncService) {
 				try {
@@ -326,7 +324,7 @@ export default {
 									},
 								}),
 								new Keymap({
-									'Ctrl-s': () => {
+									'Mod-s': () => {
 										this.syncService.save()
 										return true
 									},
@@ -465,13 +463,6 @@ export default {
 				}
 			}
 		},
-		_keyUpHandler(event) {
-			const key = event.key || event.keyCode
-			if ((event.ctrlKey || event.metaKey) && !event.shiftKey && (key === 'f' || key === 70)) {
-				event.stopPropagation()
-				return true
-			}
-		},
 	},
 }
 </script>

src/extensions/Keymap.js

@@ -20,16 +20,33 @@
  *
  */
 
-import { Extension } from 'tiptap'
+import { Extension, Plugin } from 'tiptap'
 
 export default class Keymap extends Extension {
 
 	get name() {
-		return 'save'
+		return 'customkeymap'
 	}
 
 	keys({ schema }) {
 		return this.options
 	}
 
+	get plugins() {
+		return [new Plugin({
+			props: {
+				handleKeyDown(view, event) {
+					const key = event.key || event.keyCode
+					if ((event.ctrlKey || event.metaKey) && !event.shiftKey && (key === 'f' || key === 70)) {
+						// We need to stop propagation and dispatch the event on the window
+						// in order to force triggering the browser native search in the text editor
+						event.stopPropagation()
+						window.dispatchEvent(event)
+						return true
+					}
+				},
+			},
+		})]
+	}
+
 }