migrates to webpack 4 to enforce security

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "stf",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "dependencies": {
     "angular": "~1.8.3",
     "angular-animate": "~1.8.3",
@@ -16,7 +16,7 @@
     "angular-sanitize": "~1.8.3",
     "angular-touch": "~1.8.3",
     "angular-ui-ace": "~0.2.3",
-    "angular-ui-bootstrap": "~1.1.2",
+    "angular-ui-bootstrap": "~2.5.6",
     "angular-xeditable": "~0.10.2",
     "bootstrap": "~3.4.1",
     "components-font-awesome": "~4.7.0",

gulpfile.js

@@ -1,5 +1,5 @@
 //
-// Copyright © 2022 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+// Copyright © 2022-2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
 //
 
 var path = require('path')
@@ -10,7 +10,6 @@ var jsonlint = require('gulp-jsonlint')
 var eslint = require('gulp-eslint')
 var EslintCLIEngine = require('eslint').CLIEngine
 var webpack = require('webpack')
-var webpackConfig = require('./webpack.config').webpack
 var webpackStatusConfig = require('./res/common/status/webpack.config')
 var gettext = require('gulp-angular-gettext')
 var pug = require('gulp-pug')
@@ -146,15 +145,7 @@ function fromString(filename, string) {
 
 // For production
 gulp.task('webpack:build', function(callback) {
-  var myConfig = Object.create(webpackConfig)
-  myConfig.plugins = myConfig.plugins.concat(
-    new webpack.DefinePlugin({
-      'process.env': {
-        NODE_ENV: JSON.stringify('production')
-      }
-    })
-  )
-  myConfig.devtool = false
+  var myConfig = require('./webpack.config').webpack
 
   webpack(myConfig, function(err, stats) {
     if (err) {

lib/units/app/middleware/webpack.js

@@ -1,3 +1,7 @@
+//
+// Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 var path = require('path')
 var url = require('url')
 
@@ -69,9 +73,9 @@ module.exports = function(localOptions) {
     }
   }
 
-  compiler.plugin('done', doneListener)
-  compiler.plugin('invalid', invalidate)
-  compiler.plugin('compile', invalidate)
+  compiler.hooks.done.tap('done', doneListener)
+  compiler.hooks.invalid.tap('invalid', invalidate)
+  compiler.hooks.compile.tap('compile', invalidate)
 
   function bundle() {
     if (valid) {

package.json

@@ -51,7 +51,7 @@
     "@node-saml/passport-saml": "^5.0.0",
     "@slack/web-api": "^7.7.0",
     "@targetprocess/swagger-tools": "^1.0.1",
-    "android-device-list": "^1.2.7",
+    "android-device-list": "^1.2.10",
     "autodesk-forks-swagger-express-mw": "^0.9.0",
     "aws-sdk": "^2.4.13",
     "basic-auth": "^1.0.3",
@@ -67,7 +67,7 @@
     "express": "^4.21.1",
     "express-validator": "^7.2.0",
     "file-saver": "1.3.3",
-    "formidable": "^1.2.0",
+    "formidable": "^1.2.6",
     "gm": "^1.25.0",
     "hipchatter": "^0.3.1",
     "http-proxy": "^1.18.1",
@@ -77,9 +77,8 @@
     "lodash": "^4.17.21",
     "machinepack-http": "^9.0.0",
     "markdown-serve": "^0.9.0",
-    "mime": "^1.3.4",
-    "minimatch": "^3.0.3",
-    "module-alias": "^2.2.3",
+    "mime": "^1.6.0",
+    "minimatch": "^3.1.2",
     "my-local-ip": "^1.0.0",
     "openid": "^2.0.1",
     "passport": "^0.6.0",
@@ -90,8 +89,8 @@
     "request-progress": "^2.0.1",
     "rethinkdb": "^2.0.2",
     "semver": "^7.3.5",
-    "serve-favicon": "^2.2.0",
-    "serve-static": "^1.9.2",
+    "serve-favicon": "^2.5.0",
+    "serve-static": "^1.15.0",
     "socket.io": "^4.8.1",
     "socket.io-client": "^4.8.1",
     "split": "^1.0.0",
@@ -126,12 +125,13 @@
     "async": "^2.0.1",
     "bower": "^1.8.14",
     "chai": "^3.4.1",
-    "css-loader": "^0.28.11",
+    "consolidate": "^0.14.5",
+    "css-loader": "^3.6.0",
     "del": "^2.0.1",
     "eslint": "^4.19.1",
     "event-stream": "^3.3.2",
-    "exports-loader": "^0.7.0",
-    "file-loader": "^0.9.0",
+    "exports-loader": "^1.1.1",
+    "file-loader": "^6.2.0",
     "fs-extra": "^8.1.0",
     "gulp": "^4.0.2",
     "gulp-angular-gettext": "^2.1.0",
@@ -141,12 +141,11 @@
     "gulp-pug": "^4.0.1",
     "gulp-run": "^1.6.12",
     "gulp-util": "^3.0.7",
-    "html-loader": "^0.5.5",
+    "html-loader": "^1.3.2",
     "http-https": "^1.0.0",
-    "imports-loader": "^0.8.0",
+    "imports-loader": "^1.2.0",
     "jasmine-core": "^2.4.1",
     "jasmine-reporters": "^2.3.2",
-    "json-loader": "^0.5.4",
     "karma": "^2.0.2",
     "karma-chrome-launcher": "^3.1.0",
     "karma-firefox-launcher": "^1.0.0",
@@ -156,9 +155,9 @@
     "karma-opera-launcher": "^1.0.0",
     "karma-phantomjs-launcher": "^1.0.0",
     "karma-safari-launcher": "^1.0.0",
-    "karma-webpack": "^3.0.5",
-    "less": "^2.4.0",
-    "less-loader": "^2.2.2",
+    "karma-webpack": "^4.0.2",
+    "less": "^4.1.3",
+    "less-loader": "^6.0.0",
     "memory-fs": "^0.3.0",
     "node-libs-browser": "^1.0.0",
     "phantomjs-prebuilt": "^2.1.11",
@@ -171,11 +170,11 @@
     "sinon": "^1.17.2",
     "sinon-chai": "^2.7.0",
     "style-loader": "^0.23.1",
-    "template-html-loader": "^0.0.4",
+    "template-html-loader": "^1.0.0",
     "then-jade": "^2.4.1",
-    "url-loader": "^0.6.2",
-    "webpack": "^3.1.0",
-    "webpack-dev-server": "^2.11.5"
+    "url-loader": "^4.1.1",
+    "webpack": "^4.47.0",
+    "webpack-dev-server": "^3.11.3"
   },
   "engines": {
     "node": ">= 18.20.5"

res/app/control-panes/dashboard/navigation/navigation-controller.js

@@ -1,3 +1,7 @@
+//
+// Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 var _ = require('lodash')
 
 module.exports = function NavigationCtrl($scope, $rootScope) {
@@ -11,7 +15,7 @@ module.exports = function NavigationCtrl($scope, $rootScope) {
   }
 
   function resetFavicon() {
-    $scope.urlFavicon = require('./default-favicon.png')
+    $scope.urlFavicon = require('./default-favicon.png').default
     faviconIsSet = false
   }
 

res/app/views/index.pug

@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
   head
@@ -27,5 +31,4 @@ html(ng-app='app')
           div(ng-view).fill-height
 
     script(src='/app/api/v1/state.js')
-    script(src='static/app/build/entry/commons.entry.js')
     script(src='static/app/build/entry/app.entry.js')

res/auth/ldap/views/index.pug

@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
   head
@@ -7,5 +11,4 @@ html(ng-app='app')
     meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui')
   body(ng-cloak)
     div(ng-view)
-    script(src='static/app/build/entry/commons.entry.js')
     script(src='static/app/build/entry/authldap.entry.js')

res/auth/mock/views/index.pug

@@ -1,3 +1,7 @@
+//
+  Copyright © 2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+//
+
 doctype html
 html(ng-app='app')
   head
@@ -7,5 +11,4 @@ html(ng-app='app')
     meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui')
   body(ng-cloak)
     div(ng-view)
-    script(src='static/app/build/entry/commons.entry.js')
     script(src='static/app/build/entry/authmock.entry.js')

webpack.config.js

@@ -1,5 +1,5 @@
 //
-// Copyright © 2022 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
+// Copyright © 2022-2024 contains code contributed by Orange SA, authors: Denis Barbaron - Licensed under the Apache license 2.0
 //
 
 var _ = require('lodash')
@@ -10,7 +10,12 @@ var log = require('./lib/util/logger').createLogger('webpack:config')
 
 module.exports = {
   webpack: {
-    context: __dirname
+    mode: 'none'
+    , performance: {
+        hints: false
+      , maxAssetSize: 512000
+      }
+    , context: __dirname
     , cache: true
     , entry: {
         app: pathutil.resource('app/app.js')
@@ -34,59 +39,57 @@ module.exports = {
           , 'node_modules'
         ]
         , descriptionFiles: ['package.json', 'bower.json']
-        , moduleExtensions: ['-loader']
         , extensions: ['.js', '.json']
-        , enforceModuleExtension: false
         , alias: {
             'angular-bootstrap': 'angular-bootstrap/ui-bootstrap-tpls'
             , localforage: 'localforage/dist/localforage.js'
-            , 'socket.io': 'socket.io-client'
             , stats: 'stats.js/src/Stats.js'
             , 'underscore.string': 'underscore.string/index'
         }
     }
     , module: {
-        loaders: [
-          {test: /\.css$/, loader: 'style-loader!css-loader'}
-          , {test: /\.scss$/, loader: 'style-loader!css-loader!sass-loader'}
-          , {test: /\.less$/, loader: 'style-loader!css-loader!less-loader'}
-          , {test: /\.json$/, loader: 'json-loader'}
-          , {test: /\.jpg$/, loader: 'url-loader?limit=1000&mimetype=image/jpeg'}
-          , {test: /\.png$/, loader: 'url-loader?limit=1000&mimetype=image/png'}
-          , {test: /\.gif$/, loader: 'url-loader?limit=1000&mimetype=image/gif'}
-          , {test: /\.svg/, loader: 'url-loader?limit=1&mimetype=image/svg+xml'}
-          , {test: /\.woff/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.otf/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.ttf/, loader: 'url-loader?limit=1&mimetype=application/font-woff'}
-          , {test: /\.eot/, loader: 'url-loader?limit=1&mimetype=vnd.ms-fontobject'}
-          , {test: /\.pug$/, loader: 'template-html-loader?engine=jade'}
-          , {test: /\.html$/, loader: 'html-loader'}
-          , {test: /angular\.js$/, loader: 'exports-loader?angular'}
-          , {test: /angular-cookies\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-route\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-touch\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-animate\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /angular-growl\.js$/, loader: 'imports-loader?angular=angular'}
-          , {test: /dialogs\.js$/, loader: 'script-loader'}
+        rules: [
+          {test: /\.css$/i, use: ['style-loader', 'css-loader']}
+          , {test: /\.scss$/i, use: ['style-loader', 'css-loader', 'sass-loader']}
+          , {test: /\.less$/i, use: ['style-loader', 'css-loader', 'less-loader']}
+          , {test: /\.(jpg|png|gif)$/i, use: [{loader: 'url-loader', options: {limit: 1000}}]}
+          , {test: /\.svg/i
+            , use: [{loader: 'url-loader', options: {limit: 1, mimetype: 'image/svg+xml'}}]}
+          , {test: /\.eot$/i
+            , use: [{loader: 'url-loader', options: {limit: 1, mimetype: 'vnd.ms-fontobject'}}]}
+          , {test: /\.(woff|otf|ttf)/i
+            , use: [{loader: 'url-loader', options: {limit: '1', mimetype: 'vnd.ms-fontobject'}}]}
+          , {test: /\.pug$/i
+            , use: [{loader: 'template-html-loader', options: {engine: 'jade'}}]}
+          , {test: /\.html$/i, loader: 'html-loader'}
+          , {test: /angular\.js$/i
+            , use: [{loader: 'exports-loader', options: {type: 'commonjs', exports: 'angular'}}]}
+          , {test: /angular-cookies\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-route\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-touch\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-animate\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /angular-growl\.js$/i
+            , use: [{loader: 'imports-loader', options: {imports: 'angular'}}]}
+          , {test: /dialogs\.js$/, use: [{loader: 'script-loader'}]}
         ]
     }
     , plugins: [
-        new webpack.optimize.CommonsChunkPlugin({
-          name: 'commons.entry'
-          , filename: 'entry/commons.entry.js'
-        })
-        , new ProgressPlugin(_.throttle(
-            function(progress, message) {
-              var msg
-              if (message) {
-                msg = message
-              }
-              else {
-                msg = progress >= 1 ? 'complete' : 'unknown'
-              }
-              log.info('Build progress %d%% (%s)', Math.floor(progress * 100), msg)
+        new ProgressPlugin(_.throttle(
+          function(progress, message) {
+            var msg
+            if (message) {
+              msg = message
             }
-            , 1000
+            else {
+              msg = progress >= 1 ? 'complete' : 'unknown'
+            }
+            log.info('Build progress %d%% (%s)', Math.floor(progress * 100), msg)
+          }
+          , 1000
         ))
     ]
   }
@@ -95,10 +98,6 @@ module.exports = {
         new webpack.LoaderOptionsPlugin({
           debug: true
         })
-        , new webpack.optimize.CommonsChunkPlugin({
-            name: 'commons.entry'
-            , filename: 'entry/commons.entry.js'
-        })
       ]
       , devtool: 'eval'
       , stats: {