Add ability to test with Webpacker-built assets

.github/workflows/test.yml

@@ -12,35 +12,43 @@ jobs:
         gemfile: [ gemfiles/rails_6.1.gemfile ]
         orm: [ active_record ]
         adapter: [ sqlite3 ]
+        asset: [ webpacker ]
         include:
           - ruby: 2.5
             gemfile: gemfiles/rails_6.0.gemfile
             orm: active_record
             adapter: sqlite3
+            asset: webpacker
           - ruby: 3.0
             gemfile: gemfiles/rails_6.1.gemfile
             orm: active_record
             adapter: mysql2
+            asset: webpacker
           - ruby: 3.0
             gemfile: gemfiles/rails_6.1.gemfile
             orm: active_record
             adapter: postgresql
+            asset: webpacker
           - ruby: 3.0
             gemfile: gemfiles/rails_7.0.gemfile
             orm: active_record
             adapter: sqlite3
+            asset: webpacker
           - ruby: 2.7
             gemfile: gemfiles/rails_6.0.gemfile
             orm: mongoid
             adapter: sqlite3
+            asset: webpacker
           - ruby: 3.0
             gemfile: gemfiles/rails_6.1.gemfile
             orm: mongoid
             adapter: sqlite3
+            asset: webpacker
           - ruby: jruby
             gemfile: gemfiles/rails_6.1.gemfile
             orm: mongoid
             adapter: sqlite3
+            asset: webpacker
     runs-on: ubuntu-latest
     services:
       mysql:
@@ -64,6 +72,7 @@ jobs:
     env:
       BUNDLE_GEMFILE: ${{ matrix.gemfile }}
       CI_ORM: ${{ matrix.orm }}
+      CI_ASSET: ${{ matrix.asset }}
       JRUBY_OPTS: --debug
     steps:
     - uses: actions/checkout@v2
@@ -76,17 +85,23 @@ jobs:
       env:
         MAKE: make --jobs 4
         BUNDLE_WITHOUT: development
+    - name: Set up Node
+      uses: actions/setup-node@v2
+      with:
+        node-version: '14'
     - name: Setup application
       env:
         BUNDLE_GEMFILE: ../../${{ matrix.gemfile }}
         CI_DB_ADAPTER: ${{ matrix.adapter }}
         RAILS_ENV: test
       run: |
+        yarn install
         cd spec/dummy_app
         bundle exec rake rails_admin:prepare_ci_env db:create db:migrate
+        yarn install
         cd ../../
     - name: Run tests
-      run: bundle exec rake spec
+      run: bundle exec rspec
     - name: Coveralls Parallel
       uses: coverallsapp/github-action@master
       continue-on-error: true

.gitignore

@@ -5,14 +5,16 @@
 .bundle
 .idea/
 .rvmrc
+.sass-cache
 .yardoc
 /.emacs.desktop
 /gemfiles/*.lock
+/node_modules/*
 /rails_admin.gems
 /spec/generators/tmp
 /spec/lib/tmp
+/yarn.lock
 Gemfile.lock
-Gemfile31.lock
 coverage/*
 db/*.sqlite3
 db/*.sqlite3-journal
@@ -26,7 +28,4 @@ spec/dummy_app/log/*.log
 spec/dummy_app/public/uploads
 spec/dummy_app/Gemfile.lock
 tmp/**/*
-/.emacs.desktop
-.idea/*.xml
-.sass-cache
 nbproject

.rspec

@@ -1,3 +1,4 @@
 --color
 --order=random
 --profile
+--exclude-pattern 'dummy_app/node_modules/rails_admin/**/*_spec.rb'

.rubocop.yml

@@ -3,11 +3,13 @@ inherit_from: .rubocop_todo.yml
 AllCops:
   Exclude:
     - 'gemfiles/*'
+    - 'node_modules/**/*'
     - 'spec/dummy_app/bin/**/*'
     - 'spec/dummy_app/db/schema.rb'
     - 'spec/dummy_app/tmp/**/*'
     - 'vendor/bundle/**/*'
   NewCops: disable
+  SuggestExtensions: false
   TargetRubyVersion: 2.5
 
 Gemspec/DateAssignment:
@@ -109,7 +111,7 @@ Metrics/MethodLength:
   Max: 29 # TODO: Lower to 15
 
 Metrics/ModuleLength:
-  Max: 202 # TODO: Lower to 100
+  Max: 204 # TODO: Lower to 100
 
 Metrics/ParameterLists:
   Max: 8 # TODO: Lower to 4

Gemfile

