Jest: Incorrect testRegex link in document

[tiendq]

🐛 Bug Report

testRegex link doesn't work in Configuring Jest document.

To Reproduce

Click testRegex option, both in main content and in sidebar.

Expected behavior

Jump to testRegex section.

[thymikee]

The hash should be #testregex-string-array-string. Sounds like an opportunity to contribute something to the docs :)

[tiendq]

The hash should be #testregex-string-array-string. Sounds like an opportunity to contribute something to the docs :)

Yeah, it was easy to figure it out, will fix it this evening if no one want to take this tiny opportunity :D

[tiendq]

@thymikee BTW (I know it's out of scope), are testRegex and testMatch identical options? is there any reason to keep both? A teammate reviewed my code a couple of hours ago and he thought using testMatch is simpler than testRegex though I didn't see his point.

[thymikee]

We plan to unify it: https://github.com/facebook/jest/issues/7185

[tiendq]

It turns out a bigger issue: all options with type[array] are broken because underlying markdown code [array<string>] isn't generated properly.

[MrMavin]

It's something bigger than expected!

The table of contents section is generated by docusaurus by <AUTOGENERATED_TABLE_OF_CONTENTS> snippet. Here you'll find the documentation about this feature.

For some reasons, the generator is having troubles while parsing the titles.

Let me explain:

The heading ### `testRegex` [string | array<string>] is converted as

Text: testRegex [string | array]
Url: #testregex-string-array

But it should be

Text: testRegex [string | array<string>]
Url: #testregex-string-array-string

This means that we're having problems on <string> word. As you might imagine, the special characters < and > are the root issue.

I've tried to escape them, getting the following result:

Heading: ### `testRegex` [string | array\<string\>]
Text: testRegex [string | array<string>]
Url: #testregex-string-array

As you can see, the text is correct but the url is still wrong.

Of course, all the other links that are following the same logic aren't working as expected.

Any ideas?

[tiendq]

@MrMavin You're right, I just looked into the code and figured it out too :)

[tiendq]

@MrMavin One more casearray<string> is generated text [array] but array<string, string> is [array<string, string>]. Both cases are still incorrect links.

[MrMavin]

Found out the problem.

By taking a look at the code responsible to generate the table of contents, which is this one, they're doing a striptags operation on the string before generating the url. This means that <string> is considered as an html tag, so it's removed from the output.

Please have a look at line 39.

For me, there are two solutions to this issue.

The first one is about sending a PR to the Docusaurus repository. I'm thinking about it because I don't know if it's a good idea. Mainly because they're working on version 2, which doesn't seem to implement such feature the same way, and because it's something that if changed it could break things in other projects.

The second one is about refactoring < and > by using HTML entities. <string> becomes <string>. Of course I've tested it and it's working as expected!

What do you think?

[tiendq]

@MrMavin Since Docusaurus only mentions about code block it's not likely they will fix this issue. I think HTML entities is way to go.

[mayankmandloi]

@MrMavin please correct me if I am wrong but don't we need to use <string> like text inside back-ticks `<string>` , here < and > will not be converted into < and > it will look like

check the code here

[endiliey]

its a bug that we've fixed

should close this