diff --git a/packages/primevue/src/datatable/DataTable.spec.js b/packages/primevue/src/datatable/DataTable.spec.js index 4e6f15c045..1dd5401108 100644 --- a/packages/primevue/src/datatable/DataTable.spec.js +++ b/packages/primevue/src/datatable/DataTable.spec.js @@ -582,6 +582,49 @@ describe('DataTable.vue', () => { expect(wrapper.emitted()['row-select'][1][0].index).toBe(1); }); + it('should not select row when inner button is clicked', async () => { + wrapper = mount(DataTable, { + global: { + plugins: [PrimeVue], + components: { + Column, + Button + } + }, + props: { + value: smallData, + expandedRows: [], + paginatorTemplate: 'CurrentPageReport FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown', + rowsPerPageOptions: [5, 6, 7], + currentPageReportTemplate: 'Showing {first} to {last} of {totalRecords}' + }, + slots: { + default: ` + + + + + + ` + }, + methods: { + buttonClicked() { + console.log('button clicked'); + } + } + }); + + const button = wrapper.find('button'); + + expect(button.exists()).toBe(true); + + await button.trigger('click'); + + expect(wrapper.emitted()['row-click']).toBeUndefined(); + }); + it('should select all rows', async () => { wrapper = mount(DataTable, { global: { diff --git a/packages/primevue/src/datatable/DataTable.vue b/packages/primevue/src/datatable/DataTable.vue index d592506ea3..c42557b87d 100755 --- a/packages/primevue/src/datatable/DataTable.vue +++ b/packages/primevue/src/datatable/DataTable.vue @@ -734,7 +734,7 @@ export default { const body = this.$refs.bodyRef && this.$refs.bodyRef.$el; const focusedItem = findSingle(body, 'tr[data-p-selectable-row="true"][tabindex="0"]'); - if (isClickable(event.currentTarget)) { + if (isClickable(event.target)) { return; } @@ -811,7 +811,7 @@ export default { this.rowTouched = false; if (focusedItem) { - if (event.currentTarget?.getAttribute('data-pc-section') === 'rowtoggleicon') return; + if (event.target?.getAttribute('data-pc-section') === 'rowtoggleicon') return; const targetRow = event.currentTarget?.closest('tr[data-p-selectable-row="true"]');