minor changes to make linting happier (#598)

* minor changes to make linting happy

* remove cast since linter wasn't happy

* address PR comments

examples/repl.html

@@ -7,7 +7,7 @@
     <title>REPL</title>
 
     <link rel="icon" type="image/png" href="favicon.png" />
-    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript_base.css" />
+    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
     <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
   </head>
 

pyscriptjs/src/components/base.ts

@@ -1,22 +1,13 @@
-import { loadedEnvironments, mode, pyodideLoaded, type Environment } from '../stores';
+import { pyodideLoaded } from '../stores';
 import { guidGenerator, addClasses, removeClasses } from '../utils';
 import type { PyodideInterface } from '../pyodide';
 // Premise used to connect to the first available pyodide interpreter
-let runtime;
-let environments: Record<Environment['id'], Environment> = {};
-let currentMode;
+let runtime: PyodideInterface;
 let Element;
 
 pyodideLoaded.subscribe(value => {
     runtime = value;
 });
-loadedEnvironments.subscribe(value => {
-    environments = value;
-});
-
-mode.subscribe(value => {
-    currentMode = value;
-});
 
 export class BaseEvalElement extends HTMLElement {
     shadow: ShadowRoot;
@@ -120,30 +111,29 @@ export class BaseEvalElement extends HTMLElement {
         console.log('evaluate');
         this.preEvaluate();
 
-        const pyodide = runtime;
         let source: string;
-        let output;
+        let output: string;
         try {
             source = this.source ? await this.getSourceFromFile(this.source)
                                  : this.getSourceFromElement();
             const is_async = source.includes('asyncio')
 
-            await this._register_esm(pyodide);
+            await this._register_esm(runtime);
             if (is_async) {
-                await pyodide.runPythonAsync(
+                <string>await runtime.runPythonAsync(
                     `output_manager.change(out="${this.outputElement.id}", err="${this.errorElement.id}", append=${this.appendOutput ? 'True' : 'False'})`,
                 );
-                output = await pyodide.runPythonAsync(source);
+                output = <string>await runtime.runPythonAsync(source);
             } else {
-                output = pyodide.runPython(
+                output = <string>runtime.runPython(
                     `output_manager.change(out="${this.outputElement.id}", err="${this.errorElement.id}", append=${this.appendOutput ? 'True' : 'False'})`,
                 );
-                output = pyodide.runPython(source);
+                output = <string>runtime.runPython(source);
             }
 
             if (output !== undefined) {
                 if (Element === undefined) {
-                    Element = pyodide.globals.get('Element');
+                    Element = <Element>runtime.globals.get('Element');
                 }
                 const out = Element(this.outputElement.id);
                 out.write.callKwargs(output, { append: this.appendOutput });
@@ -152,8 +142,8 @@ export class BaseEvalElement extends HTMLElement {
                 this.outputElement.style.display = 'block';
             }
 
-            is_async ? await pyodide.runPythonAsync(`output_manager.revert()`)
-                     : await pyodide.runPython(`output_manager.revert()`);
+            is_async ? await runtime.runPythonAsync(`output_manager.revert()`)
+                     : await runtime.runPython(`output_manager.revert()`);
 
             // check if this REPL contains errors, delete them and remove error classes
             const errorElements = document.querySelectorAll(`div[id^='${this.errorElement.id}'][error]`);
@@ -171,7 +161,7 @@ export class BaseEvalElement extends HTMLElement {
             this.postEvaluate();
         } catch (err) {
             if (Element === undefined) {
-                Element = pyodide.globals.get('Element');
+                Element = <Element>runtime.globals.get('Element');
             }
             const out = Element(this.errorElement.id);
 

pyscriptjs/src/components/pyconfig.ts

@@ -14,6 +14,7 @@ import {
 import { loadInterpreter } from '../interpreter';
 import type { PyLoader } from './pyloader';
 import type { PyScript } from './pyscript';
+import type { PyodideInterface } from '../pyodide';
 
 const DEFAULT_RUNTIME = {
     src: 'https://cdn.jsdelivr.net/pyodide/v0.20.0/full/pyodide.js',
@@ -69,8 +70,6 @@ mode.subscribe((value: string) => {
     console.log('post initializers set');
 });
 
-let pyodideReadyPromise;
-
 let loader: PyLoader | undefined;
 globalLoader.subscribe(value => {
     loader = value;
@@ -86,11 +85,9 @@ export class PyodideRuntime extends Object {
 
     async initialize() {
         loader?.log('Loading runtime...');
-        pyodideReadyPromise = loadInterpreter(this.src);
-        const pyodide = await pyodideReadyPromise;
+        const pyodide: PyodideInterface = await loadInterpreter(this.src);
         const newEnv = {
             id: 'a',
-            promise: pyodideReadyPromise,
             runtime: pyodide,
             state: 'loading',
         };
@@ -116,7 +113,7 @@ export class PyodideRuntime extends Object {
         loader?.log('Initializing scripts...');
         if (mode_ == 'play') {
             for (const script of scriptsQueue_) {
-                script.evaluate();
+                await script.evaluate();
             }
             scriptsQueue.set([]);
         }
@@ -129,11 +126,9 @@ export class PyodideRuntime extends Object {
             console.log('------ loader closed ------');
         }
 
-        setTimeout(() => {
-            for (const initializer of postInitializers_) {
-                initializer();
-            }
-        }, 3000);
+        for (const initializer of postInitializers_) {
+            await initializer();
+        }
     }
 }
 

pyscriptjs/src/components/pyenv.ts

@@ -3,10 +3,10 @@ import * as jsyaml from 'js-yaml';
 import { pyodideLoaded, addInitializer } from '../stores';
 import { loadPackage, loadFromFile } from '../interpreter';
 import { handleFetchError } from '../utils';
+import type { PyodideInterface } from '../pyodide';
 
 // Premise used to connect to the first available pyodide interpreter
-let pyodideReadyPromise;
-let runtime;
+let runtime: PyodideInterface;
 
 pyodideLoaded.subscribe(value => {
     runtime = value;
@@ -18,7 +18,7 @@ export class PyEnv extends HTMLElement {
     wrapper: HTMLElement;
     code: string;
     environment: unknown;
-    runtime: any;
+    runtime: PyodideInterface;
     env: string[];
     paths: string[];
 
@@ -67,7 +67,7 @@ export class PyEnv extends HTMLElement {
                     await loadFromFile(singleFile, runtime);
                 } catch (e) {
                     //Should we still export full error contents to console?
-                    handleFetchError(e, singleFile);
+                    handleFetchError(<Error>e, singleFile);
                 }
             }
             console.log('paths loaded');

pyscriptjs/src/components/pyrepl.ts

@@ -4,33 +4,9 @@ import { Compartment, StateCommand } from '@codemirror/state';
 import { keymap } from '@codemirror/view';
 import { defaultKeymap } from '@codemirror/commands';
 import { oneDarkTheme } from '@codemirror/theme-one-dark';
-
-import { componentDetailsNavOpen, loadedEnvironments, mode, pyodideLoaded, type Environment } from '../stores';
 import { addClasses, htmlDecode } from '../utils';
 import { BaseEvalElement } from './base';
 
-// Premise used to connect to the first available pyodide interpreter
-
-let pyodideReadyPromise;
-let environments: Record<Environment['id'], Environment> = {};
-let currentMode;
-
-pyodideLoaded.subscribe(value => {
-    pyodideReadyPromise = value;
-});
-
-loadedEnvironments.subscribe(value => {
-    environments = value;
-});
-
-let propertiesNavOpen;
-componentDetailsNavOpen.subscribe(value => {
-    propertiesNavOpen = value;
-});
-
-mode.subscribe(value => {
-    currentMode = value;
-});
 
 function createCmdHandler(el: PyRepl): StateCommand {
     // Creates a codemirror cmd handler that calls the el.evaluate when an event

pyscriptjs/src/interpreter.ts

@@ -1,11 +1,12 @@
 import { getLastPath } from './utils';
 import type { PyodideInterface } from './pyodide';
+
 // eslint-disable-next-line
 // @ts-ignore
 import pyscript from './pyscript.py';
 
 let pyodideReadyPromise;
-let pyodide;
+let pyodide: PyodideInterface;
 
 const loadInterpreter = async function (indexUrl: string): Promise<PyodideInterface> {
     console.log('creating pyodide runtime');
@@ -23,7 +24,11 @@ const loadInterpreter = async function (indexUrl: string): Promise<PyodideInterf
     await pyodide.loadPackage('micropip');
 
     console.log('loading pyscript...');
-    await pyodide.runPythonAsync(pyscript);
+
+    const output = await pyodide.runPythonAsync(pyscript);
+    if (output !== undefined) {
+        console.log(output);
+    }
 
     console.log('done setting up environment');
     return pyodide;
@@ -31,7 +36,7 @@ const loadInterpreter = async function (indexUrl: string): Promise<PyodideInterf
 
 const loadPackage = async function (package_name: string[] | string, runtime: PyodideInterface): Promise<void> {
     if (package_name.length > 0){
-        const micropip = pyodide.globals.get('micropip');
+        const micropip = runtime.globals.get('micropip');
         await micropip.install(package_name);
         micropip.destroy();
     }

pyscriptjs/src/main.ts

@@ -13,6 +13,7 @@ import { PyLoader } from './components/pyloader';
 import { globalLoader } from './stores';
 import { PyConfig } from './components/pyconfig';
 
+/* eslint-disable @typescript-eslint/no-unused-vars */
 const xPyScript = customElements.define('py-script', PyScript);
 const xPyRepl = customElements.define('py-repl', PyRepl);
 const xPyEnv = customElements.define('py-env', PyEnv);
@@ -23,6 +24,7 @@ const xPyInputBox = customElements.define('py-inputbox', PyInputBox);
 const xPyWidget = customElements.define('py-register-widget', PyWidget);
 const xPyLoader = customElements.define('py-loader', PyLoader);
 const xPyConfig = customElements.define('py-config', PyConfig);
+/* eslint-enable @typescript-eslint/no-unused-vars */
 
 // As first thing, loop for application configs
 const config: PyConfig = document.querySelector('py-config');

pyscriptjs/src/stores.ts

@@ -7,15 +7,11 @@ export type Initializer = () => Promise<void>;
 
 export type Environment = {
     id: string;
-    promise: Promise<PyodideInterface>;
     runtime: PyodideInterface;
     state: string;
 };
 
-export const pyodideLoaded = writable({
-    loaded: false,
-    premise: null,
-});
+export const pyodideLoaded = writable();
 
 export const loadedEnvironments = writable<Record<Environment['id'], Environment>>({});
 export const DEFAULT_MODE = 'play';

pyscriptjs/src/utils.ts

@@ -60,7 +60,7 @@ function showError(msg: string): void {
 
 function handleFetchError(e: Error, singleFile: string) {
     //Should we still export full error contents to console?
-    console.warn('Caught an error in loadPaths:\r\n' + e);
+    console.warn(`Caught an error in loadPaths:\r\n ${e.toString()}`);
     let errorContent: string;
     if (e.message.includes('TypeError: Failed to fetch')) {
         errorContent = `<p>PyScript: Access to local files