Use template literals instead of concatenation (#33497)

rohit2sharma95 · web-flow · commit 5cc53a0ef071 · 2021-03-30T08:57:05.000+03:00
diff --git a/js/src/modal.js b/js/src/modal.js
@@ -474,7 +474,7 @@ class Modal extends BaseComponent {
         const actualValue = element.style[styleProp]
         const calculatedValue = window.getComputedStyle(element)[styleProp]
         Manipulator.setDataAttribute(element, styleProp, actualValue)
-        element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'
+        element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
       })
   }
 
diff --git a/js/src/util/index.js b/js/src/util/index.js
@@ -48,7 +48,7 @@ const getSelector = element => {
 
     // Just in case some CMS puts out a full URL with the anchor appended
     if (hrefAttr.includes('#') && !hrefAttr.startsWith('#')) {
-      hrefAttr = '#' + hrefAttr.split('#')[1]
+      hrefAttr = `#${hrefAttr.split('#')[1]}`
     }
 
     selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : null
@@ -128,9 +128,7 @@ const typeCheckConfig = (componentName, config, configTypes) => {
 
     if (!new RegExp(expectedTypes).test(valueType)) {
       throw new TypeError(
-        `${componentName.toUpperCase()}: ` +
-        `Option "${property}" provided type "${valueType}" ` +
-        `but expected type "${expectedTypes}".`
+        `${componentName.toUpperCase()}: Option "${property}" provided type "${valueType}" but expected type "${expectedTypes}".`
       )
     }
   })
diff --git a/js/src/util/scrollbar.js b/js/src/util/scrollbar.js
@@ -35,7 +35,7 @@ const _setElementAttributes = (selector, styleProp, callback) => {
       const actualValue = element.style[styleProp]
       const calculatedValue = window.getComputedStyle(element)[styleProp]
       Manipulator.setDataAttribute(element, styleProp, actualValue)
-      element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'
+      element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
     })
 }
 

Original file line number	Diff line number	Diff line change
`@@ -474,7 +474,7 @@ class Modal extends BaseComponent {`
`474`	`474`	`const actualValue = element.style[styleProp]`
`475`	`475`	`const calculatedValue = window.getComputedStyle(element)[styleProp]`
`476`	`476`	`Manipulator.setDataAttribute(element, styleProp, actualValue)`
`477`		`- element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'`
	`477`	+ element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
`478`	`478`	`})`
`479`	`479`	`}`
`480`	`480`
Original file line number	Diff line number	Diff line change
`@@ -48,7 +48,7 @@ const getSelector = element => {`
`48`	`48`
`49`	`49`	`// Just in case some CMS puts out a full URL with the anchor appended`
`50`	`50`	`if (hrefAttr.includes('#') && !hrefAttr.startsWith('#')) {`
`51`		`- hrefAttr = '#' + hrefAttr.split('#')[1]`
	`51`	+ hrefAttr = `#${hrefAttr.split('#')[1]}`
`52`	`52`	`}`
`53`	`53`
`54`	`54`	`selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : null`
`@@ -128,9 +128,7 @@ const typeCheckConfig = (componentName, config, configTypes) => {`
`128`	`128`
`129`	`129`	`if (!new RegExp(expectedTypes).test(valueType)) {`
`130`	`130`	`throw new TypeError(`
`131`		- `${componentName.toUpperCase()}: ` +
`132`		- `Option "${property}" provided type "${valueType}" ` +
`133`		- `but expected type "${expectedTypes}".`
	`131`	+ `${componentName.toUpperCase()}: Option "${property}" provided type "${valueType}" but expected type "${expectedTypes}".`
`134`	`132`	`)`
`135`	`133`	`}`
`136`	`134`	`})`
Original file line number	Diff line number	Diff line change
`@@ -35,7 +35,7 @@ const _setElementAttributes = (selector, styleProp, callback) => {`
`35`	`35`	`const actualValue = element.style[styleProp]`
`36`	`36`	`const calculatedValue = window.getComputedStyle(element)[styleProp]`
`37`	`37`	`Manipulator.setDataAttribute(element, styleProp, actualValue)`
`38`		`- element.style[styleProp] = callback(Number.parseFloat(calculatedValue)) + 'px'`
	`38`	+ element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
`39`	`39`	`})`
`40`	`40`	`}`
`41`	`41`