mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-09 15:16:51 +02:00
Make the attribute methods bs specific (#32173)
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
@@ -15,13 +15,13 @@ describe('Manipulator', () => {
|
||||
})
|
||||
|
||||
describe('setDataAttribute', () => {
|
||||
it('should set data attribute', () => {
|
||||
it('should set data attribute prefixed with bs', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
Manipulator.setDataAttribute(div, 'key', 'value')
|
||||
expect(div.getAttribute('data-key')).toEqual('value')
|
||||
expect(div.getAttribute('data-bs-key')).toEqual('value')
|
||||
})
|
||||
|
||||
it('should set data attribute in kebab case', () => {
|
||||
@@ -30,37 +30,39 @@ describe('Manipulator', () => {
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
Manipulator.setDataAttribute(div, 'testKey', 'value')
|
||||
expect(div.getAttribute('data-test-key')).toEqual('value')
|
||||
expect(div.getAttribute('data-bs-test-key')).toEqual('value')
|
||||
})
|
||||
})
|
||||
|
||||
describe('removeDataAttribute', () => {
|
||||
it('should remove data attribute', () => {
|
||||
fixtureEl.innerHTML = '<div data-key="value"></div>'
|
||||
it('should only remove bs-prefixed data attribute', () => {
|
||||
fixtureEl.innerHTML = '<div data-bs-key="value" data-key-bs="postfixed" data-key="value"></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
Manipulator.removeDataAttribute(div, 'key')
|
||||
expect(div.getAttribute('data-key')).toBeNull()
|
||||
expect(div.getAttribute('data-bs-key')).toBeNull()
|
||||
expect(div.getAttribute('data-key-bs')).toEqual('postfixed')
|
||||
expect(div.getAttribute('data-key')).toEqual('value')
|
||||
})
|
||||
|
||||
it('should remove data attribute in kebab case', () => {
|
||||
fixtureEl.innerHTML = '<div data-test-key="value"></div>'
|
||||
fixtureEl.innerHTML = '<div data-bs-test-key="value"></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
Manipulator.removeDataAttribute(div, 'testKey')
|
||||
expect(div.getAttribute('data-test-key')).toBeNull()
|
||||
expect(div.getAttribute('data-bs-test-key')).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('getDataAttributes', () => {
|
||||
it('should return empty object for null', () => {
|
||||
it('should return an empty object for null', () => {
|
||||
expect(Manipulator.getDataAttributes(null)).toEqual({})
|
||||
expect().nothing()
|
||||
})
|
||||
|
||||
it('should get only bs prefixed data attributes without bs namespace', () => {
|
||||
it('should get only bs-prefixed data attributes without bs namespace', () => {
|
||||
fixtureEl.innerHTML = '<div data-bs-toggle="tabs" data-bs-target="#element" data-another="value" data-target-bs="#element" data-in-bs-out="in-between"></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
@@ -73,16 +75,18 @@ describe('Manipulator', () => {
|
||||
})
|
||||
|
||||
describe('getDataAttribute', () => {
|
||||
it('should get data attribute', () => {
|
||||
fixtureEl.innerHTML = '<div data-test="null" ></div>'
|
||||
it('should only get bs-prefixed data attribute', () => {
|
||||
fixtureEl.innerHTML = '<div data-bs-key="value" data-test-bs="postFixed" data-toggle="tab"></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
expect(Manipulator.getDataAttribute(div, 'key')).toEqual('value')
|
||||
expect(Manipulator.getDataAttribute(div, 'test')).toBeNull()
|
||||
expect(Manipulator.getDataAttribute(div, 'toggle')).toBeNull()
|
||||
})
|
||||
|
||||
it('should get data attribute in kebab case', () => {
|
||||
fixtureEl.innerHTML = '<div data-test-key="value" ></div>'
|
||||
fixtureEl.innerHTML = '<div data-bs-test-key="value" ></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
@@ -90,22 +94,22 @@ describe('Manipulator', () => {
|
||||
})
|
||||
|
||||
it('should normalize data', () => {
|
||||
fixtureEl.innerHTML = '<div data-test="false" ></div>'
|
||||
fixtureEl.innerHTML = '<div data-bs-test="false" ></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
expect(Manipulator.getDataAttribute(div, 'test')).toEqual(false)
|
||||
|
||||
div.setAttribute('data-test', 'true')
|
||||
div.setAttribute('data-bs-test', 'true')
|
||||
expect(Manipulator.getDataAttribute(div, 'test')).toEqual(true)
|
||||
|
||||
div.setAttribute('data-test', '1')
|
||||
div.setAttribute('data-bs-test', '1')
|
||||
expect(Manipulator.getDataAttribute(div, 'test')).toEqual(1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('offset', () => {
|
||||
it('should return object with two properties top and left, both numbers', () => {
|
||||
it('should return an object with two properties top and left, both numbers', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
@@ -118,7 +122,7 @@ describe('Manipulator', () => {
|
||||
})
|
||||
|
||||
describe('position', () => {
|
||||
it('should return object with two properties top and left, both numbers', () => {
|
||||
it('should return an object with two properties top and left, both numbers', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
Reference in New Issue
Block a user