What is required for embedding a widget to work?

[janfreyberg]

Hi all,

I hope this isn't too wrong a place to ask this question - I debated asking on the main jupyter widget repo, but thought I'd try here first.

I am in the process of developing a custom widget. However, I am struggling with getting the widgets to embed properly in HTML. This isn't a critical feature, but I would like to have embedded widgets in the documentation.

The embedding doesn't seem to work, however, and I can't find additional information on what needs to be implemented before it works.

The javascript code is here:

https://github.com/janfreyberg/ipyannotations/tree/text/src/js

And the corresponding npm package is published here:

https://www.npmjs.com/package/ipyannotations

Ultimately, I'd like the embedding to work inside sphinx. However, this didn't work out of the box, and in the course of trying to isolate the embedding I followed the steps in the ipywidgets documentation to write a minimal HTML file that would render it. I've added this to the git repo:

https://github.com/janfreyberg/ipyannotations/blob/text/docs/export.html

And just for illustration I also created a jsfiddle here: https://jsfiddle.net/ps162znc/

As far as I can tell, the widget state is correctly embedded in the HTML file. Loading the file doesn't log any javascript errors.

What am I missing? Do I need to make further changes to the javascript code?

Any help would be greatly appreciated.

Thanks,
Jan