diff --git a/spec/rails_app/app/controllers/posts_controller.rb b/spec/rails_app/app/controllers/posts_controller.rb index 16b2755..b3e5d81 100644 --- a/spec/rails_app/app/controllers/posts_controller.rb +++ b/spec/rails_app/app/controllers/posts_controller.rb @@ -7,6 +7,10 @@ def index @posts = Post.all end + def show + @post = Post.find(params[:id]) + end + def new @post = Post.new end diff --git a/spec/rails_app/app/views/posts/new.html.slim b/spec/rails_app/app/views/posts/new.html.slim index 9e31277..e4766c5 100644 --- a/spec/rails_app/app/views/posts/new.html.slim +++ b/spec/rails_app/app/views/posts/new.html.slim @@ -6,3 +6,5 @@ h1 Compose Post = f.input :image, as: :image, placeholder: "Image of the post" = f.submit "Save" = link_to "Cancel", close_modal_path + += link_to "Something completely different", other_posts_path diff --git a/spec/rails_app/app/views/posts/other.html.slim b/spec/rails_app/app/views/posts/other.html.slim new file mode 100644 index 0000000..899a2db --- /dev/null +++ b/spec/rails_app/app/views/posts/other.html.slim @@ -0,0 +1 @@ +h1 Something completely different! diff --git a/spec/rails_app/config/routes.rb b/spec/rails_app/config/routes.rb index d585e0d..d2afbea 100644 --- a/spec/rails_app/config/routes.rb +++ b/spec/rails_app/config/routes.rb @@ -6,6 +6,8 @@ collection do get :modal end + + get :other, on: :collection end get "styleguide", to: "pages#styleguide" diff --git a/src/modal.ts b/src/modal.ts index cb66641..647e75d 100644 --- a/src/modal.ts +++ b/src/modal.ts @@ -12,6 +12,7 @@ export class ModalPresenter { constructor() { document.addEventListener("turbo:load", this.prepareBlind); + document.addEventListener("turbo:before-cache", this.leave.bind(this)); } async open(options: ModalOptions): Promise { @@ -38,8 +39,16 @@ export class ModalPresenter { document.body.classList.toggle("modal-open", open); } + private leave(): void { + Object.values(this.modals).map((e) => e.destroy()); + this.modals = {}; + this.updateBlindStatus(); + } + private prepareBlind: () => void = () => { - createElement(document.body, "modal-blind"); + if (!document.querySelector("body > .modal-blind")) { + createElement(document.body, "modal-blind"); + } }; } @@ -82,7 +91,11 @@ export class Modal { } root.classList.remove("modal--open"); await wait(1); - root.remove(); + this.destroy(); + } + + destroy(): void { + this.root?.remove(); this.root = undefined; } }