waline notification view page doesn't work for docsify

[eteeqii]

Bug Report

waline notification view page doesn't work for docsify

Steps to reproduce

1. install latest docsify and integrated with commenting system waline
2. create a comment for a specific docsify page
3. the waline admin would receive the notification mail regarding to the new comment
4. click the view page in the mail to open the specific page(the url contains the anchor for the comment)

What is current behaviour

click the view page would open below url would see 404 error, nothing would show in the browser.
https://docs.xxx.com/#/%232

since %23 is the URL encoded representation of #
manually try again with url https://docs.xxx.com/#/#2 in the browser
it would show the specific page, but it didn't anchor to the comment with id=2

What is the expected behaviour

click the view page and show the page and anchor to the specific comment

1. maybe need think about rewrite of %23
2. let waline div anchor works.

Other relevant information

• Bug does still occur when all/other plugins are disabled?

• Your OS: MAC OS 13.3.1 (22E261)

• Node.js version: FROM node:lts-alpine3.17

• npm/yarn version:

• Browser version: Chrome is up to date Version 112.0.5615.49 (Official Build) (arm64)

• Docsify version: RUN npm install -g docsify-cli@latest

• Docsify plugins: waline, https://github.com/nopdan/docsify-waline

Please create a reproducible sandbox

Mention the docsify version in which this bug was not present (if any)

[Koooooo-7]

Hi @eteeqii , It seems the docsify-waline plugin feature/enhancement item since docsify does not handle this plugin by itself.

[eteeqii]

Hi @eteeqii , It seems the docsify-waline plugin feature/enhancement item since docsify does not handle this plugin by itself.

after more experiment regarding to the problem.
looks it is due to the anchor id is a pure number.
for other normal anchor in the page, such as below
https://docs.xxx.com/#/?id=getting-help
It works well.

as for the pure number id, it would trigger below error
https://docs.xxx.com/#/?id=22
caught DOMException: Failed to execute 'querySelector' on 'Document': '#22' is not a valid selector.
and meanwhile all the waline comments would not show on the page, looks it didn't load hook.doneEach due to route failure.

wandring if above are expected behaviors for the docsify, thanks!

[nopdan]

It looks like hook.doneEach was not loaded because of a routing failure.

[eteeqii]

more experiment as below

1. For the makrdown native syntax below are both working fine.

   ##25                      // click this headline will redirect to the URL https://docs.xxx.com/#/?id=_25
   [25](#_25)                // this link also works well
   

2. For the html code in the docsify markdown file
   A: use pure number id

    <div id=26>
        <p>this is a test</p>
   </div>
   // either https://docs.xxx.com/#/?id=26   or .........id=_26 will not work.
   

   B: use number begin with _

   <div id=_26>
        <p>this is a test text</p>
   </div>
   // URL https://docs.xxx.com/#/?id=_26 will works fine.
   

summary, looks we should use _<number> instead of <number> for the comments.
since the docsify will rendering the respose json from waline server.
try to put the _<number> instead of <number> for the comment html code div id maybe could help to resolve the problem

note: response.json is attached, there is objectId in it , the value could be 1 ,2
@Koooooo-7 maybe docsify could try to use _<objectId> for the div ID.

response.json.TXT

[Koooooo-7]

Hi @eteeqii , thx for the details ! About the id with pure number it should work in HTML5 but it seems broken now.
Gonna have a patch on it.