Handle theme loading errors (#3298)

* Add error handling to the theme manager load css function.

Fixes #3295

Previously, if loading a css file had an error, the theme manager would never be ready. Now the theme loader recognizes there is an error, logs the error, and continues.

* Load the optional roboto fonts outside of the css.

This way an error in loading the optional font (for example, on a computer note connected to the network) doesn't log an error.

packages/apputils/src/thememanager.ts

@@ -120,11 +120,13 @@ class ThemeManager {
     const link = document.createElement('link');
     const baseUrl = PageConfig.getOption('themePath');
     const delegate = new PromiseDelegate<void>();
+    const href = URLExt.join(baseUrl, path);
 
     link.rel = 'stylesheet';
     link.type = 'text/css';
-    link.href = URLExt.join(baseUrl, path);
+    link.href = href;
     link.onload = () => { delegate.resolve(void 0); };
+    link.onerror = () => { delegate.reject(`Stylesheet failed to load: ${href}`); };
     document.body.appendChild(link);
     this._links.push(link);
 

packages/theme-dark-extension/src/index.ts

@@ -20,6 +20,8 @@ const plugin: JupyterLabPlugin<void> = {
     manager.register({
       name: 'JupyterLab Dark',
       load: function() {
+        // Load the optional monospace font for the input/output prompt.
+        manager.loadCSS('https://fonts.googleapis.com/css?family=Roboto+Mono');
         return manager.loadCSS('@jupyterlab/theme-dark-extension/index.css');
       },
       unload: function() {

packages/theme-dark-extension/style/variables.css

@@ -25,12 +25,6 @@ all of MD as it is not optimized for dense, information rich UIs.
 */
 
 
-/*
- * Optional monospace font for input/output prompt.
- */
-@import url('https://fonts.googleapis.com/css?family=Roboto+Mono');
-
-
 :root {
 
   /* Borders

packages/theme-light-extension/src/index.ts

@@ -20,6 +20,8 @@ const plugin: JupyterLabPlugin<void> = {
     manager.register({
       name: 'JupyterLab Light',
       load: function() {
+        // Load the optional monospace font for the input/output prompt.
+        manager.loadCSS('https://fonts.googleapis.com/css?family=Roboto+Mono');
         return manager.loadCSS('@jupyterlab/theme-light-extension/index.css');
       },
       unload: function() {

packages/theme-light-extension/style/variables.css

@@ -25,12 +25,6 @@ all of MD as it is not optimized for dense, information rich UIs.
 */
 
 
-/*
- * Optional monospace font for input/output prompt.
- */
-@import url('https://fonts.googleapis.com/css?family=Roboto+Mono');
-
-
 :root {
 
   /* Borders