1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-20 12:21:35 +02:00

Manipulator: Add JSON parse support (#35077)

Support parsing JSON from each component's main element using the `data-bs-config` attribute.

The `bs-config` attribute will be reserved and omitted during `getDataAttributes` parsing.

With this commit, every component, will create its config object, using:

* defaults
* data-bs-config
* the rest of data attributes
* configuration object given during instance initialization

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Co-authored-by: Mark Otto <markdotto@gmail.com>
This commit is contained in:
GeoSot
2022-04-21 21:41:43 +03:00
committed by GitHub
parent 01cffa6822
commit 584600bda3
16 changed files with 163 additions and 18 deletions

View File

@@ -70,6 +70,17 @@ describe('Manipulator', () => {
target: '#element'
})
})
it('should omit `bs-config` data attribute', () => {
fixtureEl.innerHTML = '<div data-bs-toggle="tabs" data-bs-target="#element" data-bs-config=\'{"testBool":false}\'></div>'
const div = fixtureEl.querySelector('div')
expect(Manipulator.getDataAttributes(div)).toEqual({
toggle: 'tabs',
target: '#element'
})
})
})
describe('getDataAttribute', () => {
@@ -104,5 +115,21 @@ describe('Manipulator', () => {
div.setAttribute('data-bs-test', '1')
expect(Manipulator.getDataAttribute(div, 'test')).toEqual(1)
})
it('should normalize json data', () => {
fixtureEl.innerHTML = '<div data-bs-test=\'{"delay":{"show":100,"hide":10}}\'></div>'
const div = fixtureEl.querySelector('div')
expect(Manipulator.getDataAttribute(div, 'test')).toEqual({ delay: { show: 100, hide: 10 } })
const objectData = { 'Super Hero': ['Iron Man', 'Super Man'], testNum: 90, 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)
})
})
})