Skip to content

tocbot breaks when there is an apostrophe ’ in the headings #377

@ramrami

Description

@ramrami

I have the following heading in my content:
What you’ll learn

My CMS output:

<h2 id="what-you%E2%80%99ll-learn" tabindex="-1">What you’ll learn</h2>

Clicking on the corresponding toc link throws an error and tocbot stops working correctly.
The error:
Uncaught SyntaxError: Failed to execute 'querySelector' on 'Element': '#what-you%E2%80%99ll-learn' is not a valid selector

It looks like querySelector doesn't handle these special characters very well, but it seems that getElementById doesn't have the same problem.

I'm using v4.35.0.
Tested on Brave, Safari, and Firefox.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions