Tracking the current URL in a template

I have a "copy link" input in my template that should display the currently loaded URL (with query params) to the user for them to copy & paste.

The input with the URL is part of the template belonging to a parent route that has a number of children:

- Parent route  <-- Copy URL link in this template
  - Child route
  - Child route
  - Child route

This means that as you navigate the child routes, the URL should update in the parent route. This is turning out to be very difficult to implement.

• AFAIK there is no native event for URL change so I can't create a component and simply track any browser event. I tried hashchange on the window but this obviously only tracks the #and not URL or query params.
• I can't use window.location.href when the page loads as any subsequent transitions to the child routes will not be reflected in the input.
• I can't get the URL with window.location.href in the didTransition action (or any other route hooks) on the parent route because at that point the URL hasn't updated yet (i.e. I get the previous URL)