More plugins: splashscreen and importmap (#938)

This PR move codes from main.ts into two new plugins:

- splashscreen (formerly known as py-loader)
- importmap

The old setting config.autoclose_loader is still supported but deprecated; the new setting is config.splashscreen.autoclose.

Moreover, it does a small refactoring around UserError: now UserErrors are correctly caught even if they are raised from within afterRuntimeLoad.

pyscriptjs/tests/unit/exceptions.test.ts

@@ -1,5 +1,5 @@
 import { expect, it, jest } from "@jest/globals"
-import { _createAlertBanner, withUserErrorHandler, UserError } from "../../src/exceptions"
+import { _createAlertBanner, UserError } from "../../src/exceptions"
 
 describe("Test _createAlertBanner", () => {
 
@@ -80,41 +80,8 @@ describe("Test _createAlertBanner", () => {
     _createAlertBanner("Test warning", "warning", "text", false);
     expect(warnLogSpy).not.toHaveBeenCalledWith("Test warning");
   })
-})
 
 
-describe("Test withUserErrorHandler", () => {
-
-  afterEach(() => {
-    // Ensure we always have a clean body
-    document.body.innerHTML = `<div>Hello World</div>`;
-  })
-
-  it("userError doesn't stop execution", async () => {
-    function exception() {
-      throw new UserError("Computer says no");
-    }
-
-    function func() {
-      withUserErrorHandler(exception);
-      return "Hello, world";
-    }
-
-    const returnValue = func();
-    const banners = document.getElementsByClassName("alert-banner");
-    expect(banners.length).toBe(1);
-    expect(banners[0].innerHTML).toBe("Computer says no");
-    expect(returnValue).toBe("Hello, world");
-  })
-
-  it("any other exception should stop execution and raise", async () => {
-    function exception() {
-      throw new Error("Explosions!");
-    }
-
-    expect(() => withUserErrorHandler(exception)).toThrow(new Error("Explosions!"))
-  })
-
   it('_createAlertbanner messageType text writes message to content', async () => {
     let banner = document.getElementsByClassName("alert-banner");
     expect(banner.length).toBe(0);

pyscriptjs/tests/unit/main.test.ts

@@ -0,0 +1,69 @@
+import { jest } from "@jest/globals"
+import { UserError } from "../../src/exceptions"
+import { PyScriptApp } from "../../src/main"
+
+describe("Test withUserErrorHandler", () => {
+
+    class MyApp extends PyScriptApp {
+        myRealMain: any;
+
+        constructor(myRealMain) {
+            super();
+            this.myRealMain = myRealMain;
+        }
+
+        _realMain() {
+            this.myRealMain();
+        }
+    }
+
+    beforeEach(() => {
+        // Ensure we always have a clean body
+        document.body.innerHTML = `<div>Hello World</div>`;
+    });
+
+    it("userError doesn't stop execution", () => {
+        function myRealMain() {
+            throw new UserError("Computer says no");
+        }
+
+        const app = new MyApp(myRealMain);
+        app.main();
+        const banners = document.getElementsByClassName("alert-banner");
+        expect(banners.length).toBe(1);
+        expect(banners[0].innerHTML).toBe("Computer says no");
+    });
+
+    it("userError escapes by default", () => {
+        function myRealMain() {
+            throw new UserError("hello <br>");
+        }
+
+        const app = new MyApp(myRealMain);
+        app.main();
+        const banners = document.getElementsByClassName("alert-banner");
+        expect(banners.length).toBe(1);
+        expect(banners[0].innerHTML).toBe("hello &lt;br&gt;");
+    });
+
+    it("userError messageType=html don't escape", () => {
+        function myRealMain() {
+            throw new UserError("hello <br>", "html");
+        }
+
+        const app = new MyApp(myRealMain);
+        app.main();
+        const banners = document.getElementsByClassName("alert-banner");
+        expect(banners.length).toBe(1);
+        expect(banners[0].innerHTML).toBe("hello <br>");
+    });
+
+    it("any other exception should stop execution and raise", () => {
+        function myRealMain() {
+            throw new Error("Explosions!");
+        }
+
+        const app = new MyApp(myRealMain);
+        expect(() => app.main()).toThrow(new Error("Explosions!"))
+    });
+});

pyscriptjs/tests/unit/pyloader.test.ts

@@ -1,52 +0,0 @@
-import { jest } from '@jest/globals';
-import { PyLoader } from "../../src/components/pyloader"
-import { getLogger } from "../../src/logger"
-
-customElements.define('py-loader', PyLoader);
-
-describe('PyLoader', () => {
-  let instance: PyLoader;
-  const logger = getLogger("py-loader")
-
-
-  beforeEach(() => {
-    instance = new PyLoader();
-    logger.info = jest.fn()
-  })
-
-  it('PyLoader instantiates correctly', async () => {
-    expect (instance).toBeInstanceOf(PyLoader);
-  })
-
-  it('connectedCallback adds splash screen', async () => {
-    // innerHTML should be empty
-    expect(instance.innerHTML).toBe("")
-    instance.connectedCallback();
-
-    // This is just checking that we have some ids or class names
-    expect(instance.innerHTML).toContain('pyscript_loading_splash')
-    expect(instance.innerHTML).toContain("spinner")
-
-    expect(instance.mount_name).toBe("")
-  })
-
-  it('confirm calling log will log to console and page', () => {
-    const element = document.createElement('div')
-    element.setAttribute("id", "pyscript-operation-details")
-
-    instance.details = element
-    instance.log("Hello, world!")
-
-    const printedLog = element.getElementsByTagName('p')
-
-    expect(logger.info).toHaveBeenCalledWith("Hello, world!")
-    expect(printedLog[0].innerText).toBe("Hello, world!")
-  })
-
-  it('confirm that calling close removes element', async () => {
-    instance.remove = jest.fn()
-    instance.close()
-    expect(logger.info).toHaveBeenCalledWith("Closing")
-    expect(instance.remove).toHaveBeenCalled()
-  })
-})