Custom events not firing in order

On my register page I have a workflow on the ‘Sign Up’ button being clicked that has two steps:
Step 1: Trigger custom event 1, that sets a state of an element
Step 2: Trigger custom event 2, that signs the user up

Problem: step 2 runs first and if the email or password inputs aren’t valid or some other condition for signing up isn’t fulfilled, step 2 doesn’t complete, but then neither does step 1! At all!!! It is important to me that the first step runs regardless of whether a user was succesfully signed up or not.

I’m using custom events because from what I know, custom event logic always executes in order (unlike regular workflow steps which could be running in parallel unless there’s adependency between them).

Have you got a screenshot of your workflows?..

Yes, here’s the workflow for button being clicked:

For set-clicked (1st custom event):

For sign-up-user:

How do you know step 2 is running before step 1?

Because of input validation rules, when step 2 (specifically ‘sign the user up’ step) is run, it checks these inputs and if any of them are invalid, it focuses to the first invalid input. So in my case if the email input is empty it gets focused.
This is how I know step 2 is run, and the way I know step 1 isn’t being run is because despite not having any conditionals on it, the state of the button doesn’t change (using the debugger’s inspect functionality to see that). So the ‘clicked’ state of the button is always ‘no’.
EDIT: also, when the button is actually clicked with the debugger set to ‘step-by-step’, no steps are shown.

What is supposed to happen when the Button’s Clicked State is changed to Yes?

Basically, I didn’t like how the validation for inputs kicks in immediately after the user starts typing, so if the input’s value is invalid, I only want to show that after the user clicks on ‘Sign Up’ at least once. In my case there’s a warning if the email is incorrect and a red border around the email input, and usually both appear right after user types a single symbol (done with conditionals on elements, checks for whether the input is invalid + the state of the button). These design decisions must stay but I don’t want to show them immediately as that makes for a jarring experience.

Have you checked the debugger and inspected if the state did or did not in fact change?

Also setting states is pretty much async, like triggering custom workflows, so you don’t really need to put it in a custom workflow by itself. The one occasion that you may run into an issue is if you are loading large/complex lists into a state and try to retrieve it in the next step. It’s still async but the data might not load in time.

Edit: whoops i mixed up synchronous with asynchronous again. I meant setting states are synchronous as explained by @adamhholmes

1 Like

States are managed in an event-driven way. When you set a new value to a state, immediate reading will show an old value, but if you do that in the next event cycle, you will see your new value.
Your workflow sequence is most probably executed correctly, the problem is that you expect new value to be available immediately after it’s been set, which is not. Replace Trigger sign-up-user with Schedule sign-up-user in 0 seconds and you’ll get what you want.

P.S. Did some tests after @adamhholmes comments and it turned out that this isn’t the case anymore. Though I do remember my hours of working this around a while ago, now setting custom state and reading its value immediately works just fine. Either I was doing something wrong that time or there’s something has been fixed, but my comment is not correct here, I apologize.

1 Like

So, really it could be anything, and without taking a look inside your app I don’t think anyone (other than you) will be able to identify the issue…

So feel free to share a link to your editor here if you want someone to take a look (it could be something obvious that you’ve missed)…

That said, I don’t really see why you need to use custom events here at all - setting a custom state is a synchronous action… so once you set the value of a custom state in a workflow that value will be available in subsequent steps (although that’s irrelevant here anyway, as you’re not referring to the Custom State value anywhere else in the workflow).

So you can just use a regular workflow, with Step 1 setting the custom state value, and step Signing the User up.

If that’s not working for you then something else must be going on here, but without seeing your app, it would only be guesswork.

Hi, i believe the problem is that you have two custom events and you should only have one custom event with 2 steps

Hi, i believe the problem is that you have two custom events and you should only have one custom event with 2 steps

Why?.. what difference would that make? (what would be the point of that?)

The steps are executed by order and the custom events no.
Try to use one custom event for button click.
Try to put a PAUSE before sign up user.

If you only use one custom event, what’s the point of using it? (you might as well just put the actions in the workflow)…

1 Like

Use one custom event for button click.
Put a PAUSE before sign up user.

Why? What does that achieve?

Actually, I’ve figured out what the problem is here… and it’s got nothing to do with your workflow steps running out of sequence (which they aren’t)…

The issue is because of the way you’re trying to validate the input.

If the input is not valid (i.e. if it’s not a valid email address) then the workflow will not run at all when the button is clicked.

If you want to override the default Bubble validation on an email input, you’ll need to switch the input type from email to text, and handle the validation yourself.

2 Likes

@adamhholmes you got it, and explained it nicely!

A fix is to have another click event with a separate workflow to do the custom state setting.

2 Likes

True, this seems to be the problem, though I’m not sure how to get past this.

Sadly I can’t do that, both the state setting and (attempting ) signing up needs to happen with the same click.

One button click can trigger multiple workflows …

1 Like