HTML embed fix: fallback to nglview-js-widgets 3.0.8 (working) for now. (#1112)

Author: hainm

nglview/tests/test_widget.py

@@ -527,7 +527,7 @@ def test_show_pymatgen():
 def test_show_qcelemental():
     import qcelemental as qcel
 
-    mol = qcel.models.Molecule.from_data("He 0 0 0") 
+    mol = qcel.models.Molecule.from_data("He 0 0 0")
     view = nv.show_qcelemental(mol)
     view
 
@@ -1025,15 +1025,17 @@ def test_write_html(mock_unset):
     display(view)
     fp = StringIO()
 
-    with patch.object(embed, 'embed_snippet') as mock_embed:
+    with patch.object(embed, 'embed_snippet') as mock_embed_snippet:
+        mock_embed_snippet.return_value = 'ok'
         nv.write_html(fp, [view], frame_range=(0, 3))
-        mock_embed.assert_called_with([tm, cm, view])
+        mock_embed_snippet.assert_called_with([tm, cm, view])
     mock_unset.assert_called_with()
     assert len(view._ngl_coordinate_resource[0]) == 3
     assert len(view._ngl_coordinate_resource[1]) == 3
 
     # box
-    with patch.object(embed, 'embed_snippet') as mock_embed:
+    with patch.object(embed, 'embed_snippet') as mock_embed_snippet:
+        mock_embed_snippet.return_value = 'ok'
         nv.write_html(fp, [HBox([view])], frame_range=(0, 3))
         # FIXME: assertion?
 

nglview/widget.py

@@ -1,12 +1,13 @@
 import base64
 import json
+import re
 import threading
 import time
 import uuid
 from logging import getLogger
 
 import ipywidgets as widgets
-import ipywidgets.embed
+from ipywidgets import embed
 import numpy as np
 from IPython.display import display
 from ipywidgets import (Image, Box, DOMWidget, HBox, VBox, IntSlider, Output, Play, Widget,
@@ -84,9 +85,6 @@ def write_html(fp, views, frame_range=None):
     >>> nglview.write_html('index.html', [view], frame_range=(0, 5)) # doctest: +SKIP
     """
     views = isinstance(views, DOMWidget) and [views] or views
-    embed = ipywidgets.embed
-    color = None
-    theme = None
 
     for _, v in _INIT_VIEWS.items():
         views.insert(0, v)
@@ -110,6 +108,12 @@ def _unset_serialization(views):
     snippet = '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.css">\n'
     snippet += '<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">\n'
     snippet += embed.embed_snippet(views)
+    # hacky thing for https://github.com/nglviewer/nglview/issues/1107
+    # NGL must be fixed before we can remove this hack
+    _frontend = {'__frontend_version__': __frontend_version__}
+    pattern = r'("model_module":\s*"nglview-js-widgets",\s*"model_module_version":\s*)"' + re.escape(_frontend['__frontend_version__']) + '",'
+    replacement = r'\g<1>"3.0.8",'
+    snippet = re.sub(pattern, replacement, snippet)
     html_code = embed.html_template.format(title='nglview-demo',
                                            snippet=snippet)
 
@@ -332,7 +336,7 @@ def camera(self):
     @camera.setter
     def camera(self, value):
         """
-        
+
         Parameters
         ----------
         value : str, {'perspective', 'orthographic'}
@@ -694,7 +698,7 @@ def _update_repr_dict(self):
 
     def set_representations(self, representations, component=0):
         """
-        
+
         Parameters
         ----------
         representations : list of dict
@@ -840,7 +844,7 @@ def _add_shape(self, shapes, name='shape'):
         Notes
         -----
         Supported shape: 'mesh', 'sphere', 'ellipsoid', 'cylinder', 'cone', 'arrow'.
-        
+
         See also
         --------
         {ngl_url}
@@ -983,7 +987,7 @@ def render_image(self,
         --------
             # tell NGL to render send image data to notebook.
             view.render_image()
-            
+
             # make sure to call `get_image` method
             view.get_image()
 
@@ -1183,7 +1187,7 @@ def add_pdbid(self, pdbid, **kwargs):
         >>> import nglview
         >>> view = nglview.NGLWidget()
         >>> c = view.add_pdbid('1tsu')
-        >>> # which is equal to 
+        >>> # which is equal to
         >>> # view.add_component('rcsb://1tsu.pdb')
         '''
         return self.add_component(f'rcsb://{pdbid}.pdb', **kwargs)
@@ -1331,7 +1335,7 @@ def _get_remote_call_msg(self,
                              kwargs=None,
                              **other_kwargs):
         """call NGL's methods from Python.
-        
+
         Parameters
         ----------
         method_name : str