Feature request: Option to auto-navigate to changed file

[akaleeroy]

I'm working on a series of JS charts - each one is a separate html file. It's handy to have a config option in the livereload server that auto-navigates to the file that actually changed. Effectively keeping your code editor tab in sync with the browser livereload tab:

1. Start gulp-server-livereload, default browser opens a tab with the first file, http://localhost:8000/01.html
2. Make an edit in 01.html, save it. Browser tab reloads current page.
3. Remember to make an edit in 03.html, save it. Browser takes you from http://localhost:8000/01.html to http://localhost:8000/03.html.

I started doing this by overriding the event handler from my app/main.js, based on the example in the docs.

// Navigate to changed file
window.onload = () => {
  if (typeof window._onLiveReloadFileChanged !== 'undefined') {
    // Store the original function that will be overwritten
    const proxied = window._onLiveReloadFileChanged;

    window._onLiveReloadFileChanged = ...args => {
      let file = args[0];
      file.baseName = file.name.replace(file.ext, '');
      if (file.ext === '.html') {
        // A chart changed, navigate browser to it
        window.location.pathname = `/${file.baseName}.html`;
      } else {
        // Some other change. Carry on with original behavior (liveCSS etc.)
        return proxied.apply(this, args);
      }
    };
  }
};

If there's interest in this, the option could be something like navigateChanged with true / false / glob pattern as possible values.

Thanks!

[hiddentao]

I think the event handler mechanism is the best approach for now.