Skip to content

Commit

Permalink
fix(filter-chip): make click event preventDefault proof
Browse files Browse the repository at this point in the history
  • Loading branch information
vdegenne committed Jul 25, 2023
1 parent f7b3ef7 commit 041cb21
Show file tree
Hide file tree
Showing 2 changed files with 31 additions and 1 deletion.
18 changes: 17 additions & 1 deletion chips/internal/filter-chip.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {html, nothing, PropertyValues, svg, TemplateResult} from 'lit';
import {property, query} from 'lit/decorators.js';

import {ARIAMixinStrict} from '../../internal/aria/aria.js';
import {redispatchEvent} from '../../internal/controller/events.js';

import {MultiActionChip} from './multi-action-chip.js';
import {renderRemoveButton} from './trailing-icons.js';
Expand All @@ -22,6 +23,9 @@ export class FilterChip extends MultiActionChip {
@property({type: Boolean}) removable = false;
@property({type: Boolean, reflect: true}) selected = false;

// flag to prvent processing of re-dispatched input event.
private isRedispatchingEvent = false;

protected get primaryId() {
return 'option';
}
Expand All @@ -35,11 +39,23 @@ export class FilterChip extends MultiActionChip {
// Remove the `row` role from the container, since filter chips do not use a
// `grid` navigation model.
this.containerRole = undefined;
this.addEventListener('click', () => {
this.addEventListener('click', (event) => {
// avoid processing a re-dispatched event
if (this.isRedispatchingEvent) {
return;
}

if (this.disabled) {
return;
}

this.isRedispatchingEvent = true;
const preventDefault = !redispatchEvent(this, event);
this.isRedispatchingEvent = false;
if (preventDefault) {
return;
}

this.selected = !this.selected;
});
}
Expand Down
14 changes: 14 additions & 0 deletions chips/internal/filter-chip_test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -76,5 +76,19 @@ describe('Filter chip', () => {
await harness.clickWithMouse();
expect(handler).toHaveBeenCalledTimes(2);
});

it('can prevent default', async () => {
const {chip, harness} = await setupTest();
const handler = jasmine.createSpy();
chip.addEventListener('selected', handler);

chip.addEventListener('click', (event) => {
event.preventDefault();
})

await harness.clickWithMouse();
await harness.clickWithMouse();
expect(handler).toHaveBeenCalledTimes(0);
})
});
});

0 comments on commit 041cb21

Please sign in to comment.