Enable JS tests (#2527)

.github/workflows/test.yml

@@ -29,6 +29,35 @@ jobs:
       - name: Security audit application code
         run: bundle exec brakeman -q
 
+  javascript_test:
+    runs-on: ubuntu-latest
+    permissions:
+      checks: write
+
+    env:
+      RAILS_ENV: test
+      CI: true
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Allow tests to run
+        run: |
+          mkdir -p log tmp tmp/pids
+          sudo sed -i 's/openssl_conf = openssl_init/#openssl_conf = openssl_init/g' /etc/ssl/openssl.cnf
+
+      - name: Setup Ruby and install gems
+        uses: ruby/setup-ruby@v1
+        with:
+          bundler-cache: true
+
+      - name: Install packages
+        run: yarn install --pure-lockfile
+
+      - name: Javascript tests
+        run: bundle exec teaspoon
+
   test:
     runs-on: ubuntu-latest
     permissions:
@@ -131,6 +160,6 @@ jobs:
           minimum_file_coverage: 100
 
   build-and-deploy:
-    needs: [linting, coverage]
+    needs: [linting, javascript_test, coverage]
     uses: ./.github/workflows/deploy.yml
     secrets: inherit

Gemfile

@@ -99,8 +99,10 @@ group :development, :test do
   gem "colorize"
   gem "debug", ">= 1.0.0"
   gem "parallel_tests"
+  gem "phantomjs"
   gem "rspec-collection_matchers"
   gem "rspec-rails", "~> 6.0"
   gem "rubocop-govuk", require: false
   gem "selenium-webdriver"
+  gem "teaspoon-jasmine"
 end

Gemfile.lock

@@ -125,10 +125,10 @@ GEM
       caxlsx (>= 2.0.2, < 3.3.0)
     base64 (0.2.0)
     bcrypt (3.1.20)
-    better_errors (2.9.1)
-      coderay (>= 1.0.0)
+    better_errors (2.10.1)
       erubi (>= 1.0.0)
       rack (>= 0.9.0)
+      rouge (>= 1.0.0)
     better_html (2.1.1)
       actionview (>= 6.0)
       activesupport (>= 6.0)
@@ -166,7 +166,6 @@ GEM
     caxlsx_rails (0.6.3)
       actionpack (>= 3.1)
       caxlsx (>= 3.0)
-    coderay (1.1.3)
     colorize (0.8.1)
     concurrent-ruby (1.3.4)
     config (5.5.2)
@@ -365,6 +364,7 @@ GEM
     pg_search (2.3.6)
       activerecord (>= 5.2)
       activesupport (>= 5.2)
+    phantomjs (2.1.1.0)
     prawn (2.4.0)
       pdf-core (~> 0.9.0)
       ttfunk (~> 1.7)
@@ -445,6 +445,7 @@ GEM
       actionpack (>= 5.2)
       railties (>= 5.2)
     rexml (3.3.9)
+    rouge (4.5.1)
     rspec-collection_matchers (1.2.1)
       rspec-expectations (>= 2.99.0.beta1)
     rspec-core (3.12.2)
@@ -573,6 +574,10 @@ GEM
       sprockets (>= 3.0.0)
     stringio (3.1.2)
     table_print (1.5.7)
+    teaspoon (1.4.0)
+      railties (>= 5.0)
+    teaspoon-jasmine (2.9.1)
+      teaspoon (>= 1.0.0)
     temple (0.10.1)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
@@ -663,6 +668,7 @@ DEPENDENCIES
   parallel_tests
   pg (~> 1.3)
   pg_search (~> 2.3.6)
+  phantomjs
   prawndown
   puma (~> 6.4)
   pundit (~> 2.1)
@@ -689,6 +695,7 @@ DEPENDENCIES
   slim-rails (~> 3.6)
   sprockets (~> 4.2.1)
   table_print
+  teaspoon-jasmine
   terser
   timecop
   turbolinks (~> 5)

spec/javascripts/modules/DataRequestActionsSpec.js

@@ -0,0 +1,5 @@
+describe('Modules.DataRequestActions.js', function() {
+  it('should exist with expected functions', function() {
+    expect(moj.Modules.DataRequestActions.init).toBeDefined();
+  });
+});

spec/javascripts/modules/DropzoneSpec.js

@@ -3,27 +3,6 @@ describe('Modules.Dropzone.js', function() {
     expect(moj.Modules.Dropzone.init).toBeDefined();
     expect(moj.Modules.Dropzone.$target).toBeDefined();
   });
-
-  describe('moj.Modules.Dropzone.init', function(){
-    var dropzone;
-
-    beforeAll(function(){
-      var body = document.getElementsByTagName('body')[0];
-      var dropzoneContainer = document.createElement('div');
-      dropzoneContainer.classList.add('dropzone');
-      dropzoneContainer.setAttribute('data-url', window.location.href);
-      dropzoneContainer.setAttribute('data-max-filesize-in-mb',20);
-      //dropzoneContainer.setAttribute('data-max-filesize-in-mb',20);
-      body.appendChild(dropzoneContainer);
-      moj.Modules.Dropzone.init();
-      dropzone = dropzoneContainer
-    });
-
-    it('should change the default error messages',function() {
-      expect(dropzone.dropzone.options.dictFileTooBig)
-        .toEqual('File is too big. Max file size is {{maxFilesize}}MB. We cannot upload this file.')
-    })
-  })
 });
 
 describe('Modules.ExternalLinks.js', function() {

spec/javascripts/spec_helper.js

@@ -0,0 +1,32 @@
+// Teaspoon includes some support files, but you can use anything from your own support path too.
+// require support/jasmine-jquery-1.7.0
+// require support/jasmine-jquery-2.0.0
+// require support/jasmine-jquery-2.1.0
+// require support/sinon
+// require support/your-support-file
+//
+// PhantomJS (Teaspoons default driver) doesn't have support for Function.prototype.bind, which has caused confusion.
+// Use this polyfill to avoid the confusion.
+//= require support/phantomjs-shims
+//
+// You can require your own javascript files here. By default this will include everything in application, however you
+// may get better load performance if you require the specific files that are being used in the spec that tests them.
+//= require application
+//
+// Deferring execution
+// If you're using CommonJS, RequireJS or some other asynchronous library you can defer execution. Call
+// Teaspoon.execute() after everything has been loaded. Simple example of a timeout:
+//
+// Teaspoon.defer = true
+// setTimeout(Teaspoon.execute, 1000)
+//
+// Matching files
+// By default Teaspoon will look for files that match _spec.{js,js.coffee,coffee}. Add a filename_spec.js file in your
+// spec path and it'll be included in the default suite automatically. If you want to customize suites, check out the
+// configuration in teaspoon_env.rb
+//
+// Manifest
+// If you'd rather require your spec files manually (to control order for instance) you can disable the suite matcher in
+// the configuration and use this file as a manifest.
+//
+// For more information: http://github.com/jejacks0n/teaspoon