fix(tap): fire input behavior when tap/clicking file input label. Closes #1699

This commit is contained in:
Perry Govier
2014-07-02 18:27:07 -05:00
parent 39f6e3acfb
commit 889482e048
3 changed files with 36 additions and 1 deletions

View File

@@ -228,12 +228,20 @@ ionic.tap = {
},
requiresNativeClick: function(ele) {
if(!ele || ele.disabled || (/^(file|range)$/i).test(ele.type) || (/^(object|video)$/i).test(ele.tagName) ) {
if(!ele || ele.disabled || (/^(file|range)$/i).test(ele.type) || (/^(object|video)$/i).test(ele.tagName) || ionic.tap.isLabelContainingFileInput(ele) ) {
return true;
}
return ionic.tap.isElementTapDisabled(ele);
},
isLabelContainingFileInput: function(ele) {
var lbl = tapContainingElement(ele);
if(lbl.tagName !== 'LABEL') return false;
var fileInput = lbl.querySelector('input[type=file]');
if(fileInput && fileInput.disabled === false) return true;
return false;
},
isElementTapDisabled: function(ele) {
if(ele && ele.nodeType === 1) {
var element = ele;

View File

@@ -168,6 +168,15 @@
<option>United States</option>
</select>
</div>
<div class="item item-divider">
File Input
</div>
<label class="item item-input">
<div class="input-label">
<i class="icon ion-document-text"></i> File
</div>
<input type="file"/>
</label>
<div class="item item-divider">
Other Tests

View File

@@ -746,6 +746,24 @@ describe('Ionic Tap', function() {
expect( ionic.tap.requiresNativeClick( div5 ) ).toEqual(true);
});
it('Should ionic.tap.requiresNativeClick for labels containing input[file]', function() {
var lbl = document.createElement('label');
var ele = document.createElement('input');
ele.type = 'file';
lbl.appendChild(ele);
expect( ionic.tap.requiresNativeClick( lbl ) ).toEqual(true);
});
it('Should ionic.tap.requiresNativeClick for elements underneath labels containing input[file]', function() {
var lbl = document.createElement('label');
var txt = document.createElement('span');
var ele = document.createElement('input');
ele.type = 'file';
lbl.appendChild(ele);
lbl.appendChild(txt);
expect( ionic.tap.requiresNativeClick( txt ) ).toEqual(true);
});
it('Should not allow a click that has an textarea target but not created by tapClick', function() {
var e = {
target: document.createElement('textarea'),