Enable a few eslint-config-xo rules (#34620)

* unicorn/prefer-dom-node-append
* unicorn/prefer-dom-node-remove

diff --git a/.eslintrc.json b/.eslintrc.json
index b412fff13e1aee3846ba6adc019768c72d58829e..0174b84d02c63d48f02e2fb3915ec8f4331a3506 100644 (file)
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -60,9 +60,7 @@
     "unicorn/no-useless-undefined": "off",
     "unicorn/numeric-separators-style": "off",
     "unicorn/prefer-array-flat": "off",
-    "unicorn/prefer-dom-node-append": "off",
     "unicorn/prefer-dom-node-dataset": "off",
-    "unicorn/prefer-dom-node-remove": "off",
     "unicorn/prefer-module": "off",
     "unicorn/prefer-prototype-methods": "off",
     "unicorn/prefer-query-selector": "off",

diff --git a/js/src/modal.js b/js/src/modal.js
index bb8d97e481369c1497ee1be9a63a4fcefd8eb6af..097ecd656ce0b70b305e8a256b449244ee15305b 100644 (file)
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -217,7 +217,7 @@ class Modal extends BaseComponent {
 
     if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
       // Don't move modal's DOM position
-      document.body.appendChild(this._element)
+      document.body.append(this._element)
     }
 
     this._element.style.display = 'block'

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index e09a53b5ceea002277ff784d27d93f06b93ee776..0adde623fb56c3859635a34fee1bbf869ecf5c46 100644 (file)
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -257,7 +257,7 @@ class Tooltip extends BaseComponent {
     Data.set(tip, this.constructor.DATA_KEY, this)
 
     if (!this._element.ownerDocument.documentElement.contains(this.tip)) {
-      container.appendChild(tip)
+      container.append(tip)
       EventHandler.trigger(this._element, this.constructor.Event.INSERTED)
     }
 
@@ -402,7 +402,7 @@ class Tooltip extends BaseComponent {
       if (this._config.html) {
         if (content.parentNode !== element) {
           element.innerHTML = ''
-          element.appendChild(content)
+          element.append(content)
         }
       } else {
         element.textContent = content.textContent

diff --git a/js/src/util/backdrop.js b/js/src/util/backdrop.js
index fbe32445eabd20e493a421c8ddfe4903b89dc381..30a3686f84d2682d25967d398dc0e9321cf91cfa 100644 (file)
--- a/js/src/util/backdrop.js
+++ b/js/src/util/backdrop.js
@@ -102,7 +102,7 @@ class Backdrop {
       return
     }
 
-    this._config.rootElement.appendChild(this._getElement())
+    this._config.rootElement.append(this._getElement())
 
     EventHandler.on(this._getElement(), EVENT_MOUSEDOWN, () => {
       execute(this._config.clickCallback)

diff --git a/js/tests/helpers/fixture.js b/js/tests/helpers/fixture.js
index 3d6f395e8fc53ad7367be30cff50d78a6162b63b..2ce1081fcc175551c6cc7e0a94c5649154fb6764 100644 (file)
--- a/js/tests/helpers/fixture.js
+++ b/js/tests/helpers/fixture.js
@@ -11,7 +11,7 @@ export const getFixture = () => {
     fixtureEl.style.left = '-10000px'
     fixtureEl.style.width = '10000px'
     fixtureEl.style.height = '10000px'
-    document.body.appendChild(fixtureEl)
+    document.body.append(fixtureEl)
   }
 
   return fixtureEl

diff --git a/js/tests/unit/carousel.spec.js b/js/tests/unit/carousel.spec.js
index 97482537a0e9ceba473d53ff5b28dc80761f079b..a933f1edabbf9252abf60d4a88e2694f272efbc9 100644 (file)
--- a/js/tests/unit/carousel.spec.js
+++ b/js/tests/unit/carousel.spec.js
@@ -14,7 +14,7 @@ describe('Carousel', () => {
 
   const stylesCarousel = document.createElement('style')
   stylesCarousel.type = 'text/css'
-  stylesCarousel.appendChild(document.createTextNode(cssStyleCarousel))
+  stylesCarousel.append(document.createTextNode(cssStyleCarousel))
 
   const clearPointerEvents = () => {
     window.PointerEvent = null
@@ -345,7 +345,7 @@ describe('Carousel', () => {
       }
 
       document.documentElement.ontouchstart = () => {}
-      document.head.appendChild(stylesCarousel)
+      document.head.append(stylesCarousel)
       Simulator.setType('pointer')
 
       fixtureEl.innerHTML = [
@@ -371,7 +371,7 @@ describe('Carousel', () => {
         expect(item.classList.contains('active')).toEqual(true)
         expect(carousel._slide).toHaveBeenCalledWith('right')
         expect(event.direction).toEqual('right')
-        document.head.removeChild(stylesCarousel)
+        stylesCarousel.remove()
         delete document.documentElement.ontouchstart
         done()
       })
@@ -390,7 +390,7 @@ describe('Carousel', () => {
       }
 
       document.documentElement.ontouchstart = () => {}
-      document.head.appendChild(stylesCarousel)
+      document.head.append(stylesCarousel)
       Simulator.setType('pointer')
 
       fixtureEl.innerHTML = [
@@ -416,7 +416,7 @@ describe('Carousel', () => {
         expect(item.classList.contains('active')).toEqual(false)
         expect(carousel._slide).toHaveBeenCalledWith('left')
         expect(event.direction).toEqual('left')
-        document.head.removeChild(stylesCarousel)
+        stylesCarousel.remove()
         delete document.documentElement.ontouchstart
         done()
       })

diff --git a/js/tests/unit/dom/event-handler.spec.js b/js/tests/unit/dom/event-handler.spec.js
index 4dc4ffc3532674ea3b64dd68a9037bd6d4351af5..45f2d6e5537fec52eb8487e2558094507cff20c3 100644 (file)
--- a/js/tests/unit/dom/event-handler.spec.js
+++ b/js/tests/unit/dom/event-handler.spec.js
@@ -368,10 +368,10 @@ describe('EventHandler', () => {
     it('should remove the correct delegated event listener', () => {
       const element = document.createElement('div')
       const subelement = document.createElement('span')
-      element.appendChild(subelement)
+      element.append(subelement)
 
       const anchor = document.createElement('a')
-      element.appendChild(anchor)
+      element.append(anchor)
 
       let i = 0
       const handler = () => {
@@ -381,7 +381,7 @@ describe('EventHandler', () => {
       EventHandler.on(element, 'click', 'a', handler)
       EventHandler.on(element, 'click', 'span', handler)
 
-      fixtureEl.appendChild(element)
+      fixtureEl.append(element)
 
       EventHandler.trigger(anchor, 'click')
       EventHandler.trigger(subelement, 'click')

diff --git a/js/tests/unit/dom/manipulator.spec.js b/js/tests/unit/dom/manipulator.spec.js
index 4f8e40067ea080ca434d015e9d3258ecd16a56cf..13d0c3d17d2fdb2def13f5058276b3b0d0ee55b6 100644 (file)
--- a/js/tests/unit/dom/manipulator.spec.js
+++ b/js/tests/unit/dom/manipulator.spec.js
@@ -151,7 +151,7 @@ describe('Manipulator', () => {
       const { defaultView: win, body } = fixtureEl.ownerDocument
       const forceScrollBars = document.createElement('div')
       forceScrollBars.style.cssText = 'position:absolute;top:5000px;left:5000px;width:1px;height:1px'
-      body.appendChild(forceScrollBars)
+      body.append(forceScrollBars)
 
       const scrollHandler = () => {
         expect(window.pageYOffset).toBe(scrollY)
@@ -165,7 +165,7 @@ describe('Manipulator', () => {
         })
 
         win.removeEventListener('scroll', scrollHandler)
-        body.removeChild(forceScrollBars)
+        forceScrollBars.remove()
         win.scrollTo(0, 0)
         done()
       }

diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js
index 212f98ca84fd7d7f39ee47fa9d5fc33c7aca60a3..562b325618dcaedc04c50320827d79bed83f99f1 100644 (file)
--- a/js/tests/unit/modal.spec.js
+++ b/js/tests/unit/modal.spec.js
@@ -19,7 +19,7 @@ describe('Modal', () => {
 
     document.querySelectorAll('.modal-backdrop')
       .forEach(backdrop => {
-        document.body.removeChild(backdrop)
+        backdrop.remove()
       })
   })
 
@@ -143,7 +143,7 @@ describe('Modal', () => {
       modalEl.addEventListener('shown.bs.modal', () => {
         const dynamicModal = document.getElementById(id)
         expect(dynamicModal).not.toBeNull()
-        dynamicModal.parentNode.removeChild(dynamicModal)
+        dynamicModal.remove()
         done()
       })
 

diff --git a/js/tests/unit/popover.spec.js b/js/tests/unit/popover.spec.js
index f5a163050e8995b08409ab8943f5376b3db7293d..5460528b4c8267f823c81be63911182458b43502 100644 (file)
--- a/js/tests/unit/popover.spec.js
+++ b/js/tests/unit/popover.spec.js
@@ -16,7 +16,7 @@ describe('Popover', () => {
     const popoverList = document.querySelectorAll('.popover')
 
     popoverList.forEach(popoverEl => {
-      document.body.removeChild(popoverEl)
+      popoverEl.remove()
     })
   })
 

diff --git a/js/tests/unit/tab.spec.js b/js/tests/unit/tab.spec.js
index 621012c12e8571030b29a2c068fd7700cc64a5da..4bd9c7a73343a30b2728baaaba8b43205f216b4c 100644 (file)
--- a/js/tests/unit/tab.spec.js
+++ b/js/tests/unit/tab.spec.js
@@ -333,8 +333,8 @@ describe('Tab', () => {
         const tabId = linkEl.getAttribute('href')
         const tabIdEl = fixtureEl.querySelector(tabId)
 
-        liEl.parentNode.removeChild(liEl)
-        tabIdEl.parentNode.removeChild(tabIdEl)
+        liEl.remove()
+        tabIdEl.remove()
         secondNavTab.show()
       })
 

diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js
index 8f8524c8953fb01260e8df8d9b82964fab8df543..f3f90c3a3ffc2254ae5cf182f67b14c03789af8e 100644 (file)
--- a/js/tests/unit/tooltip.spec.js
+++ b/js/tests/unit/tooltip.spec.js
@@ -16,7 +16,7 @@ describe('Tooltip', () => {
     clearFixture()
 
     document.querySelectorAll('.tooltip').forEach(tooltipEl => {
-      document.body.removeChild(tooltipEl)
+      tooltipEl.remove()
     })
   })
 
@@ -490,7 +490,7 @@ describe('Tooltip', () => {
         tooltipEl.removeEventListener('shown.bs.tooltip', firstCallback)
         let tooltipShown = document.querySelector('.tooltip')
 
-        tooltipShown.parentNode.removeChild(tooltipShown)
+        tooltipShown.remove()
 
         tooltipEl.addEventListener('shown.bs.tooltip', () => {
           tooltipShown = document.querySelector('.tooltip')
@@ -1129,7 +1129,7 @@ describe('Tooltip', () => {
         html: true
       })
 
-      tooltip.getTipElement().appendChild(childContent)
+      tooltip.getTipElement().append(childContent)
       tooltip.setElementContent(tooltip.getTipElement(), childContent)
 
       expect().nothing()

diff --git a/js/tests/unit/util/backdrop.spec.js b/js/tests/unit/util/backdrop.spec.js
index 59b789071774846964702f3861339ef25d5dbd92..b885b60b511f74f8ad925b8d83c75b19317fd4e2 100644 (file)
--- a/js/tests/unit/util/backdrop.spec.js
+++ b/js/tests/unit/util/backdrop.spec.js
@@ -18,7 +18,7 @@ describe('Backdrop', () => {
     const list = document.querySelectorAll(CLASS_BACKDROP)
 
     list.forEach(el => {
-      document.body.removeChild(el)
+      el.remove()
     })
   })
 
@@ -141,7 +141,7 @@ describe('Backdrop', () => {
       const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
 
       instance.show(() => {
-        wrapper.parentNode.removeChild(wrapper)
+        wrapper.remove()
         instance.hide(() => {
           expect(getElements().length).toEqual(0)
           done()

diff --git a/site/.eslintrc.json b/site/.eslintrc.json
index 7dd81b81160b1c7c970d5939ffd829089ae8ffd8..0660ebbaf68232ea01665a7bc3447539b4fc9f60 100644 (file)
--- a/site/.eslintrc.json
+++ b/site/.eslintrc.json
@@ -52,7 +52,6 @@
     "unicorn/no-null": "off",
     "unicorn/numeric-separators-style": "off",
     "unicorn/prefer-array-flat": "off",
-    "unicorn/prefer-dom-node-append": "off",
     "unicorn/prefer-dom-node-dataset": "off",
     "unicorn/prefer-module": "off",
     "unicorn/prefer-prototype-methods": "off",