@@ -5,6 +5,7 @@ gem 'rails'
 gem 'haml'
 gem 'devise'
 gem 'webrick', '~> 1.7'
+gem 'webpacker', require: false
 
 group :active_record do
   gem 'paper_trail'

app/views/layouts/rails_admin/_head.html.haml

@@ -3,5 +3,9 @@
 %meta{content: "width=device-width, initial-scale=1", name: "viewport; charset=utf-8"}
 %meta{content: "NONE,NOARCHIVE", name: "robots"}
 = csrf_meta_tag
-= stylesheet_link_tag "rails_admin/rails_admin.css", media: :all
-= javascript_include_tag "rails_admin/rails_admin.js"
+- if RailsAdmin::config.asset_source == :webpacker
+  = javascript_pack_tag "rails_admin"
+  = stylesheet_pack_tag "rails_admin"
+- else
+  = stylesheet_link_tag "rails_admin/rails_admin.css", media: :all
+  = javascript_include_tag "rails_admin/rails_admin.js"

gemfiles/rails_6.0.gemfile

@@ -7,6 +7,7 @@ gem "rails", "~> 6.0.0"
 gem "haml"
 gem "devise", "~> 4.7"
 gem "webrick", "~> 1.7"
+gem "webpacker", require: false
 gem "sassc-rails", "~> 2.1"
 
 group :active_record do

gemfiles/rails_6.1.gemfile

@@ -7,6 +7,7 @@ gem "rails", "~> 6.1.0"
 gem "haml"
 gem "devise", "~> 4.7"
 gem "webrick", "~> 1.7"
+gem "webpacker", require: false
 gem "sassc-rails", "~> 2.1"
 
 group :active_record do

gemfiles/rails_7.0.gemfile

@@ -7,6 +7,7 @@ gem "rails", "~> 7.0.0.alpha2"
 gem "haml"
 gem "devise", "~> 4.7", github: "strobilomyces/devise", branch: "patch-1"
 gem "webrick", "~> 1.7"
+gem "webpacker", require: false
 gem "sassc-rails", "~> 2.1"
 
 group :active_record do

lib/rails_admin/config.rb

@@ -86,6 +86,9 @@ class << self
       attr_accessor :navigation_static_links
       attr_accessor :navigation_static_label
 
+      # Set where RailsAdmin fetches JS/CSS from, defaults to :sprockets
+      attr_accessor :asset_source
+
       # Finish initialization by executing deferred configuration blocks
       def initialize!
         @deferred_blocks.each { |block| block.call(self) }
@@ -317,6 +320,7 @@ def reset
         @show_gravatar = true
         @navigation_static_links = {}
         @navigation_static_label = nil
+        @asset_source = (defined?(Webpacker) ? :webpacker : :sprockets)
         @parent_controller = '::ActionController::Base'
         @forgery_protection_settings = {with: :exception}
         RailsAdmin::Config::Actions.reset

lib/rails_admin/engine.rb

@@ -13,10 +13,12 @@ class Engine < Rails::Engine
     config.action_dispatch.rescue_responses['RailsAdmin::ActionNotAllowed'] = :forbidden
 
     initializer 'RailsAdmin precompile hook', group: :all do |app|
-      app.config.assets.precompile += %w(
-        rails_admin/rails_admin.js
-        rails_admin/rails_admin.css
-      )
+      if app.config.respond_to?(:assets)
+        app.config.assets.precompile += %w(
+          rails_admin/rails_admin.js
+          rails_admin/rails_admin.css
+        )
+      end
     end
 
     initializer 'RailsAdmin setup middlewares' do |app|

package.json

@@ -0,0 +1,21 @@
+{
+  "dependencies": {
+    "@fortawesome/fontawesome-free": "^5.15.4",
+    "@rails/ujs": "^6.1.4-1",
+    "bootstrap": "3.4.1",
+    "bootstrap-sass": "3.4.1",
+    "eonasdan-bootstrap-datetimepicker": "^4.17.49",
+    "jquery": "^3.6.0",
+    "jquery-ui": "^1.12.1",
+    "moment": "^2.29.1"
+  },
+  "directories": {
+    "src": "./src"
+  },
+  "version": "1.0.0",
+  "description": "RailsAdmin is a Rails engine that provides an easy-to-use interface for managing your data.",
+  "name": "rails_admin",
+  "scripts": {
+    "link": "yarn link && cd spec/dummy_app && yarn link rails_admin"
+  }
+}

spec/dummy_app/.browserslistrc

@@ -0,0 +1 @@
+defaults

spec/dummy_app/.gitignore

