Capacitor V3: Plugin addEventListener and triggerJSEvent lacking and don't work as described

Capacitor
1

Capacitor V3:

I’m trying simply to send an event from Android to JS. My plugin is working so far otherwise.

Does anyone have a working example of just calling JS from Android, no params?

Both of the documentation below have issues when I try to follow either approach:

I’ve tried the following:

import { MyPlugin } from 'capacitor-plugin-myplugin';


MyPlugin.addEventListener('myEvent', () => { 
    // ....
})

But I get:

Property 'addListener' does not exist on type 'MyPlugin'.

If I extend my plugin class in the Java and do:

public class MyPlugin extends Plugin {
//....

then call:

bridge.triggerJSEvent("finishedPlaying", "window");

I get:

java.lang.NullPointerException: Attempt to invoke virtual method 'void com.getcapacitor.Bridge.triggerJSEvent(java.lang.String, java.lang.String)' on a null object reference
1 Like
2

Hi,
I have exactly same problem. Have you found any solution?

3

Damn, this forum is like a graveyard sometimes. Either that or no one actually knows what they’re doing.

So yeah, I ended up doing the following:

  1. Override the load() function in your plugin class
  2. Store a reference to the bridge object
  3. Use that reference to call the trigger events instead.

e.g in your main plugin class:


public class MyPlugin extends Plugin {

    Bridge myBridge;


    @Override
    public void load() {   
        myBridge = bridge;
    }

    @PluginMethod
    public void someCall(PluginCall call) { 
        // do whatever you're doing.
        myBridge.triggerJSEvent(....)
    }

}
3 Likes
4

I found another solution. I looked it up at the existing capacitor App plugin.
You have to extend your definition file.


import type { PluginListenerHandle } from '@capacitor/core';

export type ScanButtonPressedListener = () => void;

/**
   * Listen for scanButtonPressed
   *
   * @since 1.0.0
   */
  addListener(
    eventName: 'scanButtonPressed',
    listenerFunc: ScanButtonPressedListener,
  ): Promise<PluginListenerHandle> & PluginListenerHandle;
1 Like
5

I am experiencing ‘addListener’ does not exist on plugin as well.

Property ‘addListener’ does not exist on type ‘MyPlugin’

Extending with Plugin interface provided by capacitor helps

import {registerPlugin} from "@capacitor/core";
import {Plugin} from "@capacitor/core/types/definitions";

export interface BleDemoPlugin extends Plugin{
  scanForReader(options: { value: string }): Promise<{ value: string }>;
}
1 Like
6

Us Typescript lovers will do just fine reverting to the ancient days of Javascript by essentially telling our compiler, “hold my beer.”

const eventListener = await (MyPlugin as any).addListener('eventName', (eventData: any) => this.doThings(eventData) );
1 Like
7

Hi, i guess it has been a bit too late, but here is correct solution:

in the ‘definitions.ts’ of your plugin project,
import ‘Plugin’ interface from ‘@capacitor/core’ and extend your interface definition, done

code snipes as following

import { Plugin } from '@capacitor/core'

export interface MyPlugin6Plugin extends Plugin {

echo(options: { value: string }): Promise<{ value: string }>;

}
2 Likes