Process Lumino messages with compatibility with Phosphor

See jupyter-widgets/ipywidgets/pull/3124 for resize change rationale

Author: abdelq

packages/javascript/jupyterlab-plotly/src/Figure.ts

@@ -716,7 +716,10 @@ export class FigureModel extends DOMWidgetModel {
 
   static serializers: ISerializers = {
     ...DOMWidgetModel.serializers,
-    _data: { deserialize: py2js_deserializer, serialize: js2py_serializer },
+    _data: {
+      deserialize: py2js_deserializer,
+      serialize: js2py_serializer,
+    },
     _layout: {
       deserialize: py2js_deserializer,
       serialize: js2py_serializer,
@@ -806,7 +809,7 @@ export class FigureView extends DOMWidgetView {
   viewID: string;
 
   /**
-   * The perform_render method is called by processPhosphorMessage
+   * The perform_render method is called by processLuminoMessage
    * after the widget's DOM element has been attached to the notebook
    * output cell. This happens after the initialize of the
    * FigureModel, and it won't happen at all if the Python FigureWidget
@@ -900,10 +903,10 @@ export class FigureView extends DOMWidgetView {
   }
 
   /**
-   * Respond to phosphorjs events
+   * Respond to Lumino events
    */
-  processPhosphorMessage(msg: any) {
-    super.processPhosphorMessage.apply(this, arguments);
+  _processLuminoMessage(msg: any, _super: any) {
+    _super.apply(this, arguments);
     var that = this;
     switch (msg.type) {
       case "before-attach":
@@ -921,10 +924,6 @@ export class FigureView extends DOMWidgetView {
           xaxis: axisHidden,
           yaxis: axisHidden,
         });
-
-        window.addEventListener("resize", function () {
-          that.autosizeFigure();
-        });
         break;
       case "after-attach":
         // Rendering actual figure in the after-attach event allows
@@ -938,6 +937,21 @@ export class FigureView extends DOMWidgetView {
     }
   }
 
+  processPhosphorMessage(msg: any) {
+    this._processLuminoMessage(msg, super["processPhosphorMessage"]);
+
+    var that = this;
+    if (msg.type === "before-attach") {
+      window.addEventListener("resize", function () {
+        that.autosizeFigure();
+      });
+    }
+  }
+
+  processLuminoMessage(msg: any) {
+    this._processLuminoMessage(msg, super["processLuminoMessage"]);
+  }
+
   autosizeFigure() {
     var that = this;
     var layout = that.model.get("_layout");