Remove global lodash

karma.conf.js

@@ -11,6 +11,7 @@ module.exports = function(config) {
       { pattern: 'dist/*.css.map', included: false },
       { pattern: "dist/icons.js", served: true },
       { pattern: "dist/emojis.js", served: true },
+      "node_modules/lodash/lodash.min.js",
       "dist/converse.js",
       "dist/converse.css",
       { pattern: "dist/images/**/*.*", included: false },

package-lock.json

@@ -2869,6 +2869,7 @@
 		"@converse/skeletor": {
 			"version": "github:conversejs/skeletor#56a284bd36a07977d69c08d78e7c8c0fc9fc5c87",
 			"from": "github:conversejs/skeletor#56a284bd36a07977d69c08d78e7c8c0fc9fc5c87",
+			"dev": true,
 			"requires": {
 				"lit-html": "^1.2.1",
 				"lodash-es": "^4.17.15"
@@ -5798,6 +5799,19 @@
 				"object.assign": "^4.1.0"
 			}
 		},
+		"babel-plugin-lodash": {
+			"version": "3.3.4",
+			"resolved": "https://registry.npmjs.org/babel-plugin-lodash/-/babel-plugin-lodash-3.3.4.tgz",
+			"integrity": "sha512-yDZLjK7TCkWl1gpBeBGmuaDIFhZKmkoL+Cu2MUUjv5VxUZx/z7tBGBCBcQs5RI1Bkz5LLmNdjx7paOyQtMovyg==",
+			"dev": true,
+			"requires": {
+				"@babel/helper-module-imports": "^7.0.0-beta.49",
+				"@babel/types": "^7.0.0-beta.49",
+				"glob": "^7.1.1",
+				"lodash": "^4.17.10",
+				"require-package-name": "^2.0.1"
+			}
+		},
 		"babel-runtime": {
 			"version": "6.26.0",
 			"resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
@@ -9620,12 +9634,6 @@
 			"integrity": "sha512-dtm4QZH9nZtcDt8qJiOH9fcQd1NAgi+K1O2DbE6GG1PPCK/BWfOH3idCTRQ4ImXRUOyopDEgDEnVEE7Y/2Wrig==",
 			"dev": true
 		},
-		"fastparse": {
-			"version": "1.1.2",
-			"resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz",
-			"integrity": "sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==",
-			"dev": true
-		},
 		"fastq": {
 			"version": "1.9.0",
 			"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.9.0.tgz",
@@ -13308,7 +13316,8 @@
 		"lit-html": {
 			"version": "1.2.1",
 			"resolved": "https://registry.npmjs.org/lit-html/-/lit-html-1.2.1.tgz",
-			"integrity": "sha512-GSJHHXMGLZDzTRq59IUfL9FCdAlGfqNp/dEa7k7aBaaWD+JKaCjsAk9KYm2V12ItonVaYx2dprN66Zdm1AuBTQ=="
+			"integrity": "sha512-GSJHHXMGLZDzTRq59IUfL9FCdAlGfqNp/dEa7k7aBaaWD+JKaCjsAk9KYm2V12ItonVaYx2dprN66Zdm1AuBTQ==",
+			"dev": true
 		},
 		"load-json-file": {
 			"version": "5.3.0",
@@ -13384,31 +13393,6 @@
 			"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.20.tgz",
 			"integrity": "sha512-JD1COMZsq8maT6mnuz1UMV0jvYD0E0aUsSOdrr1/nAG3dhqQXwRRgeW0cSqH1U43INKcqxaiVIQNOUDld7gRDA=="
 		},
-		"lodash-template-webpack-loader": {
-			"version": "github:jcbrand/lodash-template-webpack-loader#258c095ab22130dfde454fa59ee0986f302bb733",
-			"from": "github:jcbrand/lodash-template-webpack-loader",
-			"dev": true,
-			"requires": {
-				"fastparse": "^1.1.1",
-				"loader-utils": "^0.2.11",
-				"lodash": "^4.11.1",
-				"source-map": "^0.5.6"
-			},
-			"dependencies": {
-				"loader-utils": {
-					"version": "0.2.17",
-					"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-					"integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=",
-					"dev": true,
-					"requires": {
-						"big.js": "^3.1.3",
-						"emojis-list": "^2.0.0",
-						"json5": "^0.5.0",
-						"object-assign": "^4.0.1"
-					}
-				}
-			}
-		},
 		"lodash._reinterpolate": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
@@ -20721,6 +20705,12 @@
 			"integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
 			"dev": true
 		},
+		"require-package-name": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/require-package-name/-/require-package-name-2.0.1.tgz",
+			"integrity": "sha1-wR6XJ2tluOKSP3Xav1+y7ww4Qbk=",
+			"dev": true
+		},
 		"requires-port": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",

package.json

@@ -71,10 +71,12 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/preset-env": "^7.12.7",
     "@converse/headless": "file:src/headless",