@@ -15,3 +15,11 @@
 /tmp
 
 /public/system
+
+/public/packs
+/public/packs-test
+/node_modules
+/yarn-error.log
+/yarn.lock
+yarn-debug.log*
+.yarn-integrity

spec/dummy_app/Gemfile

@@ -1,6 +1,7 @@
 source 'https://rubygems.org'
 
 gem 'rails', '>= 6.0.0'
+gem 'webpacker', require: false
 
 group :active_record do
   platforms :jruby do

spec/dummy_app/app/assets/javascripts/application.js

@@ -10,6 +10,5 @@
 // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
 // GO AFTER THE REQUIRES BELOW.
 //
-//= require jquery
-//= require jquery_ujs
+//= require rails-ujs
 //= require_tree .

spec/dummy_app/app/javascript/packs/application.js

@@ -0,0 +1,18 @@
+/* eslint no-console:0 */
+// This file is automatically compiled by Webpack, along with any other files
+// present in this directory. You're encouraged to place your actual application logic in
+// a relevant structure within app/javascript and only use these pack files to reference
+// that code so it'll be compiled.
+//
+// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
+// layout file, like app/views/layouts/application.html.erb
+
+
+// Uncomment to copy all static images under ../images to the output folder and reference
+// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
+// or the `imagePath` JavaScript helper below.
+//
+// const images = require.context('../images', true)
+// const imagePath = (name) => images(name, true)
+
+console.log('Hello World from Webpacker')

spec/dummy_app/app/javascript/packs/rails_admin.js

@@ -0,0 +1,2 @@
+import 'rails_admin/src/base'
+import '../stylesheets/rails_admin.scss'

spec/dummy_app/app/javascript/stylesheets/rails_admin.scss

@@ -0,0 +1 @@
+@import "~rails_admin/src/styles/base.scss";

spec/dummy_app/babel.config.js

@@ -0,0 +1,82 @@
+module.exports = function(api) {
+  var validEnv = ['development', 'test', 'production']
+  var currentEnv = api.env()
+  var isDevelopmentEnv = api.env('development')
+  var isProductionEnv = api.env('production')
+  var isTestEnv = api.env('test')
+
+  if (!validEnv.includes(currentEnv)) {
+    throw new Error(
+      'Please specify a valid `NODE_ENV` or ' +
+        '`BABEL_ENV` environment variables. Valid values are "development", ' +
+        '"test", and "production". Instead, received: ' +
+        JSON.stringify(currentEnv) +
+        '.'
+    )
+  }
+
+  return {
+    presets: [
+      isTestEnv && [
+        '@babel/preset-env',
+        {
+          targets: {
+            node: 'current'
+          }
+        }
+      ],
+      (isProductionEnv || isDevelopmentEnv) && [
+        '@babel/preset-env',
+        {
+          forceAllTransforms: true,
+          useBuiltIns: 'entry',
+          corejs: 3,
+          modules: false,
+          exclude: ['transform-typeof-symbol']
+        }
+      ]
+    ].filter(Boolean),
+    plugins: [
+      'babel-plugin-macros',
+      '@babel/plugin-syntax-dynamic-import',
+      isTestEnv && 'babel-plugin-dynamic-import-node',
+      '@babel/plugin-transform-destructuring',
+      [
+        '@babel/plugin-proposal-class-properties',
+        {
+          loose: true
+        }
+      ],
+      [
+        '@babel/plugin-proposal-object-rest-spread',
+        {
+          useBuiltIns: true
+        }
+      ],
+      [
+        '@babel/plugin-proposal-private-methods',
+        {
+          loose: true
+        }
+      ],
+      [
+        '@babel/plugin-proposal-private-property-in-object',
+        {
+          loose: true
+        }
+      ],
+      [
+        '@babel/plugin-transform-runtime',
+        {
+          helpers: false
+        }
+      ],
+      [
+        '@babel/plugin-transform-regenerator',
+        {
+          async: false
+        }
+      ]
+    ].filter(Boolean)
+  }
+}

spec/dummy_app/bin/webpack

@@ -0,0 +1,18 @@
+#!/usr/bin/env ruby
+
+ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development"
+ENV["NODE_ENV"]  ||= "development"
+
+require "pathname"
+ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile",
+  Pathname.new(__FILE__).realpath)
+
+require "bundler/setup"
+
+require "webpacker"
+require "webpacker/webpack_runner"
+
+APP_ROOT = File.expand_path("..", __dir__)
+Dir.chdir(APP_ROOT) do
+  Webpacker::WebpackRunner.run(ARGV)
+end