cms.js
cms.js copied to clipboard
links replacing # with h1 due to markdown
I was looking for a solution to add blog posts to my GitHub site and here we are.
When testing out my own code and the hosted demo code I noticed that URLs with a #
(so, all hosted pages) are replaced by <h1>
in the rendered URL.
Example: Go to the demo post http://chris-diana.com/cms.js/demo/#/posts/2017-08-20-another-example-post
The link in the body text goes to:
http://chris-diana.com/cms.js/demo/<h1>
I'm guessing that the markdown https://github.com/chrisdiana/cms.js/blob/develop/src/markdown.js is picking up the #
as a heading.
// headers - fix link anchor tag regex
{regex: /(#+)(.*)/g, replacement: (text, chars, content) => {
var level = chars.length;
return '<h' + level + '>' + content.trim() + '</h' + level + '>';
}},
I just noticed the comment in the code
// headers - fix link anchor tag regex
I guess this is a known issue
EDIT: SCRATCH THAT I THINK I MISUNDERSTOOD HOW THE CODE WORKS WHEN GENERATING HEADERS
I'm no expert on regex, but I tested this out and it works.
// headers - fix link anchor tag regex
{regex: /(#+)([^\/])(.*)/g, replacement: (text, chars, content) => {
var level = chars.length;
return '<h' + level + '>' + content.trim() + '</h' + level + '>';
}},
It tests that there's no /
following the first #
Here's a test case regexr.com/49sbu
Hi roskelld,
I'm no expert on regex, but I tested this out and it works.
// headers - fix link anchor tag regex {regex: /(#+)([^\/])(.*)/g, replacement: (text, chars, content) => { var level = chars.length; return '<h' + level + '>' + content.trim() + '</h' + level + '>'; }},
It tests that there's no
/
following the first#
This code works in filtering # in url links, however it also breaks the detection of regular headings on page markdown articles.
Here's an alternative regex, that works in both cases:
regex: /(#+)(?!\/)(.*)/g
This one assumes that a # preceding a url is directly followed by a / which makes sense in the cms.js environment (e.g. /#/pages/somearticle)
Great, it works just find... You may can propose it as pull request ?