ESLint: enable prefer-template rule (#37484)

9 files changed, 9 insertions, 8 deletions

diff --git a/.eslintrc.json b/.eslintrc.json
index d8e83a8d2e..b632124b37 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -46,6 +46,7 @@
       "error",
       "after"
     ],
+    "prefer-template": "error",
     "semi": [
       "error",
       "never"
diff --git a/build/build-plugins.js b/build/build-plugins.js
index 89fbe1d720..b6ce58df84 100644
--- a/build/build-plugins.js
+++ b/build/build-plugins.js
@@ -16,7 +16,7 @@ const { babel } = require('@rollup/plugin-babel')
 const banner = require('./banner.js')
 
 const sourcePath = path.resolve(__dirname, '../js/src/').replace(/\\/g, '/')
-const jsFiles = globby.sync(sourcePath + '/**/*.js')
+const jsFiles = globby.sync(`${sourcePath}/**/*.js`)
 
 // Array which holds the resolved plugins
 const resolvedPlugins = []
diff --git a/js/src/util/index.js b/js/src/util/index.js
index b04fdc1201..b3e577b10b 100644
--- a/js/src/util/index.js
+++ b/js/src/util/index.js
@@ -17,7 +17,7 @@ const TRANSITION_END = 'transitionend'
 const parseSelector = selector => {
   if (selector && window.CSS && window.CSS.escape) {
     // document.querySelector needs escaping to handle IDs (html5+) containing for instance /
-    selector = selector.replace(/#([^\s"#']+)/g, (match, id) => '#' + CSS.escape(id))
+    selector = selector.replace(/#([^\s"#']+)/g, (match, id) => `#${CSS.escape(id)}`)
   }
 
   return selector
diff --git a/js/tests/karma.conf.js b/js/tests/karma.conf.js
index 6636ff15d5..11c6f30451 100644
--- a/js/tests/karma.conf.js
+++ b/js/tests/karma.conf.js
@@ -105,7 +105,7 @@ if (BROWSERSTACK) {
   config.browserStack = {
     username: ENV.BROWSER_STACK_USERNAME,
     accessKey: ENV.BROWSER_STACK_ACCESS_KEY,
-    build: `bootstrap-${ENV.GITHUB_SHA ? ENV.GITHUB_SHA.slice(0, 7) + '-' : ''}${new Date().toISOString()}`,
+    build: `bootstrap-${ENV.GITHUB_SHA ? `${ENV.GITHUB_SHA.slice(0, 7)}-` : ''}${new Date().toISOString()}`,
     project: 'Bootstrap',
     retryLimit: 2
   }
diff --git a/js/tests/unit/collapse.spec.js b/js/tests/unit/collapse.spec.js
index 834d1b98e4..d5af724fe2 100644
--- a/js/tests/unit/collapse.spec.js
+++ b/js/tests/unit/collapse.spec.js
@@ -897,7 +897,7 @@ describe('Collapse', () => {
         const trigger2 = fixtureEl.querySelector('#trigger2')
         const trigger3 = fixtureEl.querySelector('#trigger3')
         const target1 = fixtureEl.querySelector('#test1')
-        const target2 = fixtureEl.querySelector('#' + CSS.escape('0/my/id'))
+        const target2 = fixtureEl.querySelector(`#${CSS.escape('0/my/id')}`)
 
         const target2Shown = () => {
           expect(trigger1).not.toHaveClass('collapsed')
diff --git a/js/tests/unit/tab.spec.js b/js/tests/unit/tab.spec.js
index 66238efbb8..1ac5929e17 100644
--- a/js/tests/unit/tab.spec.js
+++ b/js/tests/unit/tab.spec.js
@@ -207,7 +207,7 @@ describe('Tab', () => {
       const tab = new Tab(profileTriggerEl)
 
       profileTriggerEl.addEventListener('shown.bs.tab', () => {
-        expect(fixtureEl.querySelector('#' + CSS.escape('2'))).toHaveClass('active')
+        expect(fixtureEl.querySelector(`#${CSS.escape('2')}`)).toHaveClass('active')
         done()
       })
 
diff --git a/js/tests/unit/util/config.spec.js b/js/tests/unit/util/config.spec.js
index e1693c0c1f..0037e09d78 100644
--- a/js/tests/unit/util/config.spec.js
+++ b/js/tests/unit/util/config.spec.js
@@ -128,7 +128,7 @@ describe('Config', () => {
       const obj = new DummyConfigClass()
       expect(() => {
         obj._typeCheckConfig(config)
-      }).toThrowError(TypeError, obj.constructor.NAME.toUpperCase() + ': Option "parent" provided type "number" but expected type "(string|element)".')
+      }).toThrowError(TypeError, `${obj.constructor.NAME.toUpperCase()}: Option "parent" provided type "number" but expected type "(string|element)".`)
     })
 
     it('should return null stringified when null is passed', () => {
diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html
index 153c866042..1b2de52913 100644
--- a/js/tests/visual/carousel.html
+++ b/js/tests/visual/carousel.html
@@ -55,7 +55,7 @@
       // Test to show that transition-duration can be changed with css
       carousel.addEventListener('slid.bs.carousel', event => {
         t1 = performance.now()
-        console.log('transition-duration took ' + (t1 - t0) + 'ms, slid at ' + event.timeStamp)
+        console.log(`transition-duration took ${t1 - t0}ms, slid at ${event.timeStamp}`)
       })
       carousel.addEventListener('slide.bs.carousel', () => {
         t0 = performance.now()
diff --git a/js/tests/visual/modal.html b/js/tests/visual/modal.html
index b738d9e81b..09d42333d8 100644
--- a/js/tests/visual/modal.html
+++ b/js/tests/visual/modal.html
@@ -264,7 +264,7 @@
 
       slowModal.addEventListener('shown.bs.modal', () => {
         t1 = performance.now()
-        console.log('transition-duration took ' + (t1 - t0) + 'ms.')
+        console.log(`transition-duration took ${t1 - t0}ms.`)
       })
 
       slowModal.addEventListener('show.bs.modal', () => {