Use Github Actions

.github/workflows/test.yml

@@ -0,0 +1,77 @@
+# This workflow uses actions that are not certified by GitHub.  They are
+# provided by a third-party and are governed by separate terms of service,
+# privacy policy, and support documentation.
+#
+# This workflow will install a prebuilt Ruby version, install dependencies, and
+# run tests and linters.
+name: "Ruby on Rails CI"
+on:
+  push:
+    branches: [ "master" ]
+  pull_request:
+    branches: [ "master" ]
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+    services:
+      postgres:
+        image: postgres:11-alpine
+        ports:
+          - "5432:5432"
+        env:
+          POSTGRES_DB: rails_test
+          POSTGRES_USER: rails
+          POSTGRES_PASSWORD: password
+    env:
+      RAILS_ENV: test
+      NODE_ENV: test
+      DATABASE_URL: "postgres://rails:password@localhost:5432/rails_test"
+      DRIVER: selenium_chrome
+      CHROME_BIN: /usr/bin/google-chrome
+      USE_COVERALLS: true
+    steps:
+      - name: Install Chrome
+        uses: browser-actions/setup-chrome@latest
+
+      - name: Check Chrome version
+        run: chrome --version
+
+      - name: Check Chrome version
+        run: google-chrome --version
+
+      - name: Set Display environment variable
+        run: "export DISPLAY=:99"
+
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Install Ruby and gems
+        uses: ruby/setup-ruby@0a29871fe2b0200a17a4497bae54fe5df0d973aa # v1.115.3
+        with:
+          ruby: 3.x
+          bundler-cache: true
+
+      - name: Use Node.js 16.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16.x
+      - name: Install Node Packages
+        run: npm install --legacy-peer-deps
+
+      - name: Set up database schema
+        run: bin/rails db:schema:load
+
+      - name: Build i18n libraries
+        run: bundle exec rake react_on_rails:locale
+
+      - name: Build webpacker chunks
+        run: NODE_ENV=development bundle exec bin/webpacker
+
+      - name: Run tests with xvfb
+        uses: GabrielBB/xvfb-action@v1
+        with:
+          run: bundle exec rake
+          working-directory: ./ #optional
+          options: ":99 -ac -screen scn 1600x1200x16"

.nvmrc

@@ -1 +1 @@
-12
+16

Gemfile

@@ -41,10 +41,6 @@ gem "sdoc", group: :doc
 # Use Rails Html Sanitizer for HTML sanitization
 gem "rails-html-sanitizer"
 
-# See https://github.com/sstephenson/execjs#readme for more supported runtimes
-# mini_racer is probably faster than therubyracer
-gem "mini_racer", platforms: :ruby
-
 gem "autoprefixer-rails"
 
 gem "awesome_print"
@@ -97,7 +93,7 @@ end
 group :test do
   gem "capybara"
   gem "capybara-screenshot"
-  gem "coveralls", require: false
+  gem 'coveralls_reborn', '~> 0.25.0', require: false
   gem "database_cleaner"
   gem "generator_spec"
   gem "launchy"

Gemfile.lock

@@ -100,12 +100,11 @@ GEM
     coffee-script-source (1.12.2)
     concurrent-ruby (1.1.9)
     connection_pool (2.2.5)
-    coveralls (0.8.23)
-      json (>= 1.8, < 3)
-      simplecov (~> 0.16.1)
-      term-ansicolor (~> 1.3)
-      thor (>= 0.19.4, < 2.0)
-      tins (~> 1.6)
+    coveralls_reborn (0.25.0)
+      simplecov (>= 0.18.1, < 0.22.0)
+      term-ansicolor (~> 1.6)
+      thor (>= 0.20.3, < 2.0)
+      tins (~> 1.16)
     crass (1.0.6)
     database_cleaner (2.0.1)
       database_cleaner-active_record (~> 2.0.0)
@@ -140,7 +139,6 @@ GEM
     json (2.6.1)
     launchy (2.5.0)
       addressable (~> 2.7)
