Resource Table Click Action not working for Computed Fields with asHtml()

[goldmerc]

• Nova Version: 4.28.0

Computed Fields with asHtml() are not clickable in resource table rows. Without asHtml() they work as expected.

Text::make('foo', fn() => 'clickable'),
Text::make('bar', fn() => 'not clickable')->asHtml(),

[crynobone]

Please provide full reproducing repository based on fresh installation as suggested in the bug report template (or you can refer to https://github.com/nova-issues for example)

[goldmerc]

Hi @crynobone

Please see https://github.com/goldmerc/nova-clickable-row-computed-field-test

You'll need to set up a database, migrate + create a nova user. Then just view the index page of the user resource. You'll see "clickable" and "not clickable". Fairly self explanatory!

Thanks for your help.

[crynobone]

This behavior is expected to allow adding custom link to field with asHtml(). Otherwise, the link and table click action will be triggered and can cause an issue.

[goldmerc]

Thanks for the explanation. With Nova 3, I used to use a package to implement clickable table rows. I'm not sure how the functionality is implemented in Nova 4 but the old package had no trouble with links in asHtml fields as well as buttons and text selection. It simply ignored certain HTML elements. It's a short bit of code...

https://github.com/dcasia/clickable-table-row/blob/development/resources/js/tool.js

I think this functionality would be the behaviour expected by most users but that's just my view.

[samyouel]

This!
So true, I was wondering for a long time already why this behaviour was so unexpected..

In my case I'm just formatting a column bold using a span and 'font-bold' class. But since this is not clickable now, it's confusing users...

[Tarpsvo]

Still relevant. Instead of just Vue click.stop it would be helpful if it was filtered, ie similar to what @goldmerc linked.