IE以外で動かない仕掛けがある。

IE11のデバッガーで確認してリリースしたら「Chromeで動かないよ!」・・・ここから迷走が始まる。泥沼記録

Chromeのconsoleにこんなのが出た

event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

jQueryを自前でbuildした話。でフンフンと読んだ結果、Railsに組み込んでいるjqueryのバージョンがアレなのか?

コンソールで確認

$ gem list jquery-rails
*** LOCAL GEMS ***
jquery-rails (2.1.4, 2.1.3, 2.1.1)

app/Gemfile

gem 'jquery-rails', '= 2.1.4'

オオモト?を確認
http://rubygems.org/gems/jquery-rails/versions/2.1.4
http://rubydoc.info/gems/jquery-rails/2.1.4/frames

jQuery 1.8.3
jQuery UI 1.8.23 (javascript only)
the jQuery UJS adapter
assert_select_jquery to test jQuery responses in Ruby tests

localhost:3000で動いているアプリをIEのデバッガーで確認してみる。

/*!
 * jQuery JavaScript Library v1.8.3

 * Date: Tue Nov 13 2012 08:20:33 GMT-0500 (Eastern Standard Time)
 */

以上のことから、jquery-railsのバージョン番号はjQueryのバージョンとはマッチしない。

アップデートしてみる

$ gem update jquery-rails
(アップデート内容が長いので省略)
$ gem list jquery-rails
*** LOCAL GEMS ***
jquery-rails (3.1.0, 2.1.4, 2.1.3, 2.1.1)

app/Gemfile

#gem 'jquery-rails', '= 2.1.4'
gem 'jquery-rails', '= 3.1.0'

$rails s thin

怒られた。