-    libv8-node (16.10.0.0)
     listen (3.7.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
@@ -154,8 +152,6 @@ GEM
     method_source (1.0.0)
     mini_mime (1.1.2)
     mini_portile2 (2.6.1)
-    mini_racer (0.6.0)
-      libv8-node (~> 16.10.0.0)
     minitest (5.15.0)
     nio4r (2.5.8)
     nokogiri (1.12.5)
@@ -310,11 +306,12 @@ GEM
       rack-proxy (>= 0.6.1)
       railties (>= 5.2)
       semantic_range (>= 2.3.0)
-    simplecov (0.16.1)
+    simplecov (0.21.2)
       docile (~> 1.1)
-      json (>= 1.8, < 3)
-      simplecov-html (~> 0.10.0)
-    simplecov-html (0.10.2)
+      simplecov-html (~> 0.11)
+      simplecov_json_formatter (~> 0.1)
+    simplecov-html (0.12.3)
+    simplecov_json_formatter (0.1.4)
     spring (4.0.0)
     spring-commands-rspec (1.0.4)
       spring (>= 0.9.1)
@@ -330,7 +327,7 @@ GEM
       tins (~> 1.0)
     thor (1.2.1)
     tilt (2.0.10)
-    tins (1.30.0)
+    tins (1.31.1)
       sync
     tzinfo (2.0.4)
       concurrent-ruby (~> 1.0)
@@ -372,15 +369,14 @@ DEPENDENCIES
   capybara
   capybara-screenshot
   coffee-rails
-  coveralls
+  coveralls_reborn (~> 0.25.0)
   database_cleaner
   factory_bot_rails
   foreman
   generator_spec
   jbuilder
   launchy
   listen
-  mini_racer
   pg
   pry
   pry-byebug

app/models/git_commit_sha.rb

@@ -9,7 +9,7 @@ def self.current_sha
   end
 
   def self.reset_current_sha
-    self.current_sha = nil
+    @current_sha = nil
   end
 
   # Assumes the git CLI is available. This is not the case in production on Heroku.

app/views/comments/index.html.erb

@@ -19,9 +19,13 @@
       <tr>
         <td><%= comment.author %></td>
         <td><%= comment.text %></td>
+      </tr>
+      <tr>
         <td><%= link_to 'Show', comment %></td>
         <td><%= link_to 'Edit', edit_comment_path(comment) %></td>
-        <td><%= link_to 'Destroy', comment, method: :delete, data: { confirm: 'Are you sure?' } %></td>
+      </tr>
+      <tr>
+        <td><%= link_to 'Destroy', comment, method: :delete, data: { method: :delete, confirm: 'Are you sure?' } %></td>
       </tr>
     <% end %>
   </tbody>

client/app/bundles/comments/startup/ClientRouterApp.jsx

@@ -5,17 +5,15 @@ import ReactOnRails from 'react-on-rails';
 import { BrowserRouter } from 'react-router-dom';
 import routes from '../routes/routes.jsx';
 
-function ClientRouterApp(_props, _railsContext) {
+function ClientRouterApp(_props) {
   const store = ReactOnRails.getStore('routerCommentsStore');
 
   // eslint-disable-next-line react/display-name
-  return function () {
-    return (
-      <Provider store={store}>
-        <BrowserRouter>{routes}</BrowserRouter>
-      </Provider>
-    );
-  };
+  return (
+    <Provider store={store}>
+      <BrowserRouter>{routes}</BrowserRouter>
+    </Provider>
+  );
 }
 
 export default ClientRouterApp;

client/app/bundles/comments/startup/NavigationBarApp.jsx

@@ -23,18 +23,16 @@ function NavigationBarApp(_props, railsContext) {
   } else if (pathname === paths.NO_ROUTER_PATH) {
     store = ReactOnRails.getStore('commentsStore', false);
   } else {
-    return <NavigationBar {...{ pathname }} />;
+    return () => <NavigationBar {...{ pathname }} />;
   }
 
   // eslint interprets the return as a new component definition, which is not the case
   // eslint-disable-next-line react/display-name, react/no-unstable-nested-components
-  return function () {
-    return (
-      <Provider store={store}>
-        <NavigationBarContainer />
-      </Provider>
-    );
-  };
+  return () => (
+    <Provider store={store}>
+      <NavigationBarContainer />
+    </Provider>
+  );
 }
 
 export default NavigationBarApp;

client/app/bundles/comments/startup/ServerRouterApp.jsx

@@ -25,15 +25,13 @@ function ServerRouterApp(_props, railsContext) {
 
   // Important that you don't do this if you are redirecting or have an error.
   // eslint-disable-next-line react/display-name
-  return function () {
-    return (
-      <Provider store={store}>
-        <StaticRouter location={location} context={context}>
-          {routes}
-        </StaticRouter>
-      </Provider>
-    );
-  };
+  return () => (
+    <Provider store={store}>
+      <StaticRouter location={location} context={context}>
+        {routes}
+      </StaticRouter>
+    </Provider>
+  );
 }
 
 export default ServerRouterApp;

client/app/packs/client-bundle.js

@@ -1,5 +1,6 @@
 import ReactOnRails from 'react-on-rails';
 import 'bootstrap-loader';
+import 'expose-loader?exposes=$,jQuery!jquery';
 import 'jquery-ujs';
 
 import App from '../bundles/comments/startup/App.jsx';

config/initializers/react_on_rails.rb

@@ -3,8 +3,9 @@
 # Shown below are the defaults for configuration
 ReactOnRails.configure do |config|
   # Define the files for we need to check for webpack compilation when running tests
-  config.webpack_generated_files = %w[ app-bundle.js vendor-bundle.js app-bundle.css
-                                       vendor-bundle.css server-bundle.js ]
+  config.webpack_generated_files = %w[ client-bundle.js server-bundle.js ]
+
+  config.build_test_command = "RAILS_ENV=test bin/webpacker"
 
   # This is the file used for server rendering of React when using `(prerender: true)`
   # If you are never using server rendering, you may set this to "".

config/webpacker.yml

@@ -49,9 +49,6 @@ test:
   <<: *default
   compile: true
 
-  # Compile test packs to a separate directory
-  public_output_path: packs-test
-
 production:
   <<: *default
 

package.json

@@ -3,8 +3,8 @@
   "version": "1.1.0",
   "description": "Code from the React Webpack tutorial.",
   "engines": {
-    "node": "16.13.2",
-    "yarn": "1.22.17"
+    "node": "16",
+    "yarn": "1.22"
   },
   "repository": {
     "type": "git",
@@ -35,18 +35,18 @@
     "@rails/actioncable": "6.1.4-4",
     "autoprefixer": "^7.1.5",
     "axios": "^0.17.1",
-    "babel-loader": "8",
+    "babel-loader": "^8.2.3",
     "babel-plugin-macros": "^3.1.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
-    "bootstrap-loader": "judahmeek/bootstrap-loader#judahmeek/webpack-5",
+    "bootstrap-loader": "4.0.0",
     "bootstrap-sass": "^3.3.7",
     "classnames": "^2.2.5",
     "compression-webpack-plugin": "9",
     "css-loader": "^6.5.1",
     "css-minimizer-webpack-plugin": "^3.3.1",
     "es5-shim": "^4.5.9",
     "estraverse": "^4.2.0",
-    "expose-loader": "^1.0.0",
+    "expose-loader": "^4.0.0",
     "immutable": "^3.8.2",
     "imports-loader": "^1.1.0",
     "intl": "^1.2.5",
@@ -91,7 +91,6 @@
     "@webpack-cli/serve": "^1.6.0",
     "babel-eslint": "^8.0.2",
     "babel-jest": "^23.4.2",
-    "babel-loader": "^8.2.3",
     "body-parser": "^1.18.2",
     "eslint": "^8.6.0",
     "eslint-config-prettier": "^8.3.0",