load html pages from service worker

src/editor/ui.js

@@ -227,7 +227,7 @@ export class UI {
               state.html_file == f
                 ? { value: f, selected: true }
                 : { value: f},
-              f == '' ? 'abount:blank' : f
+              f == '' ? 'about:blank' : f
             )
           )
       ),

src/effects.js

@@ -6,7 +6,7 @@ import {
   get_async_calls
 } from './calltree.js'
 import {FLAGS} from './feature_flags.js'
-import {exec} from './index.js'
+import {exec, FILES_ROOT} from './index.js'
 
 // Imports in the context of `run_window`, so global variables in loaded
 // modules refer to that window's context 
@@ -26,9 +26,12 @@ const load_external_imports = async state => {
       /^\w+:\/\//.test(u)    
         ? // starts with protocol, import as is
           u
-        : //local path, load using File System Access API, see service_worker.js
-          // Append fake host that will be intercepted in service worker
-          'https://leporello.import/' + u
+        : // local path, load using File System Access API, see service_worker.js
+          // Append special URL segment that will be intercepted in service worker
+          // Note that we use the same origin as current page (where Leporello
+          // is hosted), so Leporello can access window object for custom
+          // `html_file`
+          window.location.origin + '/' + FILES_ROOT + '/' + u
     ))
   )
   const modules = Object.fromEntries(

src/index.js

@@ -8,6 +8,9 @@ const EXAMPLE = `const fib = n =>
     : fib(n - 1) + fib(n - 2)
 fib(6)`
 
+// Fake directory, http requests to this directory intercepted by service_worker
+export const FILES_ROOT = '__leporello_files'
+
 const set_error_handler = w => {
   // TODO err.message
   w.onerror = (msg, src, lineNum, colNum, err) => {
@@ -19,9 +22,10 @@ const set_error_handler = w => {
 }
 
 const get_html_url = state => {
+  const base = window.location.origin + '/' + FILES_ROOT + '/' 
   return state.html_file == ''
-    ? 'about:blank'
-    : window.location.origin + '/' + state.html_file + '?leporello'
+    ? base + '__leporello_blank.html'
+    : base + state.html_file + '?leporello'
 }
 
 // By default run code in hidden iframe, until user explicitly opens visible