When using an interactive component in a prototype, "Click" doesn't execute

@Petr_Chutny Did you ever resolve this issue? I’m experiencing the same problem when trying to use an interactive button in a prototype - on click won’t trigger navigation to the next frame.

I’ve just tried it now, it still doesn’t work as expected.

Click has never worked for me in interactive components, I’ve always had to use mouse interactions (mouse up).

It works as expected on click, you just need to ensure that there are no other interactions overriding it (having two mouse ups can cause issues sometimes.)

After testing a bit, mouse up can be more performant as well, so I’d check that out until a fix is implemented.

Weird problem. I have a button component on a shared Design System with variants and interactions on that variants (hover, mouse down, mouse up etc.).
Everything works splendidly if I paste this component to a new file, view it on prototype has all the interactions. All variant interactions are there!!!

But! if I want to add a new f.e. click interaction on that component it doesn’t work. It keeps the variant interactions of the master component but somehow neglects to listen to the new click interaction.

In case it helps the variants have 3 states with the following interactions (Hover, Mouse Down, Mouse Up)

Is there any solution on this?

@GeorgeM Currently there isn’t. If you’d like click events in variants then use mouse up, however if you already have a mouse up assigned it will be overwritten in your flows. I’d detach mouse up and find other ways of getting the click event to work other than mouse up. Mouse down will work in these cases if the action permits it.

Yes that’s what I do but I lose all interactivity of the variants.

I thought that adding a new frame or shape on top of the variant will do the trick, but the mystery is bigger than what I thought initially.

Even if you place a frame on top of a variant, the area that the variant occupies, is overriding all other interactions. And it
s only that area – that’s the weirdest of all…

To give you an example see the following file.

@GeorgeM that makes sense to me though, as the z-index for each interaction should be above the latter. If you don’t mind, can you make this editable? I’d like to test/dig a bit deeper into this one.

Nvm just downloaded and will reshare this one. I’ve made a few changes to the buttons, and showed one with click as the interaction overlay to illustrate how I got it working.

Wow. Haven’t thought about the mouse-up interaction.
So the solution to my problem is the problem with click interaction on variants. I changed my approach with mouse up and imagine what – it worked 🎉

Updated file here

Yeah, can be a bit weird at first, but once you understand that you can put a mouse up on the instance while still having it in your variant, it changes things a little bit. Looking good @GeorgeM ! Hope it helps just a little 🙂

Try connecting the component with the frame with on click trigger and the original one with the while hovering, might work out…did work for me.

I had the same problem! You simply need to use “Mouse Up” instead of “On Click” 🙂

I don’t know why some thing as important as click event doesn’t work… And @anon21722796 didn’t anything to fix it?
I tried Figma for the first time but I deeply regret… I would have used Adobe XD for my prototype as always… Now I don’t have time to remake it…

Hi Andrew, I have the same issue: the mouse up event in the interactive variant overrides the click in a prototype. I am trying to add hover states to buttons on a library (with mouse enter, down and up etc), but once that is in place, existing prototypes that contain buttons stop working.

Hi @Andrew_Chan, I have also found that various variant interactive states override each other and they override frame interactions.

Here is a basic test that took me about 5m to set up: Figma

Yes it is not a happy issue, but I am using a simple “hack” - instead of using “Click” you can use “Mouse down” and this is an easy working solution.

Looks like a bug indeed. @Andrew_Chan @anon21722796 this has not been solved yet. I still have the same issue.

The Interactive Component contains interactions between variants to simulate a button press down:

• Mouse Down
• Mouse Up

When using an Instance of that component in a Prototype I want to add a ‘Click’ interaction to simulate the action upon button click.

Problem:

• The Click interaction is ignored

Workaround:

• Use Mouse Up instead of Click in the prototype

This works, but has the side effect that clicking and holding anywhere outside the Instance and then releasing (Mouse Up) with the cursor over the Instance will also trigger Mouse Up.

Does not happen often but can cause confusing and makes Mouse Up a hacky workaround.

Expectation:

• Click = Mouse Down with cursor on Instance, then Mouse Up while on that same Instance
• Mouse Up = Mouse Down anywhere on the screen, then Mouse Up while on the Instance you set the interaction for

Would love to see the proper Click interaction fixed as this is broken now.

Hi! It’s been a year now, when will this bug is being fixed? Now even the mouse up etc. won’t work.

Instead of Mouse Down, use While Pressing

Figma refuses to fix this bug … It always ruins my workflow before a big presentation

I’m experiencing this same problem right now. Makes interactive components useless for me. Will there be a solution to this?

Still running into issues with this ‘click’ interaction and having to resort to use ‘mouse up’ instead. Please fix this figma.

I run into this constantly, but realized why it’s happening; if you make a variant for the hover state of your interactive component, that variant is the new component present in your main scene. So linking a click from the default component won’t work. You must link from the hover variant to the new target frame.

Sorta defeats the purpose of keeping tidy components independent of the main artboards, but whatever. Still hoping Figma will fix this someday soon so you can hover and click from the same component.

Any news? I have the same problem…