Merge pull request #4233 from gnestor/upgrade-vega-embed

Update vega3-extension to work with altair 2

packages/vega3-extension/src/index.ts

@@ -84,10 +84,27 @@ class RenderedVega3 extends Widget implements IRenderMime.IRenderer {
           loader,
           actions: true
         };
-        return vegaEmbed(this.node as HTMLBaseElement, data, options).then((result) => {
-          // result contains the Vega spec and view
+        return vegaEmbed(this.node as HTMLBaseElement, data, options).then((result: any) => {
+          // Add png representation of vega chart to output
+          if (!model.data['image/png']) {
+            return result.view.toImageURL('png').then((imageData: any) => {
+              const data = { ...model.data, 'image/png': imageData.split(',')[1] };
+              model.setData({ data });
+            });
+          }
           return void 0;
-        }).catch(console.warn);
+        }).catch(error => {
+          // Add stderr message to output
+          const stderr = `Javascript Error: ${error.message}. This usually means there's a typo in your chart specification. See the JavaScript console for the full traceback.`;
+          const data = { 'application/vnd.jupyter.stderr': stderr };
+          model.setData({ data });
+          // Manually append stderr message to output and modify node attributes
+          this.node.innerHTML = `<pre>Javascript Error: ${error.message}. This usually means there's a typo in your chart specification. See the JavaScript console for the full traceback.</pre>`;
+          this.addClass('jp-RenderedText');
+          this.removeClass(VEGA_COMMON_CLASS);
+          this.node.setAttribute('data-mime-type', 'application/vnd.jupyter.stderr');
+          return void 0;
+        });
       });
     });
   }