feat(JitsiRemoteTrack): Add logs.

modules/RTC/JitsiRemoteTrack.js

 let ttfmTrackerAudioAttached = false;
 let ttfmTrackerVideoAttached = false;
 
+/**
+ * List of container events that we are going to process. _onContainerEventHandler will be added as listener to the
+ * container for every event in the list.
+ */
+const containerEvents = [
+    'abort', 'canplay', 'canplaythrough', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart',
+    'pause', 'play', 'playing', 'ratechange', 'stalled', 'suspend', 'waiting'
+];
+
 /* eslint-disable max-params */
 
 /**
         this.muted = muted;
         this.isP2P = isP2P;
 
+        logger.debug(`New remote track added: ${this}`);
+
         // we want to mark whether the track has been ever muted
         // to detect ttfm events for startmuted conferences, as it can
         // significantly increase ttfm values
 
         // Bind 'onmute' and 'onunmute' event handlers
         if (this.rtc && this.track) {
-            this._bindMuteHandlers();
+            this._bindTrackHandlers();
         }
+        this._containerHandlers = {};
+        containerEvents.forEach(event => {
+            this._containerHandlers[event] = this._containerEventHandler.bind(this, event);
+        });
     }
 
     /* eslint-enable max-params */
     /**
-     * Attaches the track muted handlers.
+     * Attaches the track handlers.
      *
      * @returns {void}
      */
-    _bindMuteHandlers() {
+    _bindTrackHandlers() {
         this.track.addEventListener('mute', () => this._onTrackMute());
         this.track.addEventListener('unmute', () => this._onTrackUnmute());
+        this.track.addEventListener('ended', () => {
+            logger.debug(`"onended" event(${Date.now()}): ${this}`);
+        });
     }
 
     /**
      * @returns {void}
      */
     _onTrackMute() {
-        logger.debug(
-            `"onmute" event(${Date.now()}): `,
-            this.getParticipantId(), this.getType(), this.getSSRC());
+        logger.debug(`"onmute" event(${Date.now()}): ${this}`);
 
         this.rtc.eventEmitter.emit(RTCEvents.REMOTE_TRACK_MUTE, this);
     }
      * @returns {void}
      */
     _onTrackUnmute() {
-        logger.debug(
-            `"onunmute" event(${Date.now()}): `,
-            this.getParticipantId(), this.getType(), this.getSSRC());
+        logger.debug(`"onunmute" event(${Date.now()}): ${this}`);
 
         this.rtc.eventEmitter.emit(RTCEvents.REMOTE_TRACK_UNMUTE, this);
     }
         container.addEventListener('canplay', this._playCallback.bind(this));
     }
 
+    /**
+     * Called when the track has been attached to a new container.
+     *
+     * @param {HTMLElement} container the HTML container which can be 'video' or
+     * 'audio' element.
+     * @private
+     */
+    _onTrackAttach(container) {
+        logger.debug(`Track has been attached to a container: ${this}`);
+
+        containerEvents.forEach(event => {
+            container.addEventListener(event, this._containerHandlers[event]);
+        });
+    }
+
+    /**
+     * Called when the track has been detached from a container.
+     *
+     * @param {HTMLElement} container the HTML container which can be 'video' or
+     * 'audio' element.
+     * @private
+     */
+    _onTrackDetach(container) {
+        logger.debug(`Track has been detached from a container: ${this}`);
+
+        containerEvents.forEach(event => {
+            container.removeEventListener(event, this._containerHandlers[event]);
+        });
+    }
+
+    /**
+     * An event handler for events triggered by the attached container.
+     *
+     * @param {string} type - The type of the event.
+     */
+    _containerEventHandler(type) {
+        logger.debug(`${type} handler was called for a container with attached ${this}`);
+    }
+
+    /**
+     * Returns a string with a description of the current status of the track.
+     *
+     * @returns {string}
+     */
+    _getStatus() {
+        const { enabled, muted, readyState } = this.track;
+
+        return `readyState: ${readyState}, muted: ${muted}, enabled: ${enabled}`;
+    }
+
     /**
      * Creates a text representation of this remote track instance.
      * @return {string}
      */
     toString() {
-        return `RemoteTrack[${
-            this.ownerEndpointId}, ${
-            this.getType()}, p2p: ${
-            this.isP2P}]`;
+        return `RemoteTrack[userID: ${this.getParticipantId()}, type: ${this.getType()}, ssrc: ${
+            this.getSSRC()}, p2p: ${this.isP2P}, status: ${this._getStatus()}]`;
     }
 }

modules/RTC/JitsiTrack.js

      */
     attach(container) {
         if (this.stream) {
+            this._onTrackAttach(container);
             RTCUtils.attachMediaStream(container, this.stream);
         }
         this.containers.push(container);
             const c = cs[i];
 
             if (!container) {
+                this._onTrackDetach(c);
                 RTCUtils.attachMediaStream(c, null);
             }
             if (!container || c === container) {
         }
 
         if (container) {
+            this._onTrackDetach(container);
             RTCUtils.attachMediaStream(container, null);
         }
     }
 
+    /**
+     * Called when the track has been attached to a new container.
+     *
+     * @param {HTMLElement} container the HTML container which can be 'video' or
+     * 'audio' element.
+     * @private
+     */
+    _onTrackAttach(container) { // eslint-disable-line no-unused-vars
+        // Should be defined by the classes that are extending JitsiTrack
+    }
+
+    /**
+     * Called when the track has been detached from a container.
+     *
+     * @param {HTMLElement} container the HTML container which can be 'video' or
+     * 'audio' element.
+     * @private
+     */
+    _onTrackDetach(container) { // eslint-disable-line no-unused-vars
+        // Should be defined by the classes that are extending JitsiTrack
+    }
+
     /**
      * Attach time to first media tracker only if there is conference and only
      * for the first element.