+    "@converse/skeletor": "conversejs/skeletor#56a284bd36a07977d69c08d78e7c8c0fc9fc5c87",
     "@fortawesome/fontawesome-free": "5.14.0",
     "autoprefixer": "^9.8.6",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",
+    "babel-plugin-lodash": "^3.3.4",
     "bootstrap": "^4.3.1",
     "bootstrap.native": "^2.0.27",
     "bootstrap.native-loader": "2.0.0",
@@ -105,7 +107,6 @@
     "lerna": "^3.22.1",
     "lit-element": "^2.4.0",
     "lit-html": "^1.2.1",
-    "lodash-template-webpack-loader": "jcbrand/lodash-template-webpack-loader",
     "mini-css-extract-plugin": "^0.9.0",
     "minimist": "^1.2.3",
     "node-sass": "^4.14.1",

spec/bookmarks.js

-/* global mock, converse */
+/* global mock, converse, _ */
 
 const { Strophe, u, sizzle, $iq } = converse.env;
 
@@ -136,7 +136,7 @@ describe("A chat room", function () {
             ['rosterGroupsFetched'], {},
             async function (done, _converse) {
 
-        const { u, _ } = converse.env;
+        const { u } = converse.env;
         await mock.waitUntilDiscoConfirmed(
             _converse, _converse.bare_jid,
             [{'category': 'pubsub', 'type': 'pep'}],

spec/chatbox.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const _ = converse.env._;
 const $msg = converse.env.$msg;
 const Strophe = converse.env.Strophe;
 const u = converse.env.utils;

spec/controlbox.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const _ = converse.env._;
 const $msg = converse.env.$msg;
 const u = converse.env.utils;
 const Strophe = converse.env.Strophe;

spec/headline.js

-/*global mock */
+/*global mock, converse, _ */
 
 describe("A headlines box", function () {
 
@@ -147,7 +147,7 @@ describe("A headlines box", function () {
         mock.initConverse(
             ['rosterGroupsFetched', 'chatBoxesFetched'], {}, function (done, _converse) {
 
-        const { $msg, _ } = converse.env;
+        const { $msg } = converse.env;
         _converse.allow_non_roster_messaging = false;
         const stanza = $msg({
                 'type': 'headline',

spec/http-file-upload.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
 const Strophe = converse.env.Strophe;
 const $iq = converse.env.$iq;
-const _ = converse.env._;
 const sizzle = converse.env.sizzle;
 const u = converse.env.utils;
 

spec/messages.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const { Promise, Strophe, $msg, dayjs, sizzle, _ } = converse.env;
+const { Promise, Strophe, $msg, dayjs, sizzle } = converse.env;
 const u = converse.env.utils;
 
 

spec/modtools.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const _ = converse.env._;
 const $iq = converse.env.$iq;
 const $pres = converse.env.$pres;
 const sizzle = converse.env.sizzle;

spec/muc.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const _ = converse.env._;
 const $pres = converse.env.$pres;
 const $iq = converse.env.$iq;
 const $msg = converse.env.$msg;

spec/notification.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const { Strophe, _ } = converse.env;
+const { Strophe } = converse.env;
 const $msg = converse.env.$msg;
 const u = converse.env.utils;
 

spec/omemo.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const { $iq, $pres, $msg, _, omemo, Strophe } = converse.env;
+const { $iq, $pres, $msg, omemo, Strophe } = converse.env;
 const u = converse.env.utils;
 
 async function deviceListFetched (_converse, jid) {

spec/push.js

-/*global mock */
+/*global mock, converse, _ */
 
 const $iq = converse.env.$iq;
 const Strophe = converse.env.Strophe;
-const _ = converse.env._;
 const sizzle = converse.env.sizzle;
 const u = converse.env.utils;
 const original_timeout = jasmine.DEFAULT_TIMEOUT_INTERVAL;

spec/receipts.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
-const { Promise, Strophe, $msg, sizzle, _ } = converse.env;
+const { Promise, Strophe, $msg, sizzle } = converse.env;
 const u = converse.env.utils;
 
 

spec/register.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
 const Strophe = converse.env.Strophe;
 const $iq = converse.env.$iq;
-const { _, sizzle}  = converse.env;
+const { sizzle}  = converse.env;
 const u = converse.env.utils;
 
 describe("The Registration Panel", function () {

spec/room_registration.js

-/*global mock */
+/*global mock, converse, _ */
 
-const _ = converse.env._,
-      $iq = converse.env.$iq,
+const $iq = converse.env.$iq,
       Strophe = converse.env.Strophe,
       sizzle = converse.env.sizzle,
       u = converse.env.utils;

spec/roster.js

-/*global mock, converse */
+/*global mock, converse, _ */
 
 const $iq = converse.env.$iq;
 const $pres = converse.env.$pres;
 const Strophe = converse.env.Strophe;
-const _ = converse.env._;
 const sizzle = converse.env.sizzle;
 const u = converse.env.utils;
 

src/components/emoji-picker.js

 import "./emoji-picker-content.js";
 import DOMNavigator from "../shared/dom-navigator";
+import debounce from 'lodash/debounce';
 import { BaseDropdown } from "./dropdown.js";
 import { CustomElement } from './element.js';
 import { __ } from '../i18n';
 import { _converse, api, converse } from "@converse/headless/core";
-import { debounce } from "lodash-es";
 import { html } from "lit-element";
 import { tpl_emoji_picker } from "../templates/emoji_picker.js";
 import { until } from 'lit-html/directives/until.js';

src/components/font-awesome.js

 import { CustomElement } from './element.js';
-import { html } from "lit-element";
-import { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';
-import { until } from 'lit-html/directives/until.js';
-
+import tpl_icons from 'templates/icons.js';
 
 export class FontAwesome extends CustomElement {
-
-    constructor () {
-        super();
-        const promise = import(/*webpackChunkName: "icons" */ '../../images/icons.svg');
-        this.data = promise.then(d => html`${unsafeSVG(d.default())}`);
-    }
-
     render () {  // eslint-disable-line class-methods-use-this
-        return html`${until(this.data, '')}`;
+        return tpl_icons();
     }
 }
 

src/converse.js

@@ -4,8 +4,6 @@
  * @license Mozilla Public License (MPLv2)
  */
 
-import _ from './lodash.noconflict';
-
 import "@converse/headless/headless";
 import "i18n";
 import "shared/registry.js";
@@ -60,20 +58,6 @@ const WHITELISTED_PLUGINS = [
     'converse-singleton'
 ];
 
-// Use Mustache style syntax for variable interpolation
-/* Configuration of Lodash templates (this config is distinct to the
- * config of requirejs-tpl in main.js). This one is for normal inline templates.
- */
-_.templateSettings = {
-    'escape': /\{\{\{([\s\S]+?)\}\}\}/g,
-    'evaluate': /\{\[([\s\S]+?)\]\}/g,
-    'interpolate': /\{\{([\s\S]+?)\}\}/g,
-    'imports': { '_': _ }
-};
-
-converse.env._ = _;
-
-
 const initialize = converse.initialize;
 
 converse.initialize = function (settings, callback) {

src/headless/shared/connection.js

+import debounce from 'lodash/debounce';
+import isElement from 'lodash/isElement';
 import log from "../log.js";
 import sizzle from 'sizzle';
 import u from '@converse/headless/utils/core';
 import { Strophe } from 'strophe.js/src/core';
 import { _converse, api, clearSession, tearDown } from "../core.js";
-import { debounce, isElement } from 'lodash';
 
 
 const BOSH_WAIT = 59;

src/headless/shared/rsm.js

@@ -7,7 +7,7 @@
  *   Copyright 2006-2017 Strophe (https://github.com/strophe/strophejs)
  */
 import { _converse, converse } from "../core.js";
-import { pick } from 'lodash-es'
+import pick from 'lodash/pick';
 
 const { Strophe, $build } = converse.env;
 

src/lodash.noconflict.js

-define(['lodash'], function (_) {
-    return _.noConflict();
-});

src/templates/chatroom_bookmark_toggle.html

-<a class="chatbox-btn toggle-bookmark fa fa-bookmark
-   {[ if (o.bookmarked) {]} button-on {[ } ]}" title="{{{o.info_toggle_bookmark}}}"></a>

src/templates/chatroom_dragresize.html

-<div class="dragresize dragresize-top"></div>
-<div class="dragresize dragresize-topleft"></div>
-<div class="dragresize dragresize-left"></div>

src/templates/search_contact.html

-<li>
-    <form class="search-xmpp-contact">
-        <input type="text"
-            name="identifier"
-            class="username"
-            placeholder="{{{o.label_contact_name}}}"/>
-        <button type="submit">{{{o.label_search}}}</button>
-    </form>
-</li>

src/templates/status_option.html

-<li>
-    <a href="#" class="{{{ o.value }}}" data-value="{{{ o.value }}}">
-        <span class="icon-{{{ o.value }}}"></span>
-        {{{ o.text }}}
-    </a>
-</li>

src/templates/toolbar_fileupload.html

-<li class="upload-file">
-    <a class="fa fa-paperclip" title="{{{o.tooltip_upload_file}}}"></a>
-    <input type="file" class="fileupload" multiple="" style="display:none"/>
-</li> 

webpack.common.js

 /* global __dirname, module, process */
 const path = require('path');
+
 let bootstrap_ignore_modules = ['carousel', 'scrollspy'];
 
 const BOOTSTRAP_IGNORE_MODULES = (process.env.BOOTSTRAP_IGNORE_MODULES || '').replace(/ /g, '').trim();
@@ -101,6 +102,7 @@ module.exports = {
                         }]
                     ],
                     plugins: [
+                        'lodash',
                         '@babel/plugin-proposal-class-properties',
                         '@babel/plugin-proposal-nullish-coalescing-operator',
                         '@babel/plugin-proposal-optional-chaining',