railsでExecJS::ProgramErrorのエラー画面が出てくる

Question

前提・実現したいこと

ruby on rails において、task controller をつくり正常に　「XXX#index」の画面を表示したい。

発生している問題・エラーメッセージ

エラーが表示されて /index にアクセスした時に期待している画面が表示されない。

ExecJS::ProgramError in Tasks#index　
Showing /app_name/app/views/layouts/application.html.slim where line #8 raised:

TypeError: Cannot read property 'version' of undefined
Rails.root: /app_name

Application Trace | Framework Trace | Full Trace
(execjs):19:14
(execjs):1:102
app/views/layouts/application.html.slim:8:in `_app_views_layouts_application_html_slim___3139678354113059132_70258517883120'

該当のソースコード

doctype html
html
  head
    title
      | AppName
    = csrf_meta_tags
    = csp_meta_tag
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
  body
    .app-title.navbar.navbar-expand-md.navbar-light.bg-light
      .navbar-brand Taskleaf
    .container
    = yield

Rails.application.routes.draw do
  root to: 'tasks#index'
  resources :tasks
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
end

source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }

ruby '2.5.3'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.2.2'
# Use mysql as the database for Active Record
gem 'mysql2', '>= 0.4.4', '< 0.6.0'
# Use Puma as the app server
gem 'puma', '~> 3.11'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# See https://github.com/rails/execjs#readme for more supported runtimes
# gem 'mini_racer', platforms: :ruby

# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 4.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use ActiveStorage variant
# gem 'mini_magick', '~> 4.8'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

# Reduces boot times through caching; required in config/boot.rb
gem 'bootsnap', '>= 1.1.0', require: false

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
end

group :development do
  # Access an interactive console on exception pages or by calling 'console' anywhere in the code.
  gem 'web-console', '>= 3.3.0'
  gem 'listen', '>= 3.0.5', '< 3.2'
  # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
end

group :test do
  # Adds support for Capybara system testing and selenium driver
  gem 'capybara', '>= 2.15'
  gem 'selenium-webdriver'
  # Easy installation and use of chromedriver to run system tests with Chrome
  gem 'chromedriver-helper'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

gem 'slim-rails'
gem 'html2slim'
gem 'bootstrap'
gem 'execjs'
gem 'therubyracer'

gem 'coffee-script-source', '1.8.0'        

試したこと

coffee-script-sourceを追記することで解決するとの記事を見つけ、試しましたが解決しませんでした。
またnodejsのパスが通ってない可能性を考えてnodejs -vを行いましたが、パスは正常に通っていました。

補足情報（FW/ツールのバージョンなど）

rails 5.2.2
ruby 2.5.3
mac Catalina 10.15.7

丁寧すぎるDocker-composeによるrails5 + MySQL on Dockerの環境構築(Docker for Mac)
https://qiita.com/azul915/items/5b7063cbc80192343fc0

上記の記事を参考にしてdocker-composeで環境を構築しました。

Comments

[maisumakun]

javascript_include_tag 'application'としていますが、これで参照されるJavaScriptコードはどのようになっていますでしょうか？

[kawauso0407]

ご返信ありがとうございます。
application.jsとtasks.coffeeは以下のようにコメントのみでした。

```application
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's
// vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .

```

```taskscoffee
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/

```

またcable.jsというのもありました。
以下のようになっております

```cablejs
// Action Cable provides the framework to deal with WebSockets in Rails.
// You can generate new channels where WebSocket features live using the `rails generate channel` command.
//
//= require action_cable
//= require_self
//= require_tree ./channels

(function() {
this.App || (this.App = {});

App.cable = ActionCable.createConsumer();

```

Answer 1

理由はわかりませんがweb-packerをインストールしたら表示されました。
rails5ではwebpackerがなくても動くとおもっていたのですが違うようです。

$ docker-compose run web bundle exec rails webpacker:install
これでとりあえず表示はできるようになりました。