port of rails_ujs link_to confirm/delete to stimulus (#2)

* includes rails_ujs delete and confirm/delete (scoped to link_to): https://github.com/rails/rails/blob/11341fdb3a1664ba58edf729ed46e04cd0e20ed6/actionview/app/assets/javascripts/rails-ujs/features/method.coffee
* includes functionality of rails_ujs confirm (scoped to link_to): https://github.com/rails/rails/blob/11341fdb3a1664ba58edf729ed46e04cd0e20ed6/actionview/app/assets/javascripts/rails-ujs/features/confirm.coffee
* includes port of rails_ujs Rails.isCrossDomain helper (scoped to link_to): https://github.com/rails/rails/blob/291a3d2ef29a3842d1156ada7526f4ee60dd2b59/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee#L83

README.md

@@ -1,2 +1,8 @@
 # rails6-mongoid-stimulus
 Example Rails 6 app with Mongoid and Stimulus.
+
+# example of link_to method delete (optional confirm) via stimulus instead of rails_ujs
+
+* https://discuss.hotwire.dev/t/button-to-not-showing-the-data-confirm/2046
+* https://github.com/hotwired/stimulus-rails/pull/29
+* https://github.com/rails/rails/blob/main/actionview/app/assets/javascripts/rails-ujs/features/confirm.coffee

app/controllers/home_controller.rb

@@ -1,4 +1,8 @@
 class HomeController < ApplicationController
-  def index
+  def index; end
+
+  # example of link_to method delete (optional confirm) via stimulus instead of rails_ujs
+  def delete
+    render plain: "deleted"
   end
 end

app/javascript/controllers/link-to_controller.js

@@ -0,0 +1,88 @@
+//
+// example of link_to method delete (optional confirm) via stimulus instead of rails_ujs
+//
+// # # app/views/home/index.html.haml
+// #
+// # = link_to "delete", "/delete", method: :delete, data: {controller: 'link-to', action: 'click->link-to#method'}
+// # %br
+// # = link_to "delete", "/delete", method: :delete, data: {controller: 'link-to', action: 'click->link-to#method', confirm: 'Are you sure?'}
+//
+// basically a port of method.coffee to stimulusjs
+// https://github.com/rails/rails/blob/main/actionview/app/assets/javascripts/rails-ujs/features/method.coffee
+//
+// not sure where to put this helper:
+//  // https://github.com/rails/rails/blob/291a3d2ef29a3842d1156ada7526f4ee60dd2b59/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee#L83
+//  isCrossDomain(url) {
+//    let e, originAnchor, urlAnchor
+//    originAnchor = document.createElement('a')
+//    originAnchor.href = location.href
+//    urlAnchor = document.createElement('a')
+//
+//    try {
+//      urlAnchor.href = url
+//      return !(((!urlAnchor.protocol || urlAnchor.protocol === ':') && !urlAnchor.host) || (originAnchor.protocol + '//' + originAnchor.host === urlAnchor.protocol + '//' + urlAnchor.host))
+//    } catch (_error) {
+//      e = _error
+//      return true
+//    }
+//  }
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+
+  method(event) {
+    event.preventDefault()
+    event.stopImmediatePropagation()
+
+    let link = this.element
+    let method = link.getAttribute('data-method')
+    if (!method) {return}
+
+    let confirmText = link.getAttribute('data-confirm')
+    if (!!confirmText) {
+      if (!(window.confirm(confirmText))) {return}
+    }
+
+    let href = link.href
+    let el
+    let csrfToken = (el = document.querySelector('[name="csrf-token"]')) ? el.getAttribute('content') : null
+    el = null
+    let csrfParam = (el = document.querySelector('[name="csrf-param"]')) ? el.getAttribute('content') : null
+    let form = document.createElement('form')
+    let formContent = "<input name='_method' value='" + method + "' type='hidden' />"
+
+    // Rails.isCrossDomain(href)
+    // https://github.com/rails/rails/blob/291a3d2ef29a3842d1156ada7526f4ee60dd2b59/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee#L83
+    let e, isCrossDomain
+    let originAnchor = document.createElement('a')
+    originAnchor.href = location.href
+    let urlAnchor = document.createElement('a')
+    try {
+      urlAnchor.href = href
+      isCrossDomain = !(((!urlAnchor.protocol || urlAnchor.protocol === ':') && !urlAnchor.host) || (originAnchor.protocol + '//' + originAnchor.host === urlAnchor.protocol + '//' + urlAnchor.host))
+    } catch (_error) {
+      e = _error
+      isCrossDomain = true
+    }
+
+    //if csrfParam? and csrfToken? and not Rails.isCrossDomain(href)
+    if (!!csrfParam && !!csrfToken && !isCrossDomain) {
+      formContent += "<input name='" + csrfParam + "' value='" + csrfToken + "' type='hidden' />"
+    }
+
+    // Must trigger submit by click on a button, else "submit" event handler won't work!
+    // https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit
+    formContent += '<input type="submit" />'
+
+    form.method = 'post'
+    form.action = href
+    form.target = link.target
+    form.innerHTML = formContent
+    form.style.display = 'none'
+
+    document.body.appendChild(form)
+    form.querySelector('[type="submit"]').click()
+  }
+
+}

app/views/home/index.html.haml

@@ -1,2 +1,6 @@
 %div{data: {controller: 'hello'}}
   %h1{data: {hello_target: "output"}}
+
+= link_to "delete", "/delete", method: :delete, data: {controller: 'link-to', action: 'click->link-to#method'}
+%br
+= link_to "delete", "/delete", method: :delete, data: {controller: 'link-to', action: 'click->link-to#method', confirm: 'Are you sure?'}

config/routes.rb

@@ -1,5 +1,8 @@
 Rails.application.routes.draw do
   # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
 
+  # example of link_to method delete (optional confirm) via stimulus instead of rails_ujs
+  delete "delete" => "home#delete"
+
   root to: 'home#index'
 end