Skip to content

Commit 5c4838b

Browse files
committed
feat(tappable): auto add tappable attribute for ion-item clicks
1 parent 12b8157 commit 5c4838b

File tree

3 files changed

+15
-5
lines changed

3 files changed

+15
-5
lines changed

src/components/item/item.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -339,6 +339,17 @@ export class Item extends Ion {
339339
this._setName(elementRef);
340340
this._shouldHaveReorder = !!reorder;
341341
this.id = form.nextId().toString();
342+
343+
// auto add "tappable" attribute to ion-item components that have a click listener
344+
if (!(<any>renderer).orgListen) {
345+
(<any>renderer).orgListen = renderer.listen;
346+
renderer.listen = function(renderElement: HTMLElement, name: string, callback: Function): Function {
347+
if (name === 'click' && renderElement.setAttribute) {
348+
renderElement.setAttribute('tappable', '');
349+
}
350+
return (<any>renderer).orgListen(renderElement, name, callback);
351+
};
352+
}
342353
}
343354

344355
/**

src/components/nav/test/basic/app-module.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export class MyCmpTest {
5353
<ion-list-header>
5454
{{title}}
5555
</ion-list-header>
56-
<button ion-item class="e2eFrom1To2" (click)="pushFullPage()">Push to FullPage</button>
56+
<ion-item class="e2eFrom1To2" (click)="pushFullPage()">Push to FullPage</ion-item>
5757
<button ion-item (click)="pushPrimaryHeaderPage()">Push to PrimaryHeaderPage</button>
5858
<button ion-item (click)="pushRedirect()">Push to Redirect</button>
5959
<button ion-item (click)="pushTabsPage()">Push to Tabs Page</button>

src/components/tap-click/tap-click.ts

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -160,17 +160,16 @@ export const isActivatable = function (ele: HTMLElement) {
160160
return true;
161161
}
162162

163-
let attributes = ele.attributes;
164-
for (let i = 0, l = attributes.length; i < l; i++) {
165-
if (ACTIVATABLE_ATTRIBUTES.indexOf(attributes[i].name) > -1) {
163+
for (let i = 0, l = ACTIVATABLE_ATTRIBUTES.length; i < l; i++) {
164+
if (ele.hasAttribute(ACTIVATABLE_ATTRIBUTES[i])) {
166165
return true;
167166
}
168167
}
169168
return false;
170169
};
171170

172171
const ACTIVATABLE_ELEMENTS = ['A', 'BUTTON'];
173-
const ACTIVATABLE_ATTRIBUTES = ['tappable', 'button'];
172+
const ACTIVATABLE_ATTRIBUTES = ['tappable', 'ion-button'];
174173
const POINTER_TOLERANCE = 60;
175174
const DISABLE_NATIVE_CLICK_AMOUNT = 2500;
176175

0 commit comments

Comments
 (0)