Slintpad: allow to load libraries with ?lib=foo=https://... (#9441)

Also allow `https://` URL to be mapped directly for libraries
(without loading them in a editor tab)

Author: ogoffart

internal/compiler/tests/syntax/imports/library.slint

@@ -8,8 +8,6 @@ import { NotFound } from "@not-found/foo.slint";
 
 import { NotFound2 } from "@test-lib/lib.slint";
 //                        ^error{No exported type called 'NotFound2' found in "@test-lib/lib.slint"}
-import { NotFound3 } from "@test-lib/not-existing.slint";
-//                        ^error{Cannot find requested import "@test-lib/not-existing.slint" in the library search path}
 
 import { NotFound4 } from "@notexist";
 //                        ^error{Cannot find requested import "@notexist" in the library search path}

internal/compiler/typeloader.rs

@@ -4,6 +4,7 @@
 use smol_str::{SmolStr, ToSmolStr};
 use std::cell::RefCell;
 use std::collections::{HashMap, HashSet};
+use std::io::ErrorKind;
 use std::path::{Path, PathBuf};
 use std::rc::{Rc, Weak};
 
@@ -931,10 +932,7 @@ impl TypeLoader {
         }
         self.all_documents.dependencies.remove(path);
         if self.all_documents.currently_loading.contains_key(path) {
-            Err(std::io::Error::new(
-                std::io::ErrorKind::InvalidInput,
-                format!("{path:?} is still loading"),
-            ))
+            Err(std::io::Error::new(ErrorKind::InvalidInput, format!("{path:?} is still loading")))
         } else {
             Ok(())
         }
