Can't upgrade code Public method [emitSelf] not found on component

#1

What seems to be the problem:

I can’t upgrade this Livewire v2 code to v3 because it uses @this.emitSelf and I don’t see this documented much at all. It’s a Laravel app and the full error is:

Livewire Exceptions
 MethodNotFoundException
PHP 8.2.22
11.20.0 Unable to call component method. Public method [emitSelf] not found on component

Steps to Reproduce:

Are you using the latest version of Livewire: Yes

Do you have any screenshots or code examples:

@push('post-livewire-scripts')
        <script src="https://www.google.com/recaptcha/api.js?render={{ config('services.recaptcha3.key') }}"></script>
        <script>
            Livewire.on('executeCaptchaValidation', () => {
                grecaptcha.ready(function() {
                    grecaptcha.execute('{{ config('services.recaptcha3.key') }}', {action: 'submit'}).then(function(token) {
                        @this.emitSelf('captchaResponse', token);
                    });
                });
            })
        </script>
    @endpush

The documentation for upgrading is quite clear:

  1. emit() has been renamed to dispatch() (Likewise emitTo() and emitSelf() are now dispatchTo() and dispatchSelf() )

However, no combination I’m trying is working.

I think it’s because it’s a closure and the code @this isn’t available. I’m not sure. Any guidance will be appreciated.

#2

After two hours I figured it out, on Blade, change to:

@this.dispatchSelf('captchaResponse',{token: token})

And change:

protected $listeners = ['captchaResponse' => 'processCaptcha'];

to

#[On('captchaResponse')]
    public function processCaptcha($token): void