Manipulator: Add json parse supportgs/parse-json-config

3 files changed, 24 insertions, 12 deletions

diff --git a/js/src/dom/manipulator.js b/js/src/dom/manipulator.js
index 1be3a793f..d870a099d 100644
--- a/js/src/dom/manipulator.js
+++ b/js/src/dom/manipulator.js
@@ -22,7 +22,15 @@ function normalizeData(val) {
     return null
   }
 
-  return val
+  if (typeof val !== 'string') {
+    return val
+  }
+
+  try {
+    return JSON.parse(decodeURIComponent(val))
+  } catch {
+    return val
+  }
 }
 
 function normalizeDataKey(key) {
diff --git a/js/tests/unit/dom/manipulator.spec.js b/js/tests/unit/dom/manipulator.spec.js
index 13d0c3d17..7ba45c102 100644
--- a/js/tests/unit/dom/manipulator.spec.js
+++ b/js/tests/unit/dom/manipulator.spec.js
@@ -1,7 +1,7 @@
 import Manipulator from '../../../src/dom/manipulator'
 
 /** Test helpers */
-import { getFixture, clearFixture } from '../../helpers/fixture'
+import { clearFixture, getFixture } from '../../helpers/fixture'
 
 describe('Manipulator', () => {
   let fixtureEl
@@ -94,7 +94,7 @@ describe('Manipulator', () => {
     })
 
     it('should normalize data', () => {
-      fixtureEl.innerHTML = '<div data-bs-test="false" ></div>'
+      fixtureEl.innerHTML = '<div data-bs-test="false" data-bs-test2=\'{"delay":{"show":100,"hide":10}}\'></div>'
 
       const div = fixtureEl.querySelector('div')
 
@@ -103,8 +103,15 @@ describe('Manipulator', () => {
       div.setAttribute('data-bs-test', 'true')
       expect(Manipulator.getDataAttribute(div, 'test')).toEqual(true)
 
-      div.setAttribute('data-bs-test', '1')
-      expect(Manipulator.getDataAttribute(div, 'test')).toEqual(1)
+      const objectData = { 'Super Hero': ['Iron Man', 'Super Man'], url: 'http://localhost:8080/test?foo=bar' }
+      const dataStr = JSON.stringify(objectData)
+      div.setAttribute('data-bs-test', encodeURIComponent(dataStr))
+      expect(Manipulator.getDataAttribute(div, 'test')).toEqual(objectData)
+
+      div.setAttribute('data-bs-test', dataStr)
+      expect(Manipulator.getDataAttribute(div, 'test')).toEqual(objectData)
+
+      expect(Manipulator.getDataAttribute(div, 'test2')).toEqual({ delay: { show: 100, hide: 10 } })
     })
   })
 
diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js
index 22a7edd01..c4f34e01c 100644
--- a/js/tests/unit/tooltip.spec.js
+++ b/js/tests/unit/tooltip.spec.js
@@ -680,15 +680,12 @@ describe('Tooltip', () => {
     })
 
     it('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', done => {
-      fixtureEl.innerHTML = '<a href="#" rel="tooltip" title="Another tooltip">'
+      fixtureEl.innerHTML = '<a href="#" rel="tooltip" title="Another tooltip" data-bs-delay=\'{"show":0,"hide":150}\'>'
 
       const tooltipEl = fixtureEl.querySelector('a')
-      const tooltip = new Tooltip(tooltipEl, {
-        delay: {
-          show: 0,
-          hide: 150
-        }
-      })
+      const tooltip = new Tooltip(tooltipEl)
+
+      expect(tooltip._config.delay).toEqual({ show: 0, hide: 150 })
 
       setTimeout(() => {
         expect(tooltip.getTipElement().classList.contains('show')).toEqual(true)