fix: check document presence on ssr

src/js/plugins/backToTop.js

@@ -58,7 +58,7 @@ class BackToTop extends BaseComponent {
   }
 
   toggleShow() {
-    if (document.scrollingElement.scrollTop > this._config.scrollLimit) {
+    if (typeof document !== 'undefined' && document.scrollingElement.scrollTop > this._config.scrollLimit) {
       this.show()
     } else {
       this.hide()

src/js/plugins/cookiebar.js

@@ -110,6 +110,9 @@ class Cookiebar extends BaseComponent {
   }*/
 
   static clearCookie() {
+    if (typeof document === 'undefined') {
+      return
+    }
     document.cookie = COOKIE_NAME + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'
   }
 
@@ -149,6 +152,9 @@ class Cookiebar extends BaseComponent {
     var exdate = new Date()
     exdate.setDate(exdate.getDate() + COOKIE_EXPIRE)
     var c_value = escape(COOKIE_VALUE) + (COOKIE_EXPIRE == null ? '' : '; expires=' + exdate.toUTCString())
+    if (typeof document === 'undefined') {
+      return
+    }
     document.cookie = COOKIE_NAME + '=' + c_value + '; path=/; SameSite=Strict'
   }
 
@@ -229,6 +235,9 @@ class Cookiebar extends BaseComponent {
   }
 
   static _getCookieEU() {
+    if (typeof document === 'undefined') {
+      return
+    }
     var i,
       x,
       y,
@@ -270,6 +279,9 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_ACCEPT, function (event
 EventHandler.on(window, EVENT_LOAD_DATA_API, function () {
   const consent = Cookiebar._getCookieEU()
   if (!consent) {
+    if (typeof document === 'undefined') {
+      return
+    }
     const cookiebars = document.querySelectorAll(SELECTOR_COOKIE_BAR)
     cookiebars.forEach((bar) => {
       const instance = Cookiebar.getOrCreateInstance(bar)

src/js/plugins/fonts-loader.js

@@ -1,5 +1,8 @@
 // Create our stylesheet
 export default (path = '/node_modules/bootstrap-italia/dist/fonts') => {
+  if (typeof document === 'undefined') {
+    return
+  }
   const styleNode = document.createElement('style')
   const __PUBLIC_PATH__ = window.__PUBLIC_PATH__ ? window.__PUBLIC_PATH__ : path
   styleNode.innerHTML = `

src/js/plugins/form-validate.js

@@ -112,17 +112,8 @@ class FormValidate {
       if (legend) {
         legend.setAttribute('aria-describedby', errIds.join(' '))
         legend.setAttribute('aria-invalid', 'true')
-
-        //not needed anymore
-        /*const span = document.createElement('span')
-        span.classList.add('sr-only')
-        span.classList.add(CLASS_NAME_SRONLY)
-        span.textContent = errTexts.join(' ')
-        legend.append(span)*/
       }
-    } /*else {
-      console.warn('[JustValidateIt] the element is invalid but no error message was found', { target })
-    }*/
+    }
   }
   /**
    * Removes the fieldset ARIA attributes

src/js/plugins/input-number.js

@@ -1,7 +1,6 @@
 import BaseComponent from 'bootstrap/js/src/base-component'
 import EventHandler from 'bootstrap/js/src/dom/event-handler'
 import SelectorEngine from 'bootstrap/js/src/dom/selector-engine'
-//import Manipulator from 'bootstrap/js/src/dom/manipulator'
 
 import InputLabel from './input-label'
 
@@ -14,11 +13,9 @@ const EVENT_CLICK = `click${EVENT_KEY}`
 const EVENT_CHANGE = `change${EVENT_KEY}`
 const EVENT_INPUT = `input`
 
-//const EVENT_FOCUS_DATA_API = `focus${EVENT_KEY}${DATA_API_KEY}`
 const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
 
 const CLASS_NAME_ADAPTIVE = 'input-number-adaptive'
-//const CLASS_NAME_INCREMENT = 'input-number-add'
 const CLASS_NAME_DECREMENT = 'input-number-sub'
 
 const SELECTOR_WRAPPER = '.input-number'
@@ -69,14 +66,10 @@ class InputNumber extends BaseComponent {
   _inputResize() {
     if (this._wrapperElement.classList.contains(CLASS_NAME_ADAPTIVE)) {
       let newWidth = null
-      //let newWidthIE = null
-      //74px - buttons (30px) and possible validation icon (40px)
       newWidth = 'calc(70px + ' + this._element.value.length + 'ch)'
-      //newWidthIE = 'calc(44px + (1.5 * ' + this._element.value.length + 'ch))'
 
       if (newWidth) {
         this._element.style.width = newWidth
-        //IE - this._element.style.width = calcIe
       }
     }
   }
@@ -127,58 +120,30 @@ class InputNumber extends BaseComponent {
  * ------------------------------------------------------------------------
  */
 
-/*const inputs = SelectorEngine.find(SELECTOR_INPUT)
-inputs.forEach((input) => {
-  EventHandler.one(input, EVENT_FOCUS_DATA_API, (evt) => {
-    evt.preventDefault()
-    InputNumber.getOrCreateInstance(input)
-    EventHandler.trigger(input, 'focus')
-  })
-})
-
-const inputsButtons = SelectorEngine.find(SELECTOR_WRAPPER + ' ' + SELECTOR_BTN)
-inputsButtons.forEach((button) => {
-  EventHandler.one(button, EVENT_CLICK_DATA_API, (evt) => {
-    if (button.classList.contains(CLASS_NAME_INCREMENT) || button.classList.contains(CLASS_NAME_DECREMENT)) {
-      const wrapper = button.closest(SELECTOR_WRAPPER)
-      if (wrapper) {
-        const input = SelectorEngine.findOne(SELECTOR_INPUT, wrapper)
-        if (input) {
-          const inputNumber = InputNumber.getInstance(input)
-          if (!inputNumber) {
-            evt.preventDefault()
-            InputNumber.getOrCreateInstance(input)
-            EventHandler.trigger(button, 'click')
-          }
-        }
-      }
-    }
-  })
-})*/
-
 const createInput = (element) => {
   if (element && element.matches(SELECTOR_INPUT) && element.parentNode.querySelector(SELECTOR_BTN)) {
     return InputNumber.getOrCreateInstance(element)
   }
   return null
 }
 
-document.addEventListener('DOMContentLoaded', function () {
-  var frmel = document.querySelectorAll(SELECTOR_INPUT + ', label')
-  frmel.forEach(function (item) {
-    const target = InputLabel.getInputFromLabel(item) || item
-    createInput(target)
+if (typeof document !== 'undefined') {
+  document.addEventListener('DOMContentLoaded', function () {
+    var frmel = document.querySelectorAll(SELECTOR_INPUT + ', label')
+    frmel.forEach(function (item) {
+      const target = InputLabel.getInputFromLabel(item) || item
+      createInput(target)
+    })
   })
-})
-
-EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_BTN, function () {
-  const wrapper = this.closest(SELECTOR_WRAPPER)
-  if (wrapper) {
-    const input = SelectorEngine.findOne(SELECTOR_INPUT, wrapper)
-    if (input) {
-      InputNumber.getOrCreateInstance(input)
+  EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_BTN, function () {
+    const wrapper = this.closest(SELECTOR_WRAPPER)
+    if (wrapper) {
+      const input = SelectorEngine.findOne(SELECTOR_INPUT, wrapper)
+      if (input) {
+        InputNumber.getOrCreateInstance(input)
+      }
     }
-  }
-})
+  })
+}
 
 export default InputNumber

src/js/plugins/input-password.js

@@ -89,38 +89,6 @@ class InputPassword extends BaseComponent {
 
   _init() {
     if (this._meter) {
-      /*this._grayBarElement = document.createElement('div')
-      this._grayBarElement.classList.add('password-meter', 'progress', 'rounded-0', 'position-absolute')
-      this._grayBarElement.innerHTML = `<div class="row position-absolute w-100 m-0">
-          <div class="col-3 border-start border-end border-white"></div>
-          <div class="col-3 border-start border-end border-white"></div>
-          <div class="col-3 border-start border-end border-white"></div>
-          <div class="col-3 border-start border-end border-white"></div>
-        </div>`
-
-      this._colorBarElement = document.createElement('div')
-      this._colorBarElement.classList.add('progress-bar')
-      this._colorBarElement.setAttribute('role', 'progressbar')
-      this._colorBarElement.setAttribute('aria-valuenow', '0')
-      this._colorBarElement.setAttribute('aria-valuemin', '0')
-      this._colorBarElement.setAttribute('aria-valuemax', '100')
-
-      const wrapper = document.createElement('div')
-      wrapper.classList.add('password-strength-meter')
-
-      this._grayBarElement.appendChild(this._colorBarElement)
-
-      if (this._config.showText) {
-        this._textElement = document.createElement('small')
-        this._textElement.classList.add('form-text', 'text-muted')
-        this._textElement.innerHTML = this._config.enterPass
-        wrapper.appendChild(this._textElement)
-      }
-
-      wrapper.appendChild(this._grayBarElement)
-
-      this._element.parentNode.insertBefore(wrapper, this._element.nextSibling)*/
-
       this._grayBarElement = this._meter.querySelector(SELECTOR_METER_GRAYBAR)
       this._colorBarElement = this._meter.querySelector(SELECTOR_METER_COLBAR)
       this._textElement = this._meter.querySelector(SELECTOR_TEXT)
@@ -130,13 +98,6 @@ class InputPassword extends BaseComponent {
       }
     }
     if (this._isCustom) {
-      /*this._capsElement = document.createElement('small')
-      this._capsElement.style.display = 'none'
-      this._capsElement.classList.add('password-caps', 'form-text', 'text-warning', 'position-absolute', 'bg-white', 'w-100')
-      this._capsElement.innerHTML = this._config.alertCaps
-
-      this._element.parentNode.appendChild(this._capsElement)*/
-
       this._capsElement = this._element.parentNode.querySelector(SELECTOR_CAPS)
     }
 

src/js/plugins/input-search-autocomplete.js

@@ -88,6 +88,9 @@ class InputSearch extends BaseComponent {
 
   _init() {
     if (this._element.classList.contains(CLASS_NAME_AUTOCOMPLETE)) {
+      if (typeof document === 'undefined') {
+        return
+      }
       this._items = this._getItems()
       this._autocompleteElement = document.createElement('ul')
       this._autocompleteElement.classList.add('autocomplete-list')
@@ -100,6 +103,9 @@ class InputSearch extends BaseComponent {
   }
 
   _createOption(link, text, label, icon) {
+    if (typeof document === 'undefined') {
+      return
+    }
     const option = document.createElement('li')
     option.innerHTML = `<a href="${link}">
         ${icon}
@@ -134,12 +140,14 @@ const createInput = (element) => {
   return null
 }
 
-document.addEventListener('DOMContentLoaded', function () {
-  var frmel = document.querySelectorAll(SELECTOR_SEARCH + ', label')
-  frmel.forEach(function (item) {
-    const target = InputLabel.getInputFromLabel(item) || item
-    createInput(target)
+if (typeof document !== 'undefined') {
+  document.addEventListener('DOMContentLoaded', function () {
+    var frmel = document.querySelectorAll(SELECTOR_SEARCH + ', label')
+    frmel.forEach(function (item) {
+      const target = InputLabel.getInputFromLabel(item) || item
+      createInput(target)
+    })
   })
-})
+}
 
 export default InputSearch

src/js/plugins/input.js

@@ -80,12 +80,14 @@ const createInput = (element) => {
   return null
 }
 
-document.addEventListener('DOMContentLoaded', function () {
-  var frmel = document.querySelectorAll('input, textarea, label')
-  frmel.forEach(function (item) {
-    const target = InputLabel.getInputFromLabel(item) || item
-    createInput(target)
+if (typeof document !== 'undefined') {
+  document.addEventListener('DOMContentLoaded', function () {
+    var frmel = document.querySelectorAll('input, textarea, label')
+    frmel.forEach(function (item) {
+      const target = InputLabel.getInputFromLabel(item) || item
+      createInput(target)
+    })
   })
-})
+}
 
 export default Input

src/js/plugins/masonry.js

@@ -92,6 +92,9 @@ class Masonry extends BaseComponent {
   }
 
   _createLoader() {
+    if (typeof document === 'undefined') {
+      return
+    }
     const loader = document.createElement('div')
     loader.classList.add(CLASS_NAME_LOADER, 'fade', 'd-flex', 'justify-content-center', 'align-items-center')
     loader.innerHTML = '<div class="progress-spinner progress-spinner-active"><span class="visually-hidden">Caricamento...</span></div>'

src/js/plugins/navscroll.js

@@ -198,6 +198,9 @@ class NavScroll extends BaseComponent {
 
   _onScroll() {
     const sectionsContainerTop = this._sectionContainer ? this._sectionContainer.offsetTop : 0
+    if (typeof document === 'undefined') {
+      return
+    }
     const scrollDistance = document.scrollingElement.scrollTop - sectionsContainerTop
 
     const navItems = SelectorEngine.find(SELECTOR_LINK, this._element)

src/js/plugins/select-autocomplete.js

@@ -36,6 +36,9 @@ class SelectAutocomplete extends BaseComponent {
     accessibleAutocomplete.enhanceSelectElement(Object.assign({}, { selectElement: this._element }, this._config))
     setTimeout(() => {
       if (this._hasFormControl) {
+        if (typeof document === 'undefined') {
+          return
+        }
         const inputField = document.getElementById(this.element_original_id)
         inputField.classList.add('form-control')
         onClassChange(inputField, (node) => {

src/js/plugins/sticky.js

@@ -191,6 +191,9 @@ class Sticky extends BaseComponent {
   }
 
   _createWrapper() {
+    if (typeof document === 'undefined') {
+      return
+    }
     const wrapper = document.createElement('div')
     wrapper.classList.add(CLASS_NAME_WRAPPER)
     wrapper.style.width = '100%' //this._element.getBoundingClientRect().width + 'px'

src/js/plugins/track-focus.js

@@ -12,6 +12,9 @@ class TrackFocus {
 
   // Private
   _bindEvents() {
+    if (typeof document === 'undefined') {
+      return
+    }
     const events = ['keydown', 'mousedown']
     events.forEach((evtName) => {
       document.addEventListener(evtName, (evt) => {

src/js/plugins/upload-dragdrop.js

@@ -134,11 +134,13 @@ const createInput = (element) => {
   return null
 }
 
-document.addEventListener('dragenter', function (evt) {
-  createInput(evt.target)
-})
-EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_FORM + ' label', function () {
-  createInput(this)
-})
+if (typeof document !== 'undefined') {
+  document.addEventListener('dragenter', function (evt) {
+    createInput(evt.target)
+  })
+  EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_FORM + ' label', function () {
+    createInput(this)
+  })
+}
 
 export default UploadDragDrop

src/js/plugins/util/on-document-scroll.js

@@ -25,6 +25,9 @@ const removeCallBack = (id) => {
 }
 
 const onDocumentScroll = (callback) => {
+  if (typeof document === 'undefined') {
+    return
+  }
   if (!callbacks.length) {
     document.addEventListener('scroll', (evt) => {
       if (!ticking) {