DataTable: column resize does not work anymore

[ray007]

Describe the bug

Resizing a column with mouse does not work anymore since upgrading to the latest version 4.0.7.
Reproducer link is just a non-modified fork of the column resize demo from the docs.

AFAICT the attribute selector for the table in the created stylesheet is wrong.

Reproducer

https://stackblitz.com/edit/ryzkcf?file=src%2FApp.vue

PrimeVue version

4.0.7

Vue version

3.x

Language

ALL

Build / Runtime

Vite

Browser(s)

No response

Steps to reproduce the behavior

Try to resize column with mouse, resize element is shown in wanted position, but on resize end the columns stay the same.

Expected behavior

Resize changes column size.

[titus-weller-taxact]

This seems to be related to Vue version 3.5.6. PrimeVue column resize works with Vue version 3.5.5 and PrimeVue version 4.0.7.

[ray007]

Hmm, very strange.
Has this already been reported to the vue project?
If not, any idea how to best report this? I have no idea what's the problem here...

[egorvinogradov]

Changing versions of Vue, Nuxt, primevue didn't help. I was only able to fix this by applying a dirty fix on columnResizeEnd

Vue HTML:

<DataTable
  ref="table"
  @columnResizeEnd="applyDirtyColumnResizeFix"
  ...>
</DataTable>

JS in the Vue component:

applyDirtyColumnResizeFix(){
  const pvIdAttribute = Array.from(this.$refs.table.rootEl.attributes).find(attr => attr.name.startsWith('pv_id_'))?.name;
  const columnSizesStyle = Array.from(document.querySelectorAll('style')).find(style => style.textContent.includes('data-pc-name="datatable"'));
  if (columnSizesStyle) {
    columnSizesStyle.textContent = columnSizesStyle.textContent.replace(/\[pv_id_[0-9]+\]/igm, `[${pvIdAttribute}]`);
  }
}