柴ブログ

プログラミング奮闘記

CircleCIでnode-sassのエラーが出た際の対応

CircleCI

はじめに

個人開発してるRailsのWebアプリのリポジトリで、CircleCIのyarn installで落ちるようになってしまいその時の対応メモ。

エラー

長いので下記に折りたたんでます。

ログ

yarn install v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > vue-loader@15.9.3" has unmet peer dependency "css-loader@*".
warning " > vue-loader@15.9.3" has unmet peer dependency "webpack@^3.0.0 || ^4.1.0 || ^5.0.0-0".
warning " > webpack-dev-server@3.11.0" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
[4/4] Building fresh packages...
error /home/circleci/project/node_modules/node-sass: Command failed.
Exit code: 1
Command: node scripts/build.js
Arguments: 
Directory: /home/circleci/project/node_modules/node-sass
Output:
Building: /usr/local/bin/node /home/circleci/project/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [
gyp verb cli   '/usr/local/bin/node',
gyp verb cli   '/home/circleci/project/node_modules/node-gyp/bin/node-gyp.js',
gyp verb cli   'rebuild',
gyp verb cli   '--verbose',
gyp verb cli   '--libsass_ext=',
gyp verb cli   '--libsass_cflags=',
gyp verb cli   '--libsass_ldflags=',
gyp verb cli   '--libsass_library='
gyp verb cli ]
gyp info using node-gyp@3.8.0
gyp info using node@16.13.0 | linux | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp verb `which` failed     at getNotFoundError (/home/circleci/project/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/home/circleci/project/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/home/circleci/project/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /home/circleci/project/node_modules/which/which.js:89:16
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
gyp verb `which` failed  python2 Error: not found: python2
gyp verb `which` failed     at getNotFoundError (/home/circleci/project/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/home/circleci/project/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/home/circleci/project/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /home/circleci/project/node_modules/which/which.js:89:16
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
gyp verb `which` failed   code: 'ENOENT'
gyp verb `which` failed }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` failed Error: not found: python
gyp verb `which` failed     at getNotFoundError (/home/circleci/project/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/home/circleci/project/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/home/circleci/project/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /home/circleci/project/node_modules/which/which.js:89:16
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
gyp verb `which` failed  python Error: not found: python
gyp verb `which` failed     at getNotFoundError (/home/circleci/project/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/home/circleci/project/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/home/circleci/project/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /home/circleci/project/node_modules/which/which.js:89:16
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /home/circleci/project/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
gyp verb `which` failed   code: 'ENOENT'
gyp verb `which` failed }
gyp ERR! configure error 
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (/home/circleci/project/node_modules/node-gyp/lib/configure.js:484:19)
gyp ERR! stack     at PythonFinder.<anonymous> (/home/circleci/project/node_modules/node-gyp/lib/configure.js:406:16)
gyp ERR! stack     at F (/home/circleci/project/node_modules/which/which.js:68:16)
gyp ERR! stack     at E (/home/circleci/project/node_modules/which/which.js:80:29)
gyp ERR! stack     at /home/circleci/project/node_modules/which/which.js:89:16
gyp ERR! stack     at /home/circleci/project/node_modules/isexe/index.js:42:5
gyp ERR! stack     at /home/circleci/project/node_modules/isexe/mode.js:8:5
gyp ERR! stack     at FSReqCallback.oncomplete (node:fs:198:21)
gyp ERR! System Linux 4.15.0-1110-aws
gyp ERR! command "/usr/local/bin/node" "/home/circleci/project/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /home/circleci/project/node_modules/node-sass
gyp ERR! node -v v16.13.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok 
Build failed with error code: 1
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

着目すべきは下記。

error /home/circleci/project/node_modules/node-sass: Command failed.

node-sassが原因で落ちてる模様。

gyp ERR! node -v v16.13.0

CircleCIのimageのnodeバージョンはv16.13.0。

原因

色々調べた結果、nodeのバージョンとnode-sassのバージョンはお互いの対応・非対応があるので、今回はそのバージョンのズレによる模様。

node-sassのリポジトリに記載がある。

<リポジトリより引用>

NodeJS Supported node-sass version Node Module
Node 17 7.0+ 102
Node 16 6.0+ 93
Node 15 5.0+, <7.0 88
Node 14 4.14+ 83
Node 13 4.13+, <5.0 79
Node 12 4.12+ 72
Node 11 4.10+, <5.0 67
Node 10 4.9+, <6.0 64
Node 8 4.5.3+, <5.0 57
Node <8 <5.0 <57

github.com

CircleCIはnode16でimageをビルドしているので、node-sassのバージョンもそれに対応する必要がある。

対応

CircleCIのimageがnode16に対しローカルはnode14だったので、バージョンアップをした。

# この時のnode16の安定版
%nvm install v16.13.0

%nvm use v16.13.0

%rails webpacker:install

これでCircleCIが落ちなくなり解決した。

参考

メタプログラミングRuby2章を読んで調べたこと

Ruby メタプログラミングRuby

はじめに

知人のエンジニアの方達とメタプログラミングRubyの輪読会をし、SmartHRさんで実施された問題を一緒に解いていく中で調べたことをまとめ。

対象リポジトリは下記。今回は02_object_modelに着手。

github.com

学んだメソッド

上記の問題のテストコードで下記メソッドを呼んでいて、見慣れなかったので調べました。(singleton_classとclass_eval)

# reading-metaprogramming-ruby/test/02_object_model/test_hierarchy.rb
c4 = C4.new
c4.singleton_class.class_eval do
  private
  def value=(x)
    @called_setter = true
    @value = x
  end

  def value
    @called_getter = true
    if defined?(@value)
      @value
    else
      nil
    end
  end

singleton_class

これはレシーバの特異クラスを返すメソッド。

レシーバの特異クラスがなければ作成する。 上記の例だとc4オブジェクトの特異クラスを作成して返す。

irbで動かすと下記のようになる。

irb(main):001:1* class C4
irb(main):002:0> end
=> nil
irb(main):003:0> c4 = C4.new
=> #<C4:0x00007fcac4188be8>
irb(main):004:0> c4.class
=> C4
irb(main):005:0> c4.singleton_class
=> #<Class:#<C4:0x00007fcac4188be8>>
irb(main):006:0> c4.singleton_class.class
=> Class

c4オブジェクトのクラスはC4クラスだが、それとは別の特異クラスが作成されている。

class_eval

Module#class_eval (Ruby 3.0.0 リファレンスマニュアル)を見ると

モジュールのコンテキストで文字列 expr またはモジュール自身をブロックパラメータとするブロックを評価してその結果を返します。

とある。

渡されたブロックをクラス定義やモジュール定義と同じように扱える、とざっくり解釈した。

例えば先ほどのC4クラスのc4オブジェクトの特異クラスにメソッドを生やすことができる。

irb(main):001:1* class C4
irb(main):002:0> end
=> nil
irb(main):003:0> c4 = C4.new
=> #<C4:0x00007fa8159ac5d0>
irb(main):004:0> c4.singleton_class
=> #<Class:#<C4:0x00007fa8159ac5d0>>
irb(main):005:1* c4.singleton_class.class_eval do
irb(main):006:2*   def hoge
irb(main):007:2*     p "インスタンスメソッド"
irb(main):008:1*   end
irb(main):009:1*
irb(main):010:2*   def self.fuga
irb(main):011:2*     p "クラスメソッド"
irb(main):012:1*   end
irb(main):013:0> end
=> :fuga
irb(main):014:0> c4.hoge
"インスタンスメソッド"
=> "インスタンスメソッド"
irb(main):015:0> c4.singleton_class.fuga
"クラスメソッド"
=> "クラスメソッド"

この場合、hogeメソッドはc4オブジェクトに後から独自のメソッドを生やしているので、c4オブジェクトの特異クラスのインスタンメソッドであり、c4オブジェクトの特異メソッドだと解釈した。

特異メソッド

特異メソッドについて理解が浅かったので調べた。

特異メソッドはある特定のオブジェクトだけで使うことができるメソッドのこと。 一般的な定義は下記のようになる。

irb(main):001:1* class C4
irb(main):002:0> end
=> nil
irb(main):003:0> c4 = C4.new
=> #<C4:0x00007fa8159ac5d0>
irb(main):004:1* def c4.hoge
irb(main):005:1*   "特異メソッド"
irb(main):006:0> end
=> :hoge
irb(main):007:0> c4.hoge
=> "特異メソッド"

先ほどの例のようにc4.singleton_class.class_evalのブロック内でも同様に特異メソッドを生やすこともできる。

参考

Capybaraでテーブルの特定のセルの値をテストする

Ruby on Rails RSpec Capybara

概要

例えば以下のようなテーブルがあり、指定した列、行に想定した値が表示されているかテストをしたい場合。

  • 例: user1のnameにtanakaが表示されているかテストしたい
/ name country
user1 tanaka japan

メソッド

以下のようなヘルパーメソッドを用意した。

def table_rows(xpath: ".//table[.//tbody]")
   header_tr, *trs = find(:xpath, xpath).all("tr").to_a
   column_names = header_tr.all("th,td").map(&:text)
   trs.map do |tr|
     columns = tr.all("th,td").each_with_object({}).with_index do |(td, hash), i|
       hash[column_names[i]] = td.text
     end
     OpenStruct.new(element: tr, columns: columns)
   end
 end

find(:xpath, xpath).all("tr").to_aでtableタグのthead、tbodyそれぞれのtrタグを取得している。

header_trにはtheadのtrタグの要素、trsにはtbodyのtrタグを配列にして入れている。

さらにcolumn_namesとしてtheadタグのth,tdタグの要素を配列にしている。

p header_tr => #<Capybara::Node::Element tag="tr" path="/HTML/BODY//DIV/TABLE/THEAD/TR">

p column_names #=> "/ name country"


p trs [#<Capybara::Node::Element tag="tr" path="/HTML/BODY/DIV/TABLE/TBODY/TR">]

次に以下の部分。

  trs.map do |tr|
     columns = tr.all("th,td").each_with_object({}).with_index do |(td, hash), i|
       hash[column_names[i]] = td.text
     end
     OpenStruct.new(element: tr, columns: columns)
   end

columnsには、trsのth,tdタグの要素を取得し、先ほどのcolumn_namesの要素をキーとしたハッシュが入る。

pp columns
# =>
{"/"=>"user1",
"name"=>"tanaka",
"country"=>"japan"}

そしてOpenStruct.new(element: tr, columns: columns)でテーブルの情報を格納。

このヘルパーメソッドの最終的な返り値は下記。

配列なので呼び出す際注意。

[#<OpenStruct element=#<Capybara::Node::Element tag="tr" path="/HTML/BODY/DIV/TABLE/TBODY/TR">, columns={"/"=>"user1", "name"=>"tanaka", "country"=>"japan"}>]

テスト

テストコード側でヘルパーメソッドを呼び出して以下のように指定するとテーブルの特定のセルをテストすることができる。

rows = table_rows
expect(rows.first.columns["name"]).to eq("tanaka")

テーブルが複数あるならwithinで対象を絞ればOK。

within(".hoge") do
  rows = table_rows
  expect(rows.first.columns["name"]).to eq("tanaka")
end