User tests: Successful: Unsuccessful:
Pull Request for Issue #45731 .
This pull request (PR) updates all npm dependencies for which currently updates are available and an update is possible.
It also relaxes the fixed version pin "5.3.3" for bootstrap and updates that dependency to the latest version "5.3.7".
The fixed version constraint was once added with PR #41899 for version "5.3.2" and updated to "5.3.3" with the later PR #44067 , keeping a pin to a fixed version. According to the comments in the former PR, this can be changed back to a caret version constraint "^5.3.7".
For non-development dependencies only minor or patch updates are made. Major updates should be done with Joomla 6.0.0.
For development dependencies, major updates have to be done for the linters (eslint and stylelint) because they are outdated and not maintainer anymore in the version we currently use.
This required to make changes e.g. on js or mjs files which are described in detail in section "Major direct development dependency updates" further below.
With this PR, 2 security vulnerabilities reported by npm audit
are fixed. We should check if we can back port them to 5.3-dev.
The following major updates of direct dependencies are not done with this PR:
Package Current Wanted Latest
@fortawesome/fontawesome-free 6.7.2 6.7.2 7.0.0
accessibility 3.0.17 3.0.17 6.1.0
choices.js 9.1.0 9.1.0 11.1.0
cropperjs 1.6.2 1.6.2 2.0.1
diff 5.2.0 5.2.0 8.0.2
dotenv 16.6.1 16.6.1 17.2.1
es-module-shims 1.10.1 1.10.1 2.6.1
mediaelement 5.1.2 5.1.2 7.0.7
qrcode-generator 1.5.2 1.5.2 2.0.2
shepherd.js 11.2.0 11.2.0 14.5.1
tinymce 6.8.6 6.8.6 8.0.1
@codemirror/commands
from 6.8.0 to 6.8.1@codemirror/lang-javascript
from 6.2.3 to 6.2.4@codemirror/lang-json
from 6.0.1 to 6.0.2@codemirror/lang-markdown
from 6.3.2 to 6.3.3@codemirror/lang-php
from 6.0.1 to 6.0.2@codemirror/language
from 6.11.0 to 6.11.2@codemirror/lint
from 6.8.4 to 6.8.5@codemirror/search
from 6.5.10 to 6.5.11@codemirror/theme-one-dark
from 6.1.2 to 6.1.3@codemirror/view
from 6.36.4 to 6.38.1bootstrap
from 5.3.3 to 5.3.7dotenv
from 16.4.7 to 16.6.1hotkeys-js
from 3.13.9 to 3.13.15qrcode-generator
from 1.4.4 to 1.5.2sa11y
from 4.1.1 to 4.1.10tinymce
from 6.8.5 to 6.8.6vue
from 3.5.13 to 3.5.18eslint
from 8.57.1 to 9.32.0With version 9, the configuration file format of eslint has changed.
Due to the update, lots of // eslint-disable-next-line
in some 90 js files have become obsolete.
This has bee done by @dgrammatiko with commit b78c75f , then the new configuration files have been moved to the "build" folder with my commit 34964ca .
Thanks a lot @dgrammatiko for your help.
eslint-plugin-vue
has been updated from 9.33.0 to 10.3.0 to match the new eslint
version.
eslint-plugin-import
has been updated from 2.31.0 to 2.32.0
eslint-config-airbnb-base
has been removed because there is no version available which supports eslint version 9.
stylelint
from 14.16.1 to 16.23.0With version 15, stylelint decided to focus on the main purpose of a code linter and leave pure code style checks to external tools. See details below the list of rules here https://stylelint.io/migration-guide/to-15/#deprecated-stylistic-rules .
With version 16, these deprecated rules have been removed, see https://stylelint.io/migration-guide/to-16/#removed-deprecated-stylistic-rules .
That causes "Unknown rule" errors when running npm ci
or npm run lint:css
, and the GitHub action for the CSS style check fails.
This is fixed by adding the @stylistic/stylelint-plugin
as recommended in the migration to 15 guide mentioned above, and changing the rules by adding a @stylistic/
prefix. In this way we can keep these rules, and npm run lint:css
should work as before.
In addition, it needed to fix stylelint errors in 3 of our scss files which were reported by the updated version due to its improvements. See this commit in my PR: 3c4b4ff
The following direct development dependencies have been updated to match the new stylelint
version:
stylelint-config-standard
from 24.0.0 to 39.0.0stylelint-order
from 5.0.0 to 7.0.0stylelint-scs
from 4.7.0 to 6.12.1@babel/core
from 7.26.10 to 7.28.0@babel/preset-env
from 7.26.9 to 7.28.0@rollup/plugin-commonjs
from 28.0.3 to 28.0.6@vue/compiler-sfc
from 3.5.8 to 3.5.18commander
from 13.1.0 to 14.0.0core-js
from 3.41.0 to 3.44.0cypress
from 14.2.0 to 14.5.3esbuild
from 0.25.1 to 0.25.8jasmine-core
from 5.6.0 to 5.9.0lightningcss
from 1.29.3 to 1.30.1pg
from 8.14.0 to 8.16.3rollup
from 4.35.0 to 4.46.1sass-embedded
from 1.85.1 to 1.89.2semver
from 7.7.1 to 7.7.2joomla-cypress
is only changed from "^1.3.0" to "^1.3.1" in package.json.
In package-lock.json it is already up to date.
The indirect dependencies of the above mentioned direct dependencies have been updated, too, of course.
But I don't think that needs to be reviewed in detail.
Reviewers please use the GitHub review functionality to approve the changes or request changes.
When having tested, please submit your test result in the issue tracker here https://issues.joomla.org/tracker/joomla-cms/45784 with the blue "Test this" button at the top left corner.
Pre-conditions: It needs a development environment, i.e. a git clone, composer and npm.
The description below assumes that you have a git clone of your fork with origin
being the remote for your fork, and upstream
being the remote to this repository here, as it is with a standard installation of GitHub desktop or most other Git clients.
git clean -d -x -f
git checkout .
git checkout 5.4-dev
git remote update
git reset --hard upstream/5.4-dev
composer install
.npm ci
.npm audit
to check for security issues.npm outdated
to check for outdated dependencies.git clean -d -x -f
git checkout .
git fetch upstream pull/45784/head:test-pr-45784
git checkout test-pr-45784
When running npm ci
, 6 deprecated dependencies are reported:
richard@vmubu02:~/lamp/public_html/joomla-cms-5.4-dev$ npm ci
npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm warn deprecated @humanwhocodes/config-array@0.13.0: Use @eslint/config-array instead
npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
npm warn deprecated @humanwhocodes/object-schema@2.0.3: Use @eslint/object-schema instead
npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported
npm warn deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
> joomla@5.4.0 install
> node build/build.mjs --prepare
...
When running npm audit
you get 3 vulnerabilities (1 low, 1 moderate, 1 critical):
# npm audit report
brace-expansion 1.0.0 - 1.1.11 || 2.0.0 - 2.0.1
brace-expansion Regular Expression Denial of Service vulnerability - https://github.com/advisories/GHSA-v6h2-p8h4-qcjw
brace-expansion Regular Expression Denial of Service vulnerability - https://github.com/advisories/GHSA-v6h2-p8h4-qcjw
fix available via `npm audit fix`
node_modules/brace-expansion
node_modules/glob/node_modules/brace-expansion
form-data 4.0.0 - 4.0.3
Severity: critical
form-data uses unsafe random function in form-data for choosing boundary - https://github.com/advisories/GHSA-fjxv-7rqg-78g4
fix available via `npm audit fix`
node_modules/form-data
tinymce <7.0.0
Severity: moderate
TinyMCE Cross-Site Scripting (XSS) vulnerability in handling external SVG files through Object or Embed elements - https://github.com/advisories/GHSA-5359-pvf2-pw78
fix available via `npm audit fix --force`
Will install tinymce@8.0.1, which is a breaking change
node_modules/tinymce
3 vulnerabilities (1 low, 1 moderate, 1 critical)
To address issues that do not require attention, run:
npm audit fix
To address all issues (including breaking changes), run:
npm audit fix --force
When running npm outdated
you get a giant list too long to be mentioned here.
When running npm ci
, no deprecated dependencies are reported:
richard@vmubu02:~/lamp/public_html/joomla-cms-5.4-dev$ npm ci
> joomla@5.4.0 install
> node build/build.mjs --prepare
...
When running npm audit
you only get the moderate vulnerability of tinymce, which can not be fixed without a major update and which we currently circumvent with restrictive settings, e.g. for iframes.
When running npm outdated
you get:
Package Current Wanted Latest Location Depended by
@fortawesome/fontawesome-free 6.7.2 6.7.2 7.0.0 node_modules/@fortawesome/fontawesome-free joomla-cms
accessibility 3.0.17 3.0.17 6.1.0 node_modules/accessibility joomla-cms
choices.js 9.1.0 9.1.0 11.1.0 node_modules/choices.js joomla-cms
cropperjs 1.6.2 1.6.2 2.0.1 node_modules/cropperjs joomla-cms
diff 5.2.0 5.2.0 8.0.2 node_modules/diff joomla-cms
dotenv 16.6.1 16.6.1 17.2.1 node_modules/dotenv joomla-cms
es-module-shims 1.10.1 1.10.1 2.6.1 node_modules/es-module-shims joomla-cms
mediaelement 5.1.2 5.1.2 7.0.7 node_modules/mediaelement joomla-cms
qrcode-generator 1.5.2 1.5.2 2.0.2 node_modules/qrcode-generator joomla-cms
shepherd.js 11.2.0 11.2.0 14.5.1 node_modules/shepherd.js joomla-cms
tinymce 6.8.6 6.8.6 8.0.1 node_modules/tinymce joomla-cms
Administrator and site look as usual.
Please select:
Documentation link for docs.joomla.org:
No documentation changes for docs.joomla.org needed
Pull Request link for manual.joomla.org:
No documentation changes for manual.joomla.org needed
Status | New | ⇒ | Pending |
Category | ⇒ | NPM Change Front End Plugins |
@brianteeman TinyMCE 7 would be a b/c break and in general we will not make major updates in 5.4 if there is any risk for b/c breaks. Such things will be for 6.0.
@brianteeman TinyMCE 8 would be a b/c break and in general we will not make major updates in 5.4 if there is any risk for b/c breaks. Such things will be for 6.0.
thats why i said the list should be reviewed
Labels |
Added:
NPM Resource Changed
PR-5.4-dev
|
Category | NPM Change Front End Plugins | ⇒ | Repository NPM Change Front End Plugins |
@dgrammatiko Could you check the "Stylelint major update from 14 to 16" part in the description of this PR?
Should we do something to bring back the functionality of the removed style checks? Can we implement own stylelint rules for that? Or integrate another 3rd party tool? Or can we live without these checks?
You can see the removed rules in commit 69ab7a1 .
Thanks in advance for checking.
@dgrammatiko P.S.: Another problem is updating eslint stuff. I don't get that working here. It fails with unresolved dependencies or something like that. Maybe you can help also with that?
I’ll have a look later on today
@dgrammatiko For the styllint rules they write in https://stylelint.io/migration-guide/to-15/#deprecated-stylistic-rules :
Alternatively, you can continue to enforce stylistic consistency with Stylelint by using the community plugin @stylistic/stylelint-plugin that has migrated the deprecated rules.
So maybe we can just add that plugin and add back the removed rules, e.g. "@stylistic/color-hex-case": "lower",
?
@dgrammatiko Done, I've added the plugin and added back the rules. Will update PR description with that. Stylelint issue solved. What remains is the eslint.
At some point we should move to biome and rolldown (rust based). I’m sure I have some code already but probably not for this pr. I’ll look at the eslint when I’m back home
Category | NPM Change Front End Plugins Repository | ⇒ | Repository JavaScript NPM Change Front End Plugins |
Current status of this PR regarding outdated dependencies:
Package Current Wanted Latest Location
@fortawesome/fontawesome-free 6.7.2 6.7.2 7.0.0 node_modules/@fortawesome/fontawesome-free
accessibility 3.0.17 3.0.17 6.1.0 node_modules/accessibility
choices.js 9.1.0 9.1.0 11.1.0 node_modules/choices.js
cropperjs 1.6.2 1.6.2 2.0.1 node_modules/cropperjs
diff 5.2.0 5.2.0 8.0.2 node_modules/diff
es-module-shims 1.10.1 1.10.1 2.6.1 node_modules/es-module-shims
eslint 8.57.1 8.57.1 9.32.0 node_modules/eslint
eslint-plugin-vue 9.33.0 9.33.0 10.3.0 node_modules/eslint-plugin-vue
mediaelement 5.1.2 5.1.2 7.0.7 node_modules/mediaelement
shepherd.js 11.2.0 11.2.0 14.5.1 node_modules/shepherd.js
tinymce 6.8.6 6.8.6 8.0.0 node_modules/tinymce
accessibility, shepherd.js and tinymce definitely can not be updated in this PR
accessibility, shepherd.js and tinymce definitely can not be updated in this PR
@brianteeman Yes, I think that's right. Fontawesome 7 could be ok as there are not really hard b/c breaks, but that needs to be checked more in detail.
Fontawesome has renamed some icons https://docs.fontawesome.com/upgrade/whats-changed#icons-renamed-in-v7
Fontawesome has renamed some icons https://docs.fontawesome.com/upgrade/whats-changed#icons-renamed-in-v7
@brianteeman Yes, but they have added aliases:
We’ve cleaned up a number of visually similar or redundant icons and remapped them as aliases.
doubt it would have any impact on core BUT it 5 to 6 is a breaking change so it would have to wait for j6
AFAIK mediaelement is NOT used anywhere in the core…
So the main thing is the eslint. It would really be cool to get rid of these warnings shown at the beginning of the output of an npm ci
run:
npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm warn deprecated @humanwhocodes/config-array@0.13.0: Use @eslint/config-array instead
npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
npm warn deprecated @humanwhocodes/object-schema@2.0.3: Use @eslint/object-schema instead
npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported
npm warn deprecated eslint@8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options.
So for eslint, if I remember correctly we use the Airbnb style guide which is not yet available for the next major version. I guess we have to pick another popular (and compatible) plugin
For the moment remove the airbnb from the eslint config and upgrade to v9, I’ll do the rest
So for eslint, if I remember correctly we use the Airbnb style guide which is not yet available for the next major version. I guess we have to pick another popular (and compatible) plugin
@dgrammatiko Correct, the Airbnb is the thing which breaks. Can you help with finding an alternative?
For the moment remove the airbnb from the eslint config and upgrade to v9, I’ll do the rest
@dgrammatiko Ok, will do that.
FYI ai gives some hints
Here's a breakdown of some alternatives:
eslint-config-standard:
This is a popular, opinionated style guide that focuses on a minimal set of rules, particularly favoring a semicolon-free style.
eslint-config-google:
Another widely used style guide, this one emphasizes Google's coding conventions.
eslint-config-next:
If you're working with Next.js, this configuration provides specific rules tailored to that framework.
@dgrammatiko eslint-config-standard seems not to work with eslint 9.
For the moment remove the airbnb from the eslint config and upgrade to v9
@dgrammatiko I've tried it here locally. It would work, but then npm run lint:js
fails due to the configuration file format change: https://eslint.org/blog/2023/10/flat-config-rollout-plans/
@dgrammatiko No idea which base branch you have chosen, but it seems it was not the one from this PR.
Update: Base branch would be ok, but the PR has lots of unwanted empty lines with spaces, see my comment there.
Category | NPM Change Front End Plugins Repository JavaScript | ⇒ | Repository JavaScript NPM Change |
Current status of this PR regarding outdated direct npm dependencies:
Package Current Wanted Latest Location
@fortawesome/fontawesome-free 6.7.2 6.7.2 7.0.0 node_modules/@fortawesome/fontawesome-free
accessibility 3.0.17 3.0.17 6.1.0 node_modules/accessibility
choices.js 9.1.0 9.1.0 11.1.0 node_modules/choices.js
cropperjs 1.6.2 1.6.2 2.0.1 node_modules/cropperjs
diff 5.2.0 5.2.0 8.0.2 node_modules/diff
es-module-shims 1.10.1 1.10.1 2.6.1 node_modules/es-module-shims
mediaelement 5.1.2 5.1.2 7.0.7 node_modules/mediaelement
shepherd.js 11.2.0 11.2.0 14.5.1 node_modules/shepherd.js
tinymce 6.8.6 6.8.6 8.0.0 node_modules/tinymce
Accessibility, shepherd.js and tinymce definitely can not be updated to the latest version in this PR.
Maybe choices.js, cropperjs, diff and es-module-shims should be checked.
Fontawesome will be discussed with maintainers.
Croperjs is fine as it’s used as a module ie using moduleimports
Croperjs is fine as it’s used as a module ie using moduleimports
@dgrammatiko What means "is fine"? Fine to keep as it is? Or fine to update?
@dgrammatiko P.S.: Do the changes listed here need some changes in the CMS, or could they cause problems for 3rd party extensions? https://fengyuanchen.github.io/cropperjs/migration.html .
Keep it as is here and let’s investigate in another pr
Keep it as is here and let’s investigate in another pr
@dgrammatiko Ok. It seems they have removed their CSS file from the distro, so we can't provide a style asset for that anymore. Of course we can remove it from build\build-modules-js\settings.json
, but it might be a b/c break if we don't provide the style assset anymore.
I will add some links to information in the description and will complete the testing instructions in the next days, then the PR will be ready.
Title |
|
Title |
|
I've reverted the major updates of the non-development dependencies, which were "es-module-shims", "qrcode-generator" and "dotenv", in order to play safe regarding b/c for 5.4. We can reconsider them when doing the npm updates for 6.0.
So this PR is ready for reviews and testing.
I have tested this item ✅ successfully on 3db258a
confirming the updated versions and the eslint changes. the only css changes present appear to be directly from the bs upgrade which as its a bug fix upgrade all look fine.
thanks for your hard work on this
I have tested this item ✅ successfully on 3db258a
Status | Pending | ⇒ | Ready to Commit |
RTC
Labels |
Added:
RTC
|
✅ Final test before merge, using JBT recreate
npm ci
npm run lint:js
npm run lint:css
npx npm-check-updates --target minor
all current available updates are includednpm audit
only one (already named) moderate severity vulnerability exists with node_modules/tinymceStatus | Ready to Commit | ⇒ | Fixed in Code Base |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2025-08-04 14:14:13 |
Closed_By | ⇒ | muhme |
Many thanks @richard67 for all the work. Thank you @dgrammatiko for your contribution. Thank you @brianteeman and @Hackwar for testing.
the pr is ok but the following outdated packages should be reviewed to see if they can be updated