Tabbed navigation with turbo

turbo_frame_history_controller.js

import { navigator } from "@hotwired/turbo";
import { Controller } from "stimulus";
import { useMutation } from "stimulus-use";

export default class extends Controller {
  connect() {
    useMutation(this, { attributes: true, childList: true, subtree: true });
  }

  mutate(entries) {
    for (const mutation of entries) {
      if (mutation.type === "childList") {
        // re-initialize third party, e.g. jquery, plugins
      }

      if (mutation.type === "attributes" && mutation.attributeName === "src") {
        const src = this.element.getAttribute("src");
        if (src != null) {
          navigator.history.push(new URL(src));
        }
      }
    }
  }
}

adapted from https://gist.github.com/Intrepidd/ac68cb7dfd17d422374807efb6bf2f42