@@ -1205,11 +1203,13 @@ impl TypeLoader {
     ) -> Option<PathBuf> {
         let mut borrowed_state = state.borrow_mut();
 
+        let mut resolved = false;
         let (path_canon, builtin) = match borrowed_state
             .tl
             .resolve_import_path(import_token.as_ref(), file_to_import)
         {
             Some(x) => {
+                resolved = true;
                 if let Some(file_name) = x.0.file_name().and_then(|f| f.to_str()) {
                     let len = file_to_import.len();
                     if !file_to_import.ends_with(file_name)
@@ -1325,7 +1325,10 @@ impl TypeLoader {
                     Some(&path_canon),
                     state.borrow_mut().diag,
                 )),
-                Err(err) if err.kind() == std::io::ErrorKind::NotFound => {
+                Err(err)
+                    if !resolved
+                        && matches!(err.kind(), ErrorKind::NotFound | ErrorKind::NotADirectory) =>
+                {
                     state.borrow_mut().diag.push_error(
                             if file_to_import.starts_with('@') {
                                 format!(
@@ -1582,6 +1585,7 @@ impl TypeLoader {
             };
             crate::fileaccess::load_file(path.as_path())
                 .map(|virtual_file| (virtual_file.canon_path, virtual_file.builtin_contents))
+                .or_else(|| Some((path, None)))
         })
     }
 
@@ -2118,12 +2122,27 @@ import { E } from "@unknown/lib.slint";
     assert!(build_diagnostics.has_errors());
     let diags = build_diagnostics.to_string_vec();
     assert_eq!(diags.len(), 5);
-    assert!(diags[0].starts_with(&format!(
-        "HELLO:3: Error reading requested import \"{}\": ",
-        test_source_path.to_string_lossy()
-    )));
-    assert_eq!(&diags[1], "HELLO:4: Cannot find requested import \"@libdir/unknown.slint\" in the library search path");
-    assert_eq!(&diags[2], "HELLO:5: Cannot find requested import \"@libfile.slint/unknown.slint\" in the library search path");
+    assert_starts_with(
+        &diags[0],
+        &format!(
+            "HELLO:3: Error reading requested import \"{}\": ",
+            test_source_path.to_string_lossy()
+        ),
+    );
+    assert_starts_with(
+        &diags[1],
+        &format!(
+            "HELLO:4: Error reading requested import \"{}\": ",
+            test_source_path.join("unknown.slint").to_string_lossy(),
+        ),
+    );
+    assert_starts_with(
+        &diags[2],
+        &format!(
+            "HELLO:5: Error reading requested import \"{}\": ",
+            test_source_path.join("lib.slint").join("unknown.slint").to_string_lossy()
+        ),
+    );
     assert_eq!(
         &diags[3],
         "HELLO:6: Cannot find requested import \"@unknown\" in the library search path"
@@ -2132,6 +2151,11 @@ import { E } from "@unknown/lib.slint";
         &diags[4],
         "HELLO:7: Cannot find requested import \"@unknown/lib.slint\" in the library search path"
     );
+
+    #[track_caller]
+    fn assert_starts_with(actual: &str, start: &str) {
+        assert!(actual.starts_with(start), "{actual:?} does not start with {start:?}");
+    }
 }
 
 #[test]

tools/slintpad/README.md

@@ -55,4 +55,10 @@ The `preview.html` page contains only the preview and the code must be given via
     -   https://slint.dev/editor/?snippet=_+%3A%3D+Text+%7B+text%3A+%22Hello+Slint%22%3B+%7D?style=fluent-dark
     -   https://slint.dev/editor/preview.html?snippet=_+%3A%3D+Text+%7B+text%3A+%22Hello+Slint%22%3B+%7D?style=material
 
--   `?gz=` Like `?snippet=` but compressed with gzip and base64 encoded.
+-   `?gz=` Like `?snippet=` but compressed with gzip and base64 encoded.
+
+-   `?lib=lib_name=<url>` query argument, followed by the name of the library and the URL to load it from.
+
+    Example: The to use the `@material` library:
+
+     -   https://slint.dev/editor/?lib=material=https://raw.githubusercontent.com/slint-ui/material-components/refs/heads/master/material.slint

tools/slintpad/src/editor_widget.ts

@@ -613,24 +613,28 @@ export class EditorWidget extends Widget {
     }
 
     protected async handle_lsp_url_request(url: string): Promise<string> {
-        if (this.#url_mapper === null) {
-            return Promise.resolve("Error: Can not resolve URL.");
-        }
+        if (url.startsWith("slintpad:/")) {
+            if (this.#url_mapper === null) {
+                return Promise.resolve("Error: Can not resolve URL.");
+            }
 
-        const internal_uri = monaco.Uri.parse(url);
-        const uri = this.#url_mapper.from_internal(internal_uri);
+            const internal_uri = monaco.Uri.parse(url);
+            const uri = this.#url_mapper.from_internal(internal_uri);
 
-        if (uri === null) {
-            return Promise.resolve("Error: Can not map URL.");
-        }
+            if (uri === null) {
+                return Promise.resolve("Error: Can not map URL.");
+            }
 
-        return (
-            await this.safely_open_editor_with_url_content(
-                uri,
-                internal_uri,
-                false,
-            )
-        )[1];
+            return (
+                await this.safely_open_editor_with_url_content(
+                    uri,
+                    internal_uri,
+                    false,
+                )
+            )[1];
+        }
+        const r = await fetch(url);
+        return await r.text();
     }
 
     private async safely_open_editor_with_url_content(

tools/slintpad/src/lsp.ts

@@ -40,6 +40,25 @@ export type ShowDocumentCallback = (
     _position: LspPosition,
 ) => boolean;
 
+function configuration_from_url(): Map<string, any>[] {
+    var obj = new Map<string, any>();
+    const params = new URLSearchParams(window.location.search);
+    const include_paths = params.getAll("include");
+    if (include_paths.length > 0) {
+        obj.set("includePaths", include_paths);
+    }
+    const library_paths = params.getAll("lib");
+    if (library_paths.length > 0) {
+        const lib_map = new Map<string, string>();
+        for (const lib of library_paths) {
+            const [name, url] = lib.split("=");
+            lib_map.set(name, url);
+        }
+        obj.set("libraryPaths", lib_map);
+    }
+    return [obj];
+}
+
 function createLanguageClient(
     transports: MessageTransports,
 ): MonacoLanguageClient {
@@ -53,6 +72,16 @@ function createLanguageClient(
                 error: () => ({ action: ErrorAction.Continue }),
                 closed: () => ({ action: CloseAction.DoNotRestart }),
             },
+            middleware: {
+                workspace: {
+                    configuration: (params, token, next) => {
+                        if (params.items[0].section === "slint") {
+                            return configuration_from_url();
+                        }
+                        return next(params, token);
+                    },
+                },
+            },
         },
         // create a language client connection to the server running in the web worker
         connectionProvider: {