scroll-behavior-polyfill
scroll-behavior-polyfill copied to clipboard
catchNavigation click causes error when using hash for routing
https://github.com/wessberg/scroll-behavior-polyfill/blob/0e4973c514f0fc713dbe6a617273c2ce1db29e42/src/patch/anchor/catch-navigation.ts#L33-L34
hash
from an anchor is passed directly to root.querySelector
with our regard for what might be contained in the hash.
Hash-routing libraries store the route in the hash. For example an anchor tag may have #!/foo/bar
as the value for the href.
Passing this value to root.querySelector
causes an error, for example SyntaxError: The string did not match the expected pattern.
in safari or Uncaught DOMException: Document.querySelector: '#!/foo' is not a valid selector
in FIrefox.
This could be solved in two ways:
- a simple try/catch
- further expand the regex to allow for detecting a valid query selector string before passing it to
querySelector
@wessberg if you have a preference between the two approaches (or have an alternative suggestion) I am happy to open a PR that fixes the bad assumption around what can live in a hash.