preactjs / preact-router

:earth_americas: URL router for Preact.
http://npm.im/preact-router
MIT License
1.01k stars 156 forks source link

hashchange doesn't fire for relative links #327

Open vpzomtrrfrt opened 5 years ago

vpzomtrrfrt commented 5 years ago

Linking with just a fragment will trigger a hashchange event, but it doesn't appear to work if the href also includes the path.

Sample code showing the problem:

import { h, Component } from "preact";

export default class HashTest extends Component {
    updateHash = () => {
        this.setState({hash: location.hash});
    };

    componentDidMount() {
        window.addEventListener("hashchange", this.updateHash);
        this.updateHash();
    }

    componentWillUnmount() {
        window.removeEventListener("hashchange", this.updateHash);
    }

    render({}, {hash}) {
        return <div>
            <h1>Hash Link Test</h1>
            <p><a href="#bare">Fragment link</a></p>
            <p><a href="/hashtest#relative">Relative link</a></p>
            <p>The hash is: {hash}</p>
        </div>;
    }
}
developit commented 4 years ago

@vpzomtrrfrt is this mounted within a <Router>? If so <a href="/hashtest#relative"> will perform a Router update in addition to the hashchange. If not, it will perform a full page load. I'm not sure which is being used here.

vpzomtrrfrt commented 4 years ago

Here's the full test project: https://github.com/vpzomtrrfrt/hashchangetest

On the /hashtest page, the "Relative link" link doesn't trigger the hashchange event

vpzomtrrfrt commented 4 years ago

Rewrote test case for current version, issue is still present.

Looks like the working links aren't even being intercepted by preact-router, as it doesn't seem to support links other than root-relative.

marvinhagemeister commented 4 years ago

yup, that's correct. preact-router only supports root-relative urls.