#community-help

Typesense Search Results Overflow Issue in Docusaurus Project

TLDR Marco reported search results overflowing for some text and suspected it's related to lists. Jason suggested checking for uncommon unicode line breaks and adjusting scraper config, but issue remains unresolved.

Powered by Struct AI
Apr 27, 2023 (7 months ago)
Marco
Photo of md5-4fdfd972be680409429627667fd6b8bf
Marco
02:48 PM
Hi everyone,

I am using typesense in a docusaurus project. I have integrated the docusaurus theme to add a search bar to the navigation and it works mostly well.

Only problem I have is that for some text, the search results overflow over the tile allocated to a search result. I wasn't able to identify why that might be.
Any idea where to start looking for the root cause and a potential solution?

This is an example of the problem:
Image 1 for Hi everyone,

I am using typesense in a docusaurus project. I have integrated the docusaurus theme to add a search bar to the navigation and it works mostly well.

Only problem I have is that for some text, the search results overflow over the tile allocated to a search result. I wasn't able to identify why that might be.
Any idea where to start looking for the root cause and a potential solution?

This is an example of the problem:
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:19 PM
Hmmm, that’s a new one! I wonder if your page has some uncommon unicode line break: https://stackoverflow.com/questions/53905112/does-there-exist-unicode-new-line-line-break-like-there-is-unicode-space
Apr 28, 2023 (7 months ago)
Marco
Photo of md5-4fdfd972be680409429627667fd6b8bf
Marco
09:00 AM
It appears to me that this occurs whenever we use lists to represent our data.

For the example above, the html of the search popup has this result:
Image 1 for It appears to me that this occurs whenever we use lists to represent our data.

For the example above, the html of the search popup has this result:
09:00
Marco
09:00 AM
And the actual documentation looks like this:
Image 1 for And the actual documentation looks like this:
09:02
Marco
09:02 AM
The html of the actual documentation does look a bit weird with all those additional <span>s in there. Could this be the problem?
Image 1 for The html of the actual documentation does look a bit weird with all those additional <span>s in there. Could this be the problem?
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:12 PM
Could you try adding li as a dom element to scrape independently in your docsearch scraper config?
Marco
Photo of md5-4fdfd972be680409429627667fd6b8bf
Marco
06:33 PM
Do you mean adding this as a selector?
Apr 29, 2023 (7 months ago)
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
03:16 AM
Correct
May 02, 2023 (7 months ago)
Marco
Photo of md5-4fdfd972be680409429627667fd6b8bf
Marco
10:48 AM
I believe it already is in there. The docsearch config follows the template suggested and contains:

"lvl1": "article h1, header h1",
"lvl2": "article h2",
"lvl3": "article h3",
"lvl4": "article h4",
"lvl5": "article h5, article td:first-child",
"lvl6": "article h6",
"text": "article p, article li, article td:last-child"
10:50
Marco
10:50 AM
The "text" selector has the path article li, which should match the list-element in question.
The full xPath of that list item is
/html/body/div/div[2]/div/div/main/div/div/div[1]/div/article/div[2]/div[1]/div/div/div/div/div/table/tbody/tr[1]/td/ul/li[2]

Typesense

Lightning-fast, open source search engine for everyone | Knowledge Base powered by Struct.AI

Indexed 3015 threads (79% resolved)

Join Our Community