[Mojo WebUI] Move removeListener to CallbackRouters.

This CL makes the CallbackRouters responsible for removing listeners.
This improves ergonomics of removing a list of listeners for different
InterfaceCallbackTargets.

Bug: 894376
Change-Id: I051857e463257100d667cf78ca8cc2c1d53bcd83
Reviewed-on: https://chromium-review.googlesource.com/c/1301034
Commit-Queue: calamity <calamity@chromium.org>
Reviewed-by: Ken Rockot <rockot@google.com>
Cr-Commit-Position: refs/heads/master@{#607512}

mojo/public/js/bindings_lite.js

@@ -284,25 +284,18 @@ mojo.internal.InterfaceProxyBase = class {
  * messages as Event-like things.
  * @export
  */
-mojo.internal.InterfaceCallbackTarget = class {
-  /** @public */
+mojo.internal.CallbackRouter = class {
   constructor() {
-    /** @private {!Map<number, !Function>} */
-    this.listeners_ = new Map;
+    /** @type {!Map<number, !Function>} */
+    this.removeCallbacks = new Map;
 
     /** @private {number} */
     this.nextListenerId_ = 0;
   }
 
-  /**
-   * @param {!Function} listener
-   * @return {number} A unique ID for the added listener.
-   * @export
-   */
-  addListener(listener) {
-    const id = ++this.nextListenerId_;
-    this.listeners_.set(id, listener);
-    return id;
+  /** @return {number} */
+  getNextId() {
+    return ++this.nextListenerId_;
   }
 
   /**
@@ -311,7 +304,41 @@ mojo.internal.InterfaceCallbackTarget = class {
    * @export
    */
   removeListener(id) {
-    return this.listeners_.delete(id);
+    this.removeCallbacks.get(id)();
+    return this.removeCallbacks.delete(id);
+  }
+};
+
+/**
+ * Helper used by generated CallbackRouter types to dispatch incoming interface
+ * messages to listeners.
+ * @export
+ */
+mojo.internal.InterfaceCallbackTarget = class {
+  /**
+   * @public
+   * @param {!mojo.internal.CallbackRouter} callbackRouter
+   */
+  constructor(callbackRouter) {
+    /** @private {!Map<number, !Function>} */
+    this.listeners_ = new Map;
+
+    /** @private {!mojo.internal.CallbackRouter} */
+    this.callbackRouter_ = callbackRouter;
+  }
+
+  /**
+   * @param {!Function} listener
+   * @return {number} A unique ID for the added listener.
+   * @export
+   */
+  addListener(listener) {
+    const id = this.callbackRouter_.getNextId();
+    this.listeners_.set(id, listener);
+    this.callbackRouter_.removeCallbacks.set(id, () => {
+      return this.listeners_.delete(id);
+    });
+    return id;
   }
 
   /**

mojo/public/tools/bindings/generators/js_templates/lite/interface_definition.tmpl

@@ -148,11 +148,13 @@ class {{interface.name}} {
 class {{interface.name}}CallbackRouter {
   constructor() {
     this.target_ = new mojo.internal.InterfaceTarget;
+    this.router_ = new mojo.internal.CallbackRouter;
 {%  for method in interface.methods %}
 {%-   set interface_message_id =
           interface.mojom_name ~ "_" ~ method.mojom_name %}
     /** @public {!mojo.internal.InterfaceCallbackTarget} */
-    this.{{method.name}} = new mojo.internal.InterfaceCallbackTarget;
+    this.{{method.name}} =
+        new mojo.internal.InterfaceCallbackTarget(this.router_);
     this.target_.registerHandler(
         {{method.ordinal}},
         {{interface_message_id}}_Params,
@@ -187,4 +189,12 @@ class {{interface.name}}CallbackRouter {
     this.target_.bindHandle(proxy.createRequest().handle);
     return proxy;
   }
+
+  /**
+   * @param {number} id An ID returned by a prior call to addListener.
+   * @return {boolean} True iff the identified listener was found and removed.
+   */
+  removeListener(id) {
+    return this.router_.removeListener(id);
+  }
 }

mojo/public/tools/bindings/generators/js_templates/lite/interface_externs.tmpl

@@ -84,4 +84,10 @@ goog.provide('{{module.namespace}}.{{interface.name}}CallbackRouter');
    * @return {!{{module.namespace}}.{{interface.name}}Proxy }
    */
   createProxy() {}
+
+  /**
+   * @param {number} id An ID returned by a prior call to addListener.
+   * @return {boolean} True iff the identified listener was found and removed.
+   */
+  removeListener(id) {}
 };

third_party/closure_compiler/externs/mojo.js

@@ -132,6 +132,16 @@ mojo.internal.InterfaceProxyBase = class {
   sendMessage(ordinal, paramStruct, responseStruct, args) {}
 };
 
+mojo.internal.CallbackRouter = class {
+  constructor() {}
+
+  /**
+   * @param {number} id
+   * @return {boolean}
+   */
+  removeListener(id) {}
+};
+
 mojo.internal.InterfaceTarget = class {
   constructor() {}
 
@@ -145,7 +155,10 @@ mojo.internal.InterfaceTarget = class {
 };
 
 mojo.internal.InterfaceCallbackTarget = class {
-  constructor() {}
+  /**
+   * @param {!mojo.internal.CallbackRouter} callbackRouter
+   */
+  constructor(callbackRouter) {}
 
   /**
    * @param {!Function} listener