test: default serializer for widgets

Author: maartenbreddels

packages/base/test/karma-cov.conf.js

@@ -15,7 +15,7 @@ module.exports = function (config) {
       ],
     },
     mochaReporter: {
-      showDiff: true
+      showDiff: true,
     },
     port: 9876,
     colors: true,

packages/base/test/karma.conf.js

@@ -4,7 +4,7 @@ module.exports = function (config) {
     frameworks: ['mocha'],
     reporters: ['mocha'],
     mochaReporter: {
-      showDiff: true
+      showDiff: true,
     },
     files: ['test/build/bundle.js'],
     port: 9876,

packages/base/test/src/dummy-manager.ts

@@ -133,11 +133,35 @@ class BinaryWidgetView extends TestWidgetView {
   _rendered = 0;
 }
 
+class ContainerWidget extends TestWidget {
+  static serializers = {
+    ...widgets.WidgetModel.serializers,
+    children: { deserialize: widgets.unpack_models },
+  };
+  defaults(): Backbone.ObjectHash {
+    return {
+      ...super.defaults(),
+      _model_name: 'ContainerWidget',
+      _view_name: 'ContainerWidgetView',
+      children: [],
+    };
+  }
+}
+
+class ContainerWidgetView extends TestWidgetView {
+  render(): void {
+    this._rendered += 1;
+  }
+  _rendered = 0;
+}
+
 const testWidgets = {
   TestWidget,
   TestWidgetView,
   BinaryWidget,
   BinaryWidgetView,
+  ContainerWidget,
+  ContainerWidgetView,
 };
 
 export class DummyManager implements widgets.IWidgetManager {

packages/base/test/src/widget_test.ts

@@ -71,6 +71,48 @@ describe('unpack_models', function () {
   });
 });
 
+describe('serialize/deserialize', function () {
+  before(async function () {
+    this.manager = new DummyManager();
+    this.widgetChild = await this.manager.new_widget({
+      model_name: 'WidgetModel',
+      model_module: '@jupyter-widgets/base',
+      model_module_version: '1.2.0',
+      view_name: 'WidgetView',
+      view_module: '@jupyter-widgets/base',
+      view_module_version: '1.2.0',
+      model_id: 'widgetChild',
+    });
+
+    this.widgetContainer = await this.manager.new_widget(
+      {
+        model_name: 'ContainerWidget',
+        model_module: 'test-widgets',
+        model_module_version: '1.2.0',
+        view_name: 'ContainerWidgetView',
+        view_module: 'test-widgets',
+        view_module_version: '1.2.0',
+        model_id: 'widgetContainer',
+      },
+      { children: [`IPY_MODEL_${this.widgetChild.model_id}`] }
+    );
+  });
+  it('serializes', function () {
+    const state = this.widgetContainer.get_state(false);
+    const serializedState = this.widgetContainer.serialize(state);
+    expect(serializedState).to.deep.equal({
+      _model_module: 'test-widgets',
+      _model_module_version: '1.0.0',
+      _model_name: 'ContainerWidget',
+      _view_count: null,
+      _view_module: 'test-widgets',
+      _view_module_version: '1.0.0',
+      _view_name: 'ContainerWidgetView',
+      children: ['IPY_MODEL_widgetChild'],
+    });
+  });
+});
+
 describe('WidgetModel', function () {
   before(async function () {
     this.setup = async function (): Promise<void> {