Can I pass a rootNode to nanohref?

[m90]

I am trying to mount a choo application in an "application shell" that is provided by a static site generator.

I would expect the routing behavior to be limited to the scope of choo's application host, yet nanohref will try to handle all anchors being clicked.

Looking at the nanohref docs, this behavior seems to be supported by passing a second rootNode argument to the nanohref function: https://github.com/choojs/nanohref#nanohrefhandlerlocation-rootnode

Looking at how choo itself is using nanohref it looks like passing a second argument is not intended: https://github.com/choojs/nanohref#nanohrefhandlerlocation-rootnode

This leads me to two questions:

1. Is it possible to achieve this behavior in some other way?
2. In case no, would you accept a PR that enables passing the application root to nanohref as well? In this case I have to admit I am slightly unsure how the API for this could even look like considering how there is basically zero surface area for options in choo.

[m90]

Hmm, maybe I am missing something here as I tried the following:

I hacked into the choo version in my node_modules adding the root node argument to the nanohref call manually, yet choo somehow still tried to handle clicks outside of the host element.

[goto-bus-stop]

choo hasn't really supported being used in like a "sub application" style but it could be really good for that, so I think any feature that will help it excel in that use case would be really welcome :)

The behaviour in your second post kinda looks like a bug in nanohref to me, this is the code that uses the rootNode value:

https://github.com/choojs/nanohref/blob/80c11c4fdb1c731aad1b94f4c93b0c386b97c69c/index.js#L21-L27

So when you click something, it walks up the tree until it finds either an <a href> or arrives at the rootNode. but if you click a link outside the rootNode, it will still happily find the <a href>.

[m90]

Assuming the bug in nanohref is fixed, it should not be too hard to get this into choo itself, but I am really unsure where the option belongs.

A few things that could be done that I'm not a real fan of any yet:

• Add a new key to the options passed to choo([opts]). I can't even come up with a name for this.
• Allow a DOM Element to be passed instead of true|false to opts.href which scopes nanohref down to children of that element.
• Add a second optional argument to app.mount that scopes the router to the given selector. I'm not sure if this actually works because of app.start.

I think option 2 would probably be the least invasive, but it's also not really what I'd call an intuitive API. Ugh.

[m90]

Is there any input on this one as well as choojs/nanohref#13 - I'd still love to implement this in one way or the other as it's a hard requirement of what I'm working on right now.

[blahah]

You can compose the dependencies quite simply to achieve this. See for example: https://github.com/graforlock/choo-detached