mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-20 17:54:23 +01:00
Remove IE support and button bsChecked hack
This commit is contained in:
parent
e866b1ae43
commit
6cfc78f2d9
@ -7,7 +7,6 @@
|
||||
|
||||
import Data from './dom/data'
|
||||
import EventHandler from './dom/eventHandler'
|
||||
import Manipulator from './dom/manipulator'
|
||||
import SelectorEngine from './dom/selectorEngine'
|
||||
import Util from './util'
|
||||
|
||||
@ -96,7 +95,8 @@ class Button {
|
||||
rootElement.classList.contains('disabled')) {
|
||||
return
|
||||
}
|
||||
Manipulator.setChecked(input, !this._element.classList.contains(ClassName.ACTIVE))
|
||||
|
||||
input.checked = !this._element.classList.contains(ClassName.ACTIVE)
|
||||
EventHandler.trigger(input, 'change')
|
||||
}
|
||||
|
||||
|
@ -28,20 +28,6 @@ function normalizeDataKey(key) {
|
||||
}
|
||||
|
||||
const Manipulator = {
|
||||
setChecked(input, val) {
|
||||
if (input instanceof HTMLInputElement) {
|
||||
input.checked = val
|
||||
input.bsChecked = val
|
||||
}
|
||||
},
|
||||
|
||||
isChecked(input) {
|
||||
if (input instanceof HTMLInputElement) {
|
||||
return input.bsChecked || input.checked
|
||||
}
|
||||
throw new Error('INPUT parameter is not an HTMLInputElement')
|
||||
},
|
||||
|
||||
setDataAttribute(element, key, value) {
|
||||
element.setAttribute(`data-${normalizeDataKey(key)}`, value)
|
||||
},
|
||||
|
@ -9,47 +9,6 @@ import Util from '../util'
|
||||
|
||||
/* istanbul ignore next */
|
||||
const Polyfill = (() => {
|
||||
// defaultPrevented is broken in IE
|
||||
const workingDefaultPrevented = (() => {
|
||||
const e = document.createEvent('CustomEvent')
|
||||
e.initEvent('Bootstrap', true, true)
|
||||
e.preventDefault()
|
||||
return e.defaultPrevented
|
||||
})()
|
||||
|
||||
if (!workingDefaultPrevented) {
|
||||
const origPreventDefault = Event.prototype.preventDefault
|
||||
Event.prototype.preventDefault = function () {
|
||||
if (!this.cancelable) {
|
||||
return
|
||||
}
|
||||
|
||||
origPreventDefault.call(this)
|
||||
Object.defineProperty(this, 'defaultPrevented', {
|
||||
get() {
|
||||
return true
|
||||
},
|
||||
configurable: true
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// CustomEvent polyfill for IE (see: https://mzl.la/2v76Zvn)
|
||||
if (typeof window.CustomEvent !== 'function') {
|
||||
window.CustomEvent = (event, params) => {
|
||||
params = params || {
|
||||
bubbles: false,
|
||||
cancelable: false,
|
||||
detail: null
|
||||
}
|
||||
const evt = document.createEvent('CustomEvent')
|
||||
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail)
|
||||
return evt
|
||||
}
|
||||
|
||||
window.CustomEvent.prototype = window.Event.prototype
|
||||
}
|
||||
|
||||
// MSEdge resets defaultPrevented flag upon dispatchEvent call if at least one listener is attached
|
||||
const defaultPreventedPreservedOnDispatch = (() => {
|
||||
const e = new CustomEvent('Bootstrap', {
|
||||
@ -76,14 +35,6 @@ const Polyfill = (() => {
|
||||
window.Event.prototype = origEvent.prototype
|
||||
}
|
||||
|
||||
// matches polyfill (see: https://mzl.la/2ikXneG)
|
||||
let matches = Element.prototype.matches
|
||||
if (!matches) {
|
||||
matches =
|
||||
Element.prototype.msMatchesSelector ||
|
||||
Element.prototype.webkitMatchesSelector
|
||||
}
|
||||
|
||||
// closest polyfill (see: https://mzl.la/2vXggaI)
|
||||
let closest
|
||||
if (!Element.prototype.closest) {
|
||||
@ -91,7 +42,7 @@ const Polyfill = (() => {
|
||||
closest = (element, selector) => {
|
||||
let ancestor = element
|
||||
do {
|
||||
if (matches.call(ancestor, selector)) {
|
||||
if (ancestor.matches(selector)) {
|
||||
return ancestor
|
||||
}
|
||||
|
||||
@ -188,7 +139,6 @@ const Polyfill = (() => {
|
||||
defaultPreventedPreservedOnDispatch,
|
||||
focusIn: typeof window.onfocusin === 'undefined',
|
||||
closest,
|
||||
matches,
|
||||
find,
|
||||
findOne
|
||||
}
|
||||
|
@ -15,7 +15,7 @@ import Util from '../util'
|
||||
*/
|
||||
|
||||
const closest = Polyfill.closest
|
||||
const matchesFn = Polyfill.matches
|
||||
const matchesFn = Element.prototype.matches
|
||||
const find = Polyfill.find
|
||||
const findOne = Polyfill.findOne
|
||||
const nodeText = 3
|
||||
|
@ -30,13 +30,6 @@ const browsers = {
|
||||
browser: 'Edge',
|
||||
browser_version: 'latest'
|
||||
},
|
||||
ie11Win10: {
|
||||
base: 'BrowserStack',
|
||||
os: 'Windows',
|
||||
os_version: '10',
|
||||
browser: 'IE',
|
||||
browser_version: '11.0'
|
||||
},
|
||||
chromeWin10: {
|
||||
base: 'BrowserStack',
|
||||
os: 'Windows',
|
||||
@ -51,13 +44,6 @@ const browsers = {
|
||||
browser: 'Firefox',
|
||||
browser_version: 'latest'
|
||||
},
|
||||
ie10Win8: {
|
||||
base: 'BrowserStack',
|
||||
os: 'Windows',
|
||||
os_version: '8',
|
||||
browser: 'IE',
|
||||
browser_version: '10.0'
|
||||
},
|
||||
iphoneX: {
|
||||
base: 'BrowserStack',
|
||||
os: 'ios',
|
||||
|
@ -130,21 +130,21 @@ $(function () {
|
||||
assert.ok($btn1.hasClass('active'), 'btn1 has active class')
|
||||
assert.ok($btn1.find('input').prop('checked'), 'btn1 is checked')
|
||||
assert.ok(!$btn2.hasClass('active'), 'btn2 does not have active class')
|
||||
assert.ok(!(inputBtn2.bsChecked || inputBtn2.checked), 'btn2 is not checked')
|
||||
assert.ok(!inputBtn2.checked, 'btn2 is not checked')
|
||||
|
||||
inputBtn2.dispatchEvent(new Event('click'))
|
||||
|
||||
assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
|
||||
assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
|
||||
assert.ok($btn2.hasClass('active'), 'btn2 has active class')
|
||||
assert.ok(inputBtn2.bsChecked || inputBtn2.checked, 'btn2 is checked')
|
||||
assert.ok(inputBtn2.checked, 'btn2 is checked')
|
||||
|
||||
inputBtn2.dispatchEvent(new Event('click')) // clicking an already checked radio should not un-check it
|
||||
|
||||
assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
|
||||
assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
|
||||
assert.ok($btn2.hasClass('active'), 'btn2 has active class')
|
||||
assert.ok(inputBtn2.bsChecked || inputBtn2.checked, 'btn2 is checked')
|
||||
assert.ok(inputBtn2.checked, 'btn2 is checked')
|
||||
})
|
||||
|
||||
QUnit.test('should only toggle selectable inputs', function (assert) {
|
||||
|
@ -8,52 +8,6 @@ $(function () {
|
||||
assert.ok(Manipulator, 'Manipulator is defined')
|
||||
})
|
||||
|
||||
QUnit.test('should set checked for input', function (assert) {
|
||||
assert.expect(2)
|
||||
|
||||
var $input = $('<input type="checkbox" />').appendTo('#qunit-fixture')
|
||||
Manipulator.setChecked($input[0], true)
|
||||
|
||||
assert.ok($input[0].checked)
|
||||
|
||||
Manipulator.setChecked($input[0], false)
|
||||
|
||||
assert.ok(!$input[0].checked)
|
||||
})
|
||||
|
||||
QUnit.test('should not set checked for non input element', function (assert) {
|
||||
assert.expect(1)
|
||||
|
||||
var $div = $('<div />').appendTo('#qunit-fixture')
|
||||
Manipulator.setChecked($div[0], true)
|
||||
|
||||
assert.ok(typeof $div[0].checked === 'undefined')
|
||||
})
|
||||
|
||||
QUnit.test('should verify if an element is checked', function (assert) {
|
||||
assert.expect(2)
|
||||
|
||||
var $input = $('<input type="checkbox" />').appendTo('#qunit-fixture')
|
||||
Manipulator.setChecked($input[0], true)
|
||||
|
||||
assert.ok(Manipulator.isChecked($input[0]))
|
||||
|
||||
Manipulator.setChecked($input[0], false)
|
||||
|
||||
assert.ok(!Manipulator.isChecked($input[0]))
|
||||
})
|
||||
|
||||
QUnit.test('should throw an error when the element is not an input', function (assert) {
|
||||
assert.expect(1)
|
||||
|
||||
var $div = $('<div />').appendTo('#qunit-fixture')
|
||||
try {
|
||||
Manipulator.isChecked($div[0])
|
||||
} catch (e) {
|
||||
assert.strictEqual(e.message, 'INPUT parameter is not an HTMLInputElement')
|
||||
}
|
||||
})
|
||||
|
||||
QUnit.test('should set data attribute', function (assert) {
|
||||
assert.expect(1)
|
||||
|
||||
|
@ -44,12 +44,11 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="../../dist/util.js"></script>
|
||||
<script src="../../dist/dom/polyfill.js"></script>
|
||||
<script src="../../dist/dom/eventHandler.js"></script>
|
||||
<script src="../../dist/dom/manipulator.js"></script>
|
||||
<script src="../../dist/dom/selectorEngine.js"></script>
|
||||
<script src="../../dist/dom/data.js"></script>
|
||||
<script src="../../dist/util.js"></script>
|
||||
<script src="../../dist/button.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
Loading…
x
Reference in New Issue
Block a user