vuetify icon indicating copy to clipboard operation
vuetify copied to clipboard

[Bug Report][3.3.7] menuIcon={undefined} in VCombobox doesn't disable default arrow icon

Open Maxim-Mazurok opened this issue 1 year ago • 2 comments

Environment

Vuetify Version: 3.3.7 Vue Version: 3.3.2 Browsers: Chrome 114.0.0.0 OS: Windows 10

Steps to reproduce

  1. Open repro

Expected Behavior

Default $dropdown icon is used

Actual Behavior

Since menuIcon is set to undefined - no icon should be used

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

I believe this is because Vue sees that menuIcon is undefined and decides to use the default $dropdown value for that prop.

One workaround is to use empty string like so: :menuIcon="''" but that doesn't seem good to me...

Another workaround is to use null, but that interferes with https://github.com/sindresorhus/eslint-plugin-unicorn/blob/main/docs/rules/no-null.md also Type 'null' is not assignable to type 'IconValue | undefined'.ts(2322)

Maxim-Mazurok avatar Jul 11 '23 04:07 Maxim-Mazurok

Yeah vue treats undefined props as not being set at all. We can detect it but it's really gross

void props[prop]
vm.vnode.props?.hasOwnProperty(prop) || vm.vnode.props?.hasOwnProperty(toKebabCase(prop))

use empty string like so: :menuIcon="''"

menuIcon="" is simpler

that interferes with no-null

don't use no-null then lol

Type 'null' is not assignable to type 'IconValue | undefined

I think we have to add null to pretty much all the prop types, annoying vue doesn't do that already for props that can be undefined.

KaelWD avatar Jul 12 '23 13:07 KaelWD

I see... I think the main reason I created this issue is that my first idea was to use undefined, and then when it didn't work I wasn't sure how to debug it or what else to try. And wasn't really aware of that caveat with default props. Probably the best solution would be to add noMenuIcon prop, then it's obvious how to use it and one can't go wrong with it. But that might be adding extra stuff to public API without much value... Up to you, feel free to close this one, thanks for looking into it!

I created a few other issues after migration from v2 to v3, would be great if you could check them out, some of them have suggested patches, I could look into making PRs if it makes sense:

  • https://github.com/vuetifyjs/vuetify/issues/17776
  • https://github.com/vuetifyjs/vuetify/issues/17777
  • https://github.com/vuetifyjs/vuetify/issues/17778
  • https://github.com/vuetifyjs/vuetify/issues/17779
  • https://github.com/vuetifyjs/vuetify/issues/17782

Maxim-Mazurok avatar Jul 14 '23 01:07 Maxim-Mazurok

I would prefer this to be consciously closed by a human maintainer if they decide so

Maxim-Mazurok avatar Mar 17 '24 05:03 Maxim-Mazurok