おはようございます、辻(@dim0627)です。
夏休みはニーアオートマタをやってました。めちゃくちゃ良かったです。 やる前、「なんでこいつら目隠ししてんの?かっこつけてんの?」とか思っててすみません。HUDだったんですね。
今日はRails5のことを書きます。
社内で勉強会をやった
弊社はエンジニアが3人在籍しているのですが、それでも定期的に勉強会を開催したりしてます。
こないだの開催はちょっと間が空いてしまったのですが、こんな感じのものを話してくれました。
僕は聞いてただけです。写真とか取ってWantedlyに載せればよかった!Wantedly映え!
Hello rails-ujs.
Railsのリリースを追ってない人でも耳にするのがjQuery依存の除去ですね。
Drop jQuery as a dependency · Issue #25208 · rails/rails · GitHub
Railsで控えめ(Unobtrusive)なJavaScriptとして実装されているビルトイン系JavaScriptコードがjQueryを必要としてるので、それをやめて素のJavaScriptコードにしようという話ですね。
そしてjquery-ujs
からrails-ujs
という名前に変わりました。
というわけで@mikedaがざっとプルリクを作って実際のコードで新機能を見せてくれました。
要件にもよりますが、コード見せた方が早いわってときはプルリクを作って方針を決めることもあります。
以下余談。
JSからsubmit()を呼ぶとremote: trueにならない(Ajaxにならない)
余談というかこれが本題・・・。これを書こうと思ったら導入文がめちゃくちゃ伸びてしまった。
@mikedaが作ってくれたプルリクは完成品というわけじゃなく、動かない部分もありました。 というわけで定時前でちょっと時間を持て余した僕(暇だったわけじゃない!)が勝手に調査を始めたら結構ハマったのでそれをメモっときます。
例えばこんなコードがあるでしょ。form
の要素を変更したら勝手にsubmit
してくれる感じのやつ。(サンプルだから動くかわからんよ)
<form action="/awesome/path" data-remote="true" method="post"> <select class="js-submitter"> <option value="123">brabrabra</option> <option value="456">brabrabra</option> </select> </form>
$(".js-submitter").on("change", function() { $(this).closest("form").submit(); });
このコードはこれまで動いてたんですが、rails-ujs
にしたら動かなくなったっぽいんですね。submit
はされるけど、remote: true
として扱われていない。
リクエストを見てみるとたしかにxhr
になってない。
remote: true
なフォームはCSRF用のトークンがform
内に生成されない(<head>
から取られる)ので、普通にsubmit
されるとInvalidAuthenticityToken
が発生しちゃうんですね。
最初はTurbolinksのせいかな?とか色々考えてみたけどどうやらsubmit
の呼び方が悪かった模様。
Rails.fireとかいうかっこいい関数があるらしい
Rails.fire! Rails.fire!
とりあえず声に出して言いたくなるこの名前。センスいい。なんか調べたらjquery-rails時代からあったらしいですね。知らなかった。
JSからsubmit
したいしrails-ujs
の処理もやってほしい、って場合はこんな感じにすればいいらしい!
$(".js-submitter").on("change", function() { Rails.fire($(this).closest("form")[0], 'submit'); });
これドキュメントあります??GitHubのコード読んでたんだけど、調べても出てこなくて・・・。
参考資料
jquery - With Rails UJS, how to submit a remote form from a function - Stack Overflow
4人目のエンジニアを募集してます
株式会社リスタではたらいてみませんか。
現在弊社ではCoffeeScriptをやめようとかjQueryをやめようとか、Vue.jsやらReact.jsやら検討してみようとか、色んな話が出ているのでジョインするなら今ですよ!(ジョインってかっこいいね!)
また、Web以外にもAndroidやiOSアプリもあります。出したばっかりなのでまだまだ裁量もってやれる範囲が大きいですよ。
気になったら気軽にお話を聞きに来てね!