ESLint Reconfiguration and Related Fixes (#3965)

* Rely on eslint config & include babel parser

* Move esbuild `build-assets` to ES module format

* Move Cypress config & index to ES module format

* ESLint changes (so many) - Cypress support files

* Makefile - update compile-assets and lint

* ESLint config - bonus comments

* Remove redundant `npx`'s in package.json

backend/Makefile

@@ -10,7 +10,7 @@ compile:
 	@pip-compile --generate-hashes ./requirements/requirements.in -o requirements.txt --allow-unsafe
 
 compile-assets:
-	@node build-assets.js
+	@node build-assets.mjs
 
 # Generate an updated dev-requirements.txt
 compile-dev:
@@ -39,7 +39,7 @@ lint:
 	@echo "djlint:"
 	@djlint .
 	@echo eslint
-	@npx eslint --ignore-path ../.gitignore static/js
+	@npx eslint
 
 # Run Django tests:
 test:

backend/build-assets.js → backend/build-assets.mjs

@@ -1,25 +1,28 @@
-const esbuild = require('esbuild');
-const postcss = require('postcss');
-const autoprefixer = require('autoprefixer');
-const fs = require('fs');
-const glob = require('glob');
-const path = require('path');
-const { sassPlugin } = require('esbuild-sass-plugin');
+import { readFile, writeFile } from 'fs';
+import { sync } from 'glob';
+import process from 'node:process';
+import { join } from 'path';
+import postcss from 'postcss';
+
+import autoprefixer from 'autoprefixer';
+import { context } from 'esbuild';
+import { sassPlugin } from 'esbuild-sass-plugin';
+
 
 (async () => {
   const watch = process.argv.includes('--watch');
-  const jsPath = glob.sync(path.join('.', 'static', 'js', '*.js'));
+  const jsPath = sync(join('.', 'static', 'js', '*.js'));
 
   const runPostcss = (cssIn, cssOut) => {
     console.info('Running postcss');
 
-    fs.readFile(cssIn, (err, css) => {
+    readFile(cssIn, (err, css) => {
       postcss([autoprefixer])
         .process(css, { from: cssIn, to: cssOut })
         .then((result) => {
-          fs.writeFile(cssOut, result.css, () => true);
+          writeFile(cssOut, result.css, () => true);
           if (result.map) {
-            fs.writeFile(cssOut + '.map', result.map.toString(), () => true);
+            writeFile(cssOut + '.map', result.map.toString(), () => true);
           }
         });
     });
@@ -69,7 +72,7 @@ const { sassPlugin } = require('esbuild-sass-plugin');
     plugins: plugins,
   };
 
-  let ctx = await esbuild.context({ ...buildOptions, plugins });
+  let ctx = await context({ ...buildOptions, plugins });
   if (watch) {
     console.info('Watching assets...');
     await ctx.watch();

backend/cypress.config.js → backend/cypress.config.mjs

@@ -1,13 +1,14 @@
-const { defineConfig } = require('cypress');
-const { downloadFile } = require('cypress-downloadfile/lib/addPlugin');
+import { defineConfig } from 'cypress';
+import { downloadFile } from 'cypress-downloadfile/lib/addPlugin.js';
+import indexTasks from './cypress/plugins/index.mjs';
 
-module.exports = defineConfig({
+export default defineConfig({
   e2e: {
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.
     setupNodeEvents(on, config) {
       on('task', {downloadFile});
-      return require('./cypress/plugins/index.js')(on, config);
+      return indexTasks(on, config);
     },
     baseUrl: 'http://localhost:8000/',
     excludeSpecPattern: ['*/*/**/sf-sac-general-info.cy.js', '*/*/**/display-submissions.cy.js'],

backend/cypress/e2e/audit-info-form.cy.js

@@ -17,9 +17,11 @@ describe('Audit Information Form', () => {
       cy.get(item).click();
     });
     // Enter 750000 into the dollar theshold number field.
-    cy.get('#dollar_threshold').type('750000').blur();
+    cy.get('#dollar_threshold').type('750000');
+    cy.get('#dollar_threshold').blur();
     // Select 0 and 1 for the multiple select agencies field.
-    cy.get('#agencies').select(['00', '01']).blur();
+    cy.get('#agencies').select(['00', '01']);
+    cy.get('#agencies').blur();
   }
 
   it('Page loads successfully', () => {
@@ -43,27 +45,26 @@ describe('Audit Information Form', () => {
 
   describe('Number Field', () => {
     it('Cannot type non-int values (only allows numbers and [+-.e])', () => {
-      cy.get('#dollar_threshold')
-        .clear()
-        .type(`abcdfghigklmnopqrstuvwxyz=[]\;',/!@#$%^&*()_{}|:"<>?~`)
-        .should('have.value', '');
+      cy.get('#dollar_threshold').clear();
+      cy.get('#dollar_threshold').type(
+        `abcdfghigklmnopqrstuvwxyz=[];',/!@#$%^&*()_{}|:"<>?~`
+      );
+      cy.get('#dollar_threshold').should('have.value', '');
     });
 
     it('Negative values are disallowed', () => {
-      answerAllQuestions() // Enable submit button.
-      cy.get('#dollar_threshold')
-        .clear()
-        .type(`-2`)
-      cy.get('#continue').click()
+      answerAllQuestions(); // Enable submit button.
+      cy.get('#dollar_threshold').clear();
+      cy.get('#dollar_threshold').type(`-2`);
+      cy.get('#continue').click();
       cy.url().should('include', '/audit-info/');
     });
 
     it('Decimal values are disallowed', () => {
-      answerAllQuestions() // Enable submit button.
-      cy.get('#dollar_threshold')
-        .clear()
-        .type(`777.77`)
-      cy.get('#continue').click()
+      answerAllQuestions(); // Enable submit button.
+      cy.get('#dollar_threshold').clear();
+      cy.get('#dollar_threshold').type(`777.77`);
+      cy.get('#continue').click();
       cy.url().should('include', '/audit-info/');
     });
   });