[Bug]: Strange vue3 code snippet behavior with "icon" based properties in alpha

[KevinCarnaille2]

Describe the bug

While migrating to 7.1.0-alpha-40, in a vue3-vite SB project, I'm facing a strange issue when my components contain properties with the string "icon"

Instead of simply displaying the property and its string value, it renders a kind of function :

export const Default = {
    args: {
        icon: 'I am the icon property',
        iconSize: 'small',
        color: 'blue'
    }
}

And the code snippet result :

<template>
  <MyCmp icon="()=>({})" icon-size="()=>({})" color="blue" />
</template>

You can preview the issue with the github repository below, I reproduced the issue pretty easily :) Thanks !

To Reproduce

https://github.com/KevinCarnaille2/sb-vue3-sourcecode-issue

System

Binaries:
    Node: 16.17.1 - ~/.nvm/versions/node/v16.17.1/bin/node
    npm: 8.15.0 - ~/.nvm/versions/node/v16.17.1/bin/npm
Browsers:
    Chrome: 114.0.5735.106
npmPackages:
    @storybook/addon-essentials: ^7.1.0-alpha.40 => 7.1.0-alpha.40 
    @storybook/addon-interactions: ^7.1.0-alpha.40 => 7.1.0-alpha.40 
    @storybook/addon-links: ^7.1.0-alpha.40 => 7.1.0-alpha.40 
    @storybook/blocks: ^7.1.0-alpha.40 => 7.1.0-alpha.40 
    @storybook/testing-library: ^0.2.0-next.1 => 0.2.0 
    @storybook/vue3: ^7.1.0-alpha.40 => 7.1.0-alpha.40 
    @storybook/vue3-vite: ^7.1.0-alpha.40 => 7.1.0-alpha.40

Additional context

You can have a look at the "ButtonIcon" story in the docs

No response

### Tasks
- [ ] Vue3
- [ ] args

[timonbandit]

same things You cannot use any props with on inside check https://github.com/storybookjs/storybook/blame/next/code/renderers/vue3/src/docs/utils.ts#L23

[vanessayuenn]

@chakAs3 @kasperpeulen looks like we are incorrectly treating everything with /^on/ as event handler

[chakAs3]

@timonbandit using props with on will be treated as an event handler and be considered as action, ideally avoid attributes starting with 'on' or override this in actions property in your preview

[shilman]

@chakAs3 icon does not match the regex ^on[A-Z]. so either the problem is elsewhere (my guess) or the argTypeRegex code is buggy (also possible).

[chakAs3]

@chakAs3 icon does not match the regex ^on[A-Z]. so either the problem is elsewhere (my guess) or the argTypeRegex code is buggy (also possible).

funny the argTypeRegex is buggy because there is 'on' in 'icon' i will see what we can do to fix this

[tfoxkiu]

I believe this is fixed in https://github.com/storybookjs/storybook/pull/25219 (https://github.com/storybookjs/storybook/releases/tag/v8.0.0-alpha.15)

[vanessayuenn]

Indeed this should be fixed already by https://github.com/storybookjs/storybook/pull/25219. I am closing this issue for now. But please let me know if it isn't fixed.