An ActionView::Template::Error occurred in iftbs#new:

  couldn't find file 'jquery-ui'
  (in C:/Users/kenmituo/My Documents/Aptana Studio 3 Workspace/hoge/app/assets/javascripts/application.js:9)
  sprockets (2.0.4) lib/sprockets/context.rb:100:in `resolve'


http://rubydoc.info/gems/jquery-rails/3.1.0/frames

jQuery 1.10.2
the jQuery UJS adapter
assert_select_jquery to test jQuery responses in Ruby tests

2.1.4にはあったjquery-uiが3.1.0には含まれていない。ちっくしょー(小梅太夫

http://qiita.com/hachi8833/items/42d50928008d1b3f6400を見るける。
それっぽいものが有るらしいので探してみる

$ gem search -b jquery-ui
*** LOCAL GEMS ***
*** REMOTE GEMS ***
compass-jquery-ui (0.1.0)
jquery-ui-bootstrap-rails (0.0.2)
jquery-ui-bootstrap-rails-asset (0.0.3)
jquery-ui-form (0.2.8)
jquery-ui-middleman (4.1.0)
jquery-ui-rails (4.2.0)
jquery-ui-rails-cdn (0.1.2)
jquery-ui-rails-engine (1.10.3.0)
jquery-ui-rails-google-cdn (0.0.1)
jquery-ui-redmond (0.0.1)
jquery-ui-sass-rails (4.0.3.0)
jquery-ui-themes (0.0.11)

これだ!
http://rubydoc.info/gems/jquery-ui-rails/4.2.0/frames
インストール!!

$ gem install jquery-ui-rails
Fetching: railties-4.0.3.gem (100%)
Fetching: jquery-ui-rails-4.2.0.gem (100%)
Successfully installed railties-4.0.3
Successfully installed jquery-ui-rails-4.2.0
2 gems installed
Installing ri documentation for railties-4.0.3...
Installing ri documentation for jquery-ui-rails-4.2.0...
Installing RDoc documentation for railties-4.0.3...
Installing RDoc documentation for jquery-ui-rails-4.2.0...

app/Gemfile
今回の修正をすべて書くとこうなる

#gem 'jquery-rails', '= 2.1.4'
gem 'jquery-rails', '= 3.1.0'
gem 'jquery-ui-rails'

bundleでアップデート

$ bundle update
Fetching gem metadata from http://rubygems.org/.........
Fetching gem metadata from http://rubygems.org/..
Installing rake (10.1.1)
Using multi_json (1.2.0)
Using activesupport (3.1.8)
Using builder (3.0.4)
Using i18n (0.6.9)
Using activemodel (3.1.8)
Using erubis (2.7.0)
Installing rack (1.3.10)
Using rack-cache (1.2)
Using rack-mount (0.8.3)
Using rack-test (0.6.2)
Installing hike (1.2.3)
Installing tilt (1.3.7)
Using sprockets (2.0.4)
Using actionpack (3.1.8)
Installing mime-types (1.25.1)
Installing polyglot (0.3.4)
Installing treetop (1.4.15)
Using mail (2.3.3)
Using actionmailer (3.1.8)
Using arel (2.2.3)
Using tzinfo (0.3.38)
Using activerecord (3.1.8)
Using activeresource (3.1.8)
Using bundler (1.1.5)
Installing coffee-script-source (1.7.0)
Installing execjs (2.0.2)
Using coffee-script (2.2.0)
Installing rack-ssl (1.3.3)
Using json (1.7.4)
Installing rdoc (3.12.2)
Using thor (0.14.6)
Using railties (3.1.8)
Using coffee-rails (3.1.1)
Using daemons (1.1.9)
Installing eventmachine (1.0.3)
Installing exception_notification (4.0.1)
Using jquery-rails (3.1.0)
Installing jquery-ui-rails (4.1.2)
Installing mail-iso-2022-jp (2.0.2)
Installing mysql2 (0.3.15) with native extensions
Gem::Installer::ExtensionBuildError: ERROR: Failed to build gem native extension
.

        c:/Ruby193/bin/ruby.exe extconf.rb
checking for ruby/thread.h... no
checking for rb_thread_blocking_region()... yes
checking for rb_wait_for_single_fd()... yes
checking for rb_hash_dup()... yes
checking for rb_intern3()... yes
checking for mysql_query() in -lmysqlclient... no
checking for main() in -lm... yes
checking for mysql_query() in -lmysqlclient... no
checking for main() in -lz... no
checking for mysql_query() in -lmysqlclient... no
checking for main() in -lsocket... no
checking for mysql_query() in -lmysqlclient... no
checking for main() in -lnsl... no
checking for mysql_query() in -lmysqlclient... no
checking for main() in -lmygcc... no
checking for mysql_query() in -lmysqlclient... no
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of
necessary libraries and/or headers.  Check the mkmf.log file for more
details.  You may need configuration options.

Provided configuration options:
        --with-opt-dir
        --without-opt-dir
        --with-opt-include
        --without-opt-include=${opt-dir}/include
        --with-opt-lib
        --without-opt-lib=${opt-dir}/lib
        --with-make-prog
        --without-make-prog
        --srcdir=.
        --curdir
        --ruby=c:/Ruby193/bin/ruby
        --with-mysql-dir
        --without-mysql-dir
        --with-mysql-include
        --without-mysql-include=${mysql-dir}/include
        --with-mysql-lib
        --without-mysql-lib=${mysql-dir}/lib
        --with-mysql-config
        --without-mysql-config
        --with-mysql-dir
        --without-mysql-dir
        --with-mysql-include
        --without-mysql-include=${mysql-dir}/include
        --with-mysql-lib
        --without-mysql-lib=${mysql-dir}/lib
        --with-mysqlclientlib
        --without-mysqlclientlib
        --with-mlib
        --without-mlib
        --with-mysqlclientlib
        --without-mysqlclientlib
        --with-zlib
        --without-zlib
        --with-mysqlclientlib
        --without-mysqlclientlib
        --with-socketlib
        --without-socketlib
        --with-mysqlclientlib
        --without-mysqlclientlib
        --with-nsllib
        --without-nsllib
        --with-mysqlclientlib
        --without-mysqlclientlib
        --with-mygcclib
        --without-mygcclib
        --with-mysqlclientlib
        --without-mysqlclientlib


Gem files will remain installed in c:/Ruby193/lib/ruby/gems/1.9.1/gems/mysql2-0.
3.15 for inspection.
Results logged to c:/Ruby193/lib/ruby/gems/1.9.1/gems/mysql2-0.3.15/ext/mysql2/g
em_make.out
An error occured while installing mysql2 (0.3.15), and Bundler cannot continue.
Make sure that `gem install mysql2 -v '0.3.15'` succeeds before bundling.

bundleでインストール

$ bundle install
Using rake (10.0.3)
Using multi_json (1.2.0)
Using activesupport (3.1.8)
Using builder (3.0.4)
Using i18n (0.6.1)
Using activemodel (3.1.8)
Using erubis (2.7.0)
Using rack (1.3.8)
Using rack-cache (1.2)
Using rack-mount (0.8.3)
Using rack-test (0.6.2)
Using hike (1.2.1)
Using tilt (1.3.3)
Using sprockets (2.0.4)
Using actionpack (3.1.8)
Using mime-types (1.19)
Using polyglot (0.3.3)
Using treetop (1.4.12)
Using mail (2.3.3)
Using actionmailer (3.1.8)
Using arel (2.2.3)
Using tzinfo (0.3.35)
Using activerecord (3.1.8)
Using activeresource (3.1.8)
Using bundler (1.1.5)
Using coffee-script-source (1.3.3)
Using execjs (1.4.0)
Using coffee-script (2.2.0)
Using rack-ssl (1.3.2)
Using json (1.7.4)
Using rdoc (3.12)
Using thor (0.14.6)
Using railties (3.1.8)
Using coffee-rails (3.1.1)
Using daemons (1.1.9)
Using eventmachine (1.0.0)
Using exception_notification (3.0.1)
Using jquery-rails (3.1.0)
Using jquery-ui-rails (4.1.2)
Using mail-iso-2022-jp (1.2.0)
Using mysql2 (0.3.11)
Using rails (3.1.8)
Using rails-clean-logs (1.0)
Using rails3-jquery-autocomplete (1.0.9)
Using sass (3.2.1)
Using sass-rails (3.1.6)
Using thin (1.5.0)
Using uglifier (1.3.0)
Using will_paginate (3.0.3)
Your bundle is complete! Use `bundle show [gemname]` to see where a bundled gem
is installed.

そしてエラーが出るけど気にしないで実行してみる。

$ bundle exec rake
Errors running test:units!
$ rails s thin

同じjquery-uiのエラーが出る。


RailsにjQuery-uiを導入するときの注意を参考にしてみる。

$ rails generate jquery:install --ui
  deprecated  You are using Rails 3.1 with the asset pipeline enabled, so this g
enerator is not needed.
              The necessary files are already in your asset pipeline.
              Just add `//= require jquery` and `//= require jquery_ujs` to your
 app/assets/javascripts/application.js
              If you upgraded your app from Rails 3.0 and still have jquery.js,
rails.js, or jquery_ujs.js in your javascripts, be sure to remove them.
              If you do not want the asset pipeline enabled, you may turn it off
 in application.rb and re-run this generator.

ん?確認してみる。
app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui

すでに書いてあるぞーー!

・・・行き詰まった。とりあえず戻して、ちょっとほっとく。