Search

[stevengharris]

I found I really needed a search capability in the application I am working on that is consuming the MarkupEditor. I actually need multiple levels of search in that application. At one level I use SwiftUI's .searchable modifier to filter a List of Views each of which contains a MarkupWKWebView. This uses CoreSpotlight functionality to identify the model objects whose content includes what I'm searching for. The model objects know how to index themselves (with some debug printing and below):

func index() {
    let attributeSet = CSSearchableItemAttributeSet(contentType: UTType.html)
    attributeSet.kind = "<MyModelObject>"
    let contentData = contents.data(using: .utf8)
    attributeSet.htmlContentData = contentData
    if let data = contentData {
        if let attributedString = try? NSAttributedString(data: data, options: [.documentType: NSAttributedString.DocumentType.html], documentAttributes: nil) {
            if attributedString.length > 30 {
                attributeSet.contentDescription = "\(attributedString.string.prefix(30))..."
            } else {
                attributeSet.contentDescription = attributedString.string
            }
        }
    }
    
    let item = CSSearchableItem(uniqueIdentifier: <MyModelObject's id>, domainIdentifier: <MyModelObject's container domain>, attributeSet: attributeSet)
    item.expirationDate = Date.distantFuture
    CSSearchableIndex.default().indexSearchableItems([item]) { error in
        if let error = error {
            print("Indexing error: \(error.localizedDescription)")
        } else {
            print("Search item successfully indexed!")
        }
    }
}

func deindex() {
    CSSearchableIndex.default().deleteSearchableItems(withIdentifiers: [idString]) { error in
        if let error = error {
            print("Deindexing error: \(error.localizedDescription)")
        } else {
            print("Search item successfully removed!")
        }
    }
}

I put this detail here because it turns out that saving the MarkupEditor HTML works well with CoreSpotlight, since it knows how to avoid confusing things like a <table> tag with the word "table" in text, and it will also include text embedded in <a> href's. In other words, CoreSpotlight has all the smarts to do proper indexing of HTML content.

Once I had the ability to filter lists based on a search, then, I still found myself wanting to select the text in the MarkupWKWebView. This is a job for XPath, which I had not used before. AFAICT, WebKit is only supporting XPath 1.0, which makes for some fun sorting out how to do case-insensitive search. If you're interested, check out the JavaScript code in the Searcher class in markup.js. In my app, I put together a SearchBar to invoke the new search/select in MarkupWKWebView. But, I also found myself wanting to easily interate-thru search/select from the keyboard, to find multiple occurrences of a string in the document. It seemed like I should be able to do that from the SearchBar, but the focus/blur dance between the web view and the external search bar makes that really ugly. In the end, I have the MarkupWKWebView in a kind of search mode until the user cancels the search. This way when the user hits Enter and a search is active, the next occurrence of the search string is selected. The two new APIs in MarkupWKWebView are search(for:direction:handler:) and cancelSearch(handler:).

I have thought about including the SearchBar I am using in my other app in the MarkupEditor itself, and perhaps exposing it via the MarkupEditorView and MarkupEditorUIView, but I don't think it's very useful. My suspicion is that most people will, like me, find that search is too app-context-sensitive to be able to use it directly. If you have other thoughts, let me know.

[BTW, as I write this, I don't seem to be able to keep main clean because of intermittent test failures that have started to occur only within GitHub actions since I moved to the Xcode 14 toolchain. Fun!]

[stevengharris]

The Beta2 includes search functionality, a SwiftUI-based SearchableContentView and SearchBar, along with a new "Search" section of the README.