chore: handle jQuery via Rollup external

.eslintrc.js

@@ -1,9 +1,5 @@
 module.exports = {
   extends: ['standard', 'prettier'],
-  globals: {
-    $: 'readonly',
-    jQuery: 'readonly'
-  },
   ignorePatterns: [
     '**/vendor/**',
     'package/**',

gulp/build-javascript.js

@@ -8,6 +8,7 @@ const concat = require('gulp-concat')
 const rename = require('gulp-rename')
 const uglify = require('gulp-uglify')
 const { rollup } = require('rollup')
+const externalGlobals = require('rollup-plugin-external-globals')
 
 gulp.task('build:javascript', async () => {
   const modulePaths = await glob('moj/components/**/*.{cjs,js,mjs}', {
@@ -36,7 +37,14 @@ gulp.task('build:javascript', async () => {
           name: 'MOJFrontend'
         }
       ],
-      plugins: [nodeResolve(), commonjs()]
+      external: ['jquery'],
+      plugins: [
+        externalGlobals({
+          jquery: 'window.jQuery'
+        }),
+        nodeResolve(),
+        commonjs()
+      ]
     })
 
     // Create bundle
@@ -59,11 +67,7 @@ gulp.task('build:javascript-minified', () => {
 
 gulp.task('build:javascript-minified-with-jquery', () => {
   return gulp
-    .src([
-      'node_modules/jquery/dist/jquery.js',
-      'gulp/jquery/scope.js',
-      'package/moj/all.js'
-    ])
+    .src(['node_modules/jquery/dist/jquery.js', 'package/moj/all.js'])
     .pipe(concat('all.jquery.min.js'))
     .pipe(uglify())
     .pipe(gulp.dest('package/moj/'))

gulp/docs.js

@@ -7,6 +7,7 @@ const rename = require('gulp-rename')
 const gulpSass = require('gulp-sass')
 const uglify = require('gulp-uglify')
 const { rollup } = require('rollup')
+const externalGlobals = require('rollup-plugin-external-globals')
 const dartSass = require('sass-embedded')
 
 const sass = gulpSass(dartSass)
@@ -71,7 +72,14 @@ gulp.task('docs:scripts', async () => {
 
   const bundle = await rollup({
     input,
-    plugins: [nodeResolve(), commonjs()]
+    external: ['jquery'],
+    plugins: [
+      externalGlobals({
+        jquery: 'window.jQuery'
+      }),
+      nodeResolve(),
+      commonjs()
+    ]
   })
 
   await bundle.write({

jest.setup.js

@@ -1,6 +1,6 @@
 require('@testing-library/jest-dom')
-require('./src/moj/vendor/jquery')
 require('mock-match-media/jest-setup')
+
 const { toHaveNoViolations } = require('jest-axe')
 
 expect.extend(toHaveNoViolations)

package.json

@@ -115,6 +115,7 @@
     "prettier": "^3.4.2",
     "require-dir": "^1.2.0",
     "rollup": "^4.34.4",
+    "rollup-plugin-external-globals": "^0.13.0",
     "sass-embedded": "^1.83.4",
     "semantic-release": "^23.0.0",
     "semantic-release-plugin-update-version-in-files": "^1.1.0",

src/moj/all.js

@@ -1,5 +1,7 @@
 /* eslint-disable no-new */
 
+const $ = require('jquery')
+
 const { AddAnother } = require('./components/add-another/add-another.js')
 const { Alert } = require('./components/alert/alert.js')
 const { ButtonMenu } = require('./components/button-menu/button-menu.js')

src/moj/components/add-another/add-another.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function AddAnother(container) {
   this.container = $(container)
 

src/moj/components/filter-toggle-button/filter-toggle-button.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function FilterToggleButton(options) {
   this.options = options
   this.container = $(this.options.toggleButton.container)

src/moj/components/form-validator/form-validator.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 const { addAttributeValue, removeAttributeValue } = require('../../helpers.js')
 
 function FormValidator(form, options) {

src/moj/components/multi-file-upload/multi-file-upload.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 const {
   dragAndDropSupported,
   fileApiSupported,

src/moj/components/multi-select/multi-select.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function MultiSelect(options) {
   this.container = $(options.container)
 

src/moj/components/password-reveal/password-reveal.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function PasswordReveal(element) {
   this.el = element
   const $el = $(this.el)

src/moj/components/rich-text-editor/rich-text-editor.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function RichTextEditor(options) {
   if (!('contentEditable' in document.documentElement)) {
     return

src/moj/components/search-toggle/search-toggle.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function SearchToggle(options) {
   this.options = options
   this.container = $(this.options.search.container)

src/moj/components/sortable-table/sortable-table.js

@@ -1,3 +1,5 @@
+const $ = require('jquery')
+
 function SortableTable(params) {
   this.table = $(params.table)