[stable34] fix: search decoration

playwright/e2e/print.spec.ts

@@ -26,6 +26,10 @@ const hasPdftoppm = (() => {
 	}
 })()
 
+/**
+ * @param pdf - the pdf file
+ * @param dir - the target directory
+ */
 function renderPdfPages(pdf: Buffer, dir: string): Buffer[] {
 	const pdfPath = join(dir, 'print.pdf')
 	writeFileSync(pdfPath, pdf)

src/plugins/searchDecorations.js

@@ -4,6 +4,7 @@
  */
 
 import { emit } from '@nextcloud/event-bus'
+import { escapeForRegEx } from '@tiptap/core'
 import { Plugin, PluginKey } from '@tiptap/pm/state'
 import { Decoration, DecorationSet } from '@tiptap/pm/view'
 import { searchQueryPluginKey } from './searchQuery.js'
@@ -95,19 +96,20 @@ export function runSearch(doc, query, options) {
 		? query.trim().slice(1).toLowerCase()
 		: query.trim().toLowerCase()
 
-	doc.descendants((node, offset, _position) => {
-		// Add decorations for text matches
-		if (node.isText) {
-			const matches = node.text.matchAll(new RegExp(query, 'gi'))
+	const regex = new RegExp(escapeForRegEx(query), 'gi')
 
-			for (const match of matches) {
+	doc.descendants((node, offset) => {
+		// Search the whole textblock so matches can sparn mark boundaries.
+		// Inline leaf nodes take one position each, so map them to one char.
+		if (node.isTextblock) {
+			const text = node.textBetween(0, node.content.size, undefined, '\uFFFC')
+
+			for (const match of text.matchAll(regex)) {
 				results.push({
-					from: match.index + offset,
-					to: match.index + offset + query.length,
+					from: offset + 1 + match.index,
+					to: offset + 1 + match.index + match[0].length,
 				})
 			}
-
-			return
 		}
 
 		// Add decorations for mention matches
@@ -122,6 +124,9 @@ export function runSearch(doc, query, options) {
 		}
 	})
 
+	// Text matches of a block are pushed before its mentions; restore document order
+	results.sort((a, b) => a.from - b.from)
+
 	if (options.matchAll) {
 		return {
 			results,

src/tests/plugins/linkClicking.spec.ts

@@ -8,6 +8,9 @@ import Link from '../../marks/Link.ts'
 import createCustomEditor from '../testHelpers/createCustomEditor.ts'
 
 describe('linkClicking plugin', () => {
+	/**
+	 * @param content - the editor content
+	 */
 	function setup(content: string) {
 		const openLink = vi.fn()
 		const editor = createCustomEditor(content, [Link.configure({ openLink })])
@@ -16,6 +19,10 @@ describe('linkClicking plugin', () => {
 		return { editor, openLink, link }
 	}
 
+	/**
+	 * @param el - the DOM element
+	 * @param init - mouse event init
+	 */
 	function click(el: Element, init: MouseEventInit = {}) {
 		el.dispatchEvent(
 			new MouseEvent('click', {

src/tests/plugins/searchDecorations.spec.js

@@ -59,6 +59,31 @@ describe('search plugin', () => {
 		testSearch('<p>cat dinosaur bird dog cat</p>', 'cat', expected)
 	})
 
+	it('finds matches spanning different marks', () => {
+		const expected = {
+			results: [{ from: 1, to: 11 }],
+			total: 1,
+			index: 0,
+		}
+
+		testSearch(
+			'<p>test<strong>string</strong> other</p>',
+			'teststring',
+			expected,
+		)
+	})
+
+	it('finds matches after an inline node', () => {
+		const doc =
+			'<p>a<span class="mention" data-type="user" data-id="jane.doe" data-label="Jane Doe">Jane Doe</span>teststring</p>'
+
+		const expected = {
+			results: [{ from: 3, to: 13 }],
+		}
+
+		testSearch(doc, 'teststring', expected)
+	})
+
 	it('finds matches in separate blocks', () => {
 		const doc =
 			'<p>cat dinosaur bird dog cat</p>'
@@ -71,7 +96,7 @@ describe('search plugin', () => {
 				{ from: 37, to: 40 },
 				{ from: 55, to: 58 },
 			],
-			total: 5,
+			total: 4,
 			index: 0,
 		}
 
@@ -107,7 +132,7 @@ const testSearch = (content, query, expectedSearchResults) => {
 	const editor = createCustomEditor(content, [Mentions])
 	const doc = editor.state.doc
 	const searched = runSearch(doc, query)
-	expect(searched).toHaveProperty('results', expectedSearchResults.results)
+	expect(searched).toMatchObject(expectedSearchResults)
 	expect(highlightResults(doc, searched.results)).toEqual(
 		highlightResults(doc, expectedSearchResults.results),
 	)