react-native-tts icon indicating copy to clipboard operation
react-native-tts copied to clipboard

Remove event listener not working; NativeEventEmitter.removeListener deprecated

Open mandrewsan opened this issue 2 years ago • 2 comments

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch [email protected] for the project I'm working on.

Remove event listener was breaking, apparently due to deprecation of NativeEventEmitter.removeListener.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-tts/index.js b/node_modules/react-native-tts/index.js
index 6da7573..684fb7a 100644
--- a/node_modules/react-native-tts/index.js
+++ b/node_modules/react-native-tts/index.js
@@ -116,11 +116,12 @@ class Tts extends NativeEventEmitter {
   }
 
   addEventListener(type, handler) {
-    return this.addListener(type, handler);
+    this.eventSubscription = this.addListener(type, handler)
+    return this.eventSubscription;
   }
 
-  removeEventListener(type, handler) {
-    this.removeListener(type, handler);
+  removeEventListener = (type, handler) => {
+    this.eventSubscription.remove();
   }
 }
 

This issue body was partially generated by patch-package.

mandrewsan avatar Dec 21 '22 19:12 mandrewsan

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch [email protected] for the project I'm working on.

Remove event listener was breaking, apparently due to deprecation of NativeEventEmitter.removeListener.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-tts/index.js b/node_modules/react-native-tts/index.js
index 6da7573..684fb7a 100644
--- a/node_modules/react-native-tts/index.js
+++ b/node_modules/react-native-tts/index.js
@@ -116,11 +116,12 @@ class Tts extends NativeEventEmitter {
   }
 
   addEventListener(type, handler) {
-    return this.addListener(type, handler);
+    this.eventSubscription = this.addListener(type, handler)
+    return this.eventSubscription;
   }
 
-  removeEventListener(type, handler) {
-    this.removeListener(type, handler);
+  removeEventListener = (type, handler) => {
+    this.eventSubscription.remove();
   }
 }
 

This issue body was partially generated by patch-package.

does not work, can you explain in more detail

praptoherlambang avatar Jan 21 '23 08:01 praptoherlambang

Here is the improved working version:

diff --git a/node_modules/react-native-tts/index.js b/node_modules/react-native-tts/index.js
index 6da7573..b6557fd 100644
--- a/node_modules/react-native-tts/index.js
+++ b/node_modules/react-native-tts/index.js
@@ -7,6 +7,8 @@ class Tts extends NativeEventEmitter {
     super(TextToSpeech);
   }
 
+  eventSubscription = new Map(); 
+
   getInitStatus() {
     if (Platform.OS === 'ios' || Platform.OS === 'windows') {
       return Promise.resolve(true);
@@ -116,11 +118,19 @@ class Tts extends NativeEventEmitter {
   }
 
   addEventListener(type, handler) {
-    return this.addListener(type, handler);
-  }
-
-  removeEventListener(type, handler) {
-    this.removeListener(type, handler);
+    const uniqueKey = [type, handler]; 
+    const listener = this.addListener(type, handler); 
+    this.eventSubscription.set(uniqueKey, listener); 
+    return listener; 
+  }
+
+  removeEventListener = (type, handler) => {
+    const uniqueKey = [type, handler];
+    const listener = this.eventSubscription.get(uniqueKey);
+    if (listener) {
+      listener.remove();
+      this.eventSubscription.delete(uniqueKey);
+    }
   }
 }

VVVi avatar Jul 19 '23 22:07 VVVi