elm-pages 2.1.9 → 2.1.10

package/generator/src/basepath-middleware.js

@@ -1,18 +1,23 @@
-const parseUrl = require("url").parse;
-
 // this middleware is only active when (config.base !== '/')
 
 module.exports = function baseMiddleware(base) {
   // Keep the named function. The name is visible in debug logs via `DEBUG=connect:dispatcher ...`
   return function viteBaseMiddleware(req, res, next) {
-    const url = req.url;
-    const parsed = parseUrl(url);
-    const path = parsed.pathname || "/";
+    // `req.url` only contains the path, since that is what gets passed in the HTTP request.
+    // See https://nodejs.org/api/http.html#http_message_url
+    const path = req.url;
 
-    if (path.startsWith(base)) {
-      // rewrite url to remove base.. this ensures that other middleware does
+    if (base === "/") {
+      // The RegExp will check for the slash, so we remove it here.
+      base = "";
+    }
+    // We want to detect the base at the beginning, hence the `^`,
+    // but also allow calling the base without a trailing slash, hence the `$`.
+    const baseRegExp = new RegExp(`^${base}(/|$)`);
+    if (baseRegExp.test(path)) {
+      // rewrite url to remove base. this ensures that other middleware does
       // not need to consider base being prepended or not
-      req.url = url.replace(base, "/");
+      req.url = path.replace(baseRegExp, "/");
       return next();
     }
 
@@ -26,9 +31,10 @@ module.exports = function baseMiddleware(base) {
     } else if (req.headers.accept && req.headers.accept.includes("text/html")) {
       // non-based page visit
       res.statusCode = 404;
+      const suggestionUrl = `${base}/${path.slice(1)}`;
       res.end(
         `The server is configured with a public base URL of ${base} - ` +
-          `did you mean to visit ${base}${url.slice(1)} instead?`
+        `did you mean to visit ${suggestionUrl} instead?`
       );
       return;
     }

package/generator/src/build.js

@@ -344,12 +344,61 @@ async function compileCliApp(options) {
   );
 
   const elmFileContent = await fsPromises.readFile(ELM_FILE_PATH, "utf-8");
+  // Source: https://github.com/elm-explorations/test/blob/d5eb84809de0f8bbf50303efd26889092c800609/src/Elm/Kernel/HtmlAsJson.js
+  const forceThunksSource = ` _HtmlAsJson_toJson(x)
+}
+
+              var virtualDomKernelConstants =
+  {
+    nodeTypeTagger: 4,
+    nodeTypeThunk: 5,
+    kids: "e",
+    refs: "l",
+    thunk: "m",
+    node: "k",
+    value: "a"
+  }
+
+function forceThunks(vNode) {
+  if (typeof vNode !== "undefined" && vNode.$ === "#2") {
+    // This is a tuple (the kids : List (String, Html) field of a Keyed node); recurse into the right side of the tuple
+    vNode.b = forceThunks(vNode.b);
+  }
+  if (typeof vNode !== 'undefined' && vNode.$ === virtualDomKernelConstants.nodeTypeThunk && !vNode[virtualDomKernelConstants.node]) {
+    // This is a lazy node; evaluate it
+    var args = vNode[virtualDomKernelConstants.thunk];
+    vNode[virtualDomKernelConstants.node] = vNode[virtualDomKernelConstants.thunk].apply(args);
+    // And then recurse into the evaluated node
+    vNode[virtualDomKernelConstants.node] = forceThunks(vNode[virtualDomKernelConstants.node]);
+  }
+  if (typeof vNode !== 'undefined' && vNode.$ === virtualDomKernelConstants.nodeTypeTagger) {
+    // This is an Html.map; recurse into the node it is wrapping
+    vNode[virtualDomKernelConstants.node] = forceThunks(vNode[virtualDomKernelConstants.node]);
+  }
+  if (typeof vNode !== 'undefined' && typeof vNode[virtualDomKernelConstants.kids] !== 'undefined') {
+    // This is something with children (either a node with kids : List Html, or keyed with kids : List (String, Html));
+    // recurse into the children
+    vNode[virtualDomKernelConstants.kids] = vNode[virtualDomKernelConstants.kids].map(forceThunks);
+  }
+  return vNode;
+}
+
+function _HtmlAsJson_toJson(html) {
+`;
+
   await fsPromises.writeFile(
     ELM_FILE_PATH,
     elmFileContent
       .replace(
         /return \$elm\$json\$Json\$Encode\$string\(.REPLACE_ME_WITH_JSON_STRINGIFY.\)/g,
-        "return " + (options.debug ? "_Json_wrap(x)" : "x")
+        "return " +
+          (options.debug
+            ? `${forceThunksSource}
+  return _Json_wrap(forceThunks(html));
+`
+            : `${forceThunksSource}
+return forceThunks(html);
+`)
       )
       .replace(
         "return ports ? { ports: ports } : {};",

package/generator/src/cli.js

@@ -47,6 +47,7 @@ async function main() {
       "Preserve the HTTP and JS Port cache instead of deleting it on server start"
     )
     .option("--base <basePath>", "serve site under a base path", "/")
+    .option("--https", "uses a https server")
     .action(async (options) => {
       if (!options.keepCache) {
         clearHttpAndPortCache();
@@ -108,16 +109,19 @@ function clearHttpAndPortCache() {
 }
 
 /**
- * @param {string} pagePath
+ * @param {string} rawPagePath
  */
-function normalizeUrl(pagePath) {
-  if (!pagePath.startsWith("/")) {
-    pagePath = "/" + pagePath;
-  }
-  if (!pagePath.endsWith("/")) {
-    pagePath = pagePath + "/";
-  }
-  return pagePath;
+function normalizeUrl(rawPagePath) {
+  const segments = rawPagePath
+    .split("/")
+    // Filter out all empty segments.
+    .filter((segment) => segment.length != 0);
+
+  // Do not add a trailing slash.
+  // The core issue is that `/base` is a prefix of `/base/`, but
+  // `/base/` is not a prefix of `/base`, which can later lead to issues
+  // with detecting whether the path contains the base.
+  return `/${segments.join("/")}`;
 }
 
 main();

package/generator/src/dev-server.js

@@ -8,6 +8,7 @@ const {
   runElmReview,
 } = require("./compile-elm.js");
 const http = require("http");
+const https = require("https");
 const codegen = require("./codegen.js");
 const kleur = require("kleur");
 const serveStatic = require("serve-static");
@@ -17,9 +18,10 @@ const { Worker, SHARE_ENV } = require("worker_threads");
 const os = require("os");
 const { ensureDirSync } = require("./file-helpers.js");
 const baseMiddleware = require("./basepath-middleware.js");
+const devcert = require("devcert");
 
 /**
- * @param {{ port: string; base: string }} options
+ * @param {{ port: string; base: string; https: boolean; }} options
  */
 async function start(options) {
   let threadReadyQueue = [];
@@ -28,6 +30,7 @@ async function start(options) {
   const cpuCount = os.cpus().length;
 
   const port = options.port;
+  const useHttps = options.https;
   let elmMakeRunning = true;
 
   const serve = serveStatic("public/", { index: false });
@@ -70,7 +73,7 @@ async function start(options) {
       });
     console.log(
       `${kleur.dim(`elm-pages dev server running at`)} ${kleur.green(
-        `<http://localhost:${port}>`
+        `<${useHttps ? "https" : "http"}://localhost:${port}>`
       )}`
     );
     const poolSize = Math.max(1, cpuCount / 2 - 1);
@@ -118,7 +121,12 @@ async function start(options) {
     .use(serveStaticCode)
     .use(serve)
     .use(processRequest);
-  http.createServer(app).listen(port);
+  if (useHttps) {
+    const ssl = await devcert.certificateFor("localhost");
+    https.createServer(ssl, app).listen(port);
+  } else {
+    http.createServer(app).listen(port);
+  }
   /**
    * @param {http.IncomingMessage} request
    * @param {http.ServerResponse} response
@@ -133,7 +141,6 @@ async function start(options) {
   }
 
   watcher.on("all", async function (eventName, pathThatChanged) {
-    // console.log({ pathThatChanged });
     if (pathThatChanged === "elm.json") {
       watchElmSourceDirs(false);
     } else if (pathThatChanged.endsWith(".css")) {

package/generator/src/generate-template-module-connector.js

@@ -168,12 +168,17 @@ view page maybePageUrl globalData pageData =
 
                               _ ->
                                   { title = "Model mismatch", body = Html.text <| "Model mismatch" }
-                  , head = Page.${moduleName(name)}.page.head
+                  , head = ${
+                    phase === "browser"
+                      ? "[]"
+                      : `Page.${moduleName(name)}.page.head
                       { data = data
                       , sharedData = globalData
                       , routeParams = ${emptyRouteParams(name) ? "{}" : "s"}
                       , path = page.path
                       }
+                      `
+                  }
                   }
 `
           )
@@ -415,8 +420,12 @@ main =
         { init = init Nothing
         , urlToRoute = Route.urlToRoute
         , routeToPath = \\route -> route |> Maybe.map Route.routeToPath |> Maybe.withDefault []
-        , site = Site.config
-        , getStaticRoutes = getStaticRoutes |> DataSource.map (List.map Just)
+        , site = ${phase === "browser" ? `Nothing` : `Just Site.config`}
+        , getStaticRoutes = ${
+          phase === "browser"
+            ? `DataSource.succeed []`
+            : `getStaticRoutes |> DataSource.map (List.map Just)`
+        }
         , handleRoute = handleRoute
         , view = view
         , update = update
@@ -431,7 +440,11 @@ main =
         , fromJsPort = fromJsPort identity
         , data = dataForRoute
         , sharedData = Shared.template.data
-        , apiRoutes = \\htmlToString -> pathsToGenerateHandler :: routePatterns :: manifestHandler :: Api.routes getStaticRoutes htmlToString
+        , apiRoutes = ${
+          phase === "browser"
+            ? `\\_ -> []`
+            : `\\htmlToString -> pathsToGenerateHandler :: routePatterns :: manifestHandler :: Api.routes getStaticRoutes htmlToString`
+        }
         , pathPatterns = routePatterns3
         , basePath = [ ${basePath
           .split("/")

package/generator/src/init.js

@@ -19,6 +19,10 @@ async function run(name) {
         path.resolve(appRoot, "gitignore"),
         path.resolve(appRoot, ".gitignore")
       );
+      /* Since .elm-pages is in source-directories, make sure we create it before running any elm-pages commands
+       in case we run any install commands first.  See: https://github.com/dillonkearns/elm-pages/issues/205
+       */
+      fs.mkdirSync(path.join(appRoot, ".elm-pages"), { recursive: true });
     } catch (err) {
       console.log(err);
       process.exit(1);

package/generator/src/pre-render-html.js

@@ -1,7 +1,7 @@
 const cliVersion = require("../../package.json").version;
 const seo = require("./seo-renderer.js");
 const elmPagesJsMinified = require("./elm-pages-js-minified.js");
-const path = require("path");
+const path = require("path").posix;
 const jsesc = require("jsesc");
 
 /** @typedef { { head: any[]; errors: any[]; contentJson: any[]; html: string; route: string; title: string; } } Arg */
@@ -29,9 +29,9 @@ module.exports =
     <link rel="modulepreload" href="${path.join(basePath, "index.js")}">
     ${devServerOnly(
       /* html */ `<script defer="defer" src="${path.join(
-        basePath,
-        "hmr.js"
-      )}" type="text/javascript"></script>`
+      basePath,
+      "hmr.js"
+    )}" type="text/javascript"></script>`
     )}
     <script defer="defer" src="${path.join(
       basePath,
@@ -45,7 +45,7 @@ ${elmPagesJsMinified}
     </script>
     <title>${fromElm.title}</title>
     <meta name="generator" content="elm-pages v${cliVersion}">
-    <link rel="manifest" href="/manifest.json">
+    <link rel="manifest" href="${path.join(basePath, "manifest.json")}">
     <meta name="mobile-web-app-capable" content="yes">
     <meta name="theme-color" content="#ffffff">
     <meta name="apple-mobile-web-app-capable" content="yes">
@@ -81,10 +81,10 @@ function pathToRoot(cleanedRoute) {
   return cleanedRoute === ""
     ? cleanedRoute
     : cleanedRoute
-        .split("/")
-        .map((_) => "..")
-        .join("/")
-        .replace(/\.$/, "./");
+      .split("/")
+      .map((_) => "..")
+      .join("/")
+      .replace(/\.$/, "./");
 }
 
 function devServerStyleTag() {

package/generator/src/seo-renderer.js

@@ -60,7 +60,7 @@ function toString(/** @type { SeoTag[] }  */ tags) {
 /** @typedef {{ name: string; attributes: string[][]; type: 'head' }} HeadTag */
 function appendTag(/** @type {HeadTag} */ tagDetails) {
   const tagsString = tagDetails.attributes.map(([name, value]) => {
-    return `${name}="${value}"`;
+    return pairToAttribute([name, value]);
   });
   return `    <${tagDetails.name} ${tagsString.join(" ")} />`;
 }
@@ -77,5 +77,24 @@ ${JSON.stringify(tagDetails.contents)}
  * @returns string
  */
 function pairToAttribute([name, value]) {
-  return `${name}="${value}"`;
+  return `${name}="${quoteattr(value)}"`;
+}
+
+function quoteattr(s, preserveCR) {
+  preserveCR = preserveCR ? "&#13;" : "\n";
+  return (
+    ("" + s) /* Forces the conversion to string. */
+      .replace(/&/g, "&amp;") /* This MUST be the 1st replacement. */
+      .replace(/'/g, "&apos;") /* The 4 other predefined entities, required. */
+      .replace(/"/g, "&quot;")
+      .replace(/</g, "&lt;")
+      .replace(/>/g, "&gt;")
+      /*
+        You may add other replacements here for HTML only 
+        (but it's not necessary).
+        Or for XML, only if the named entities are defined in its DTD.
+        */
+      .replace(/\r\n/g, preserveCR) /* Must be before the next replacement. */
+      .replace(/[\r\n]/g, preserveCR)
+  );
 }

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "elm-pages",
-  "version": "2.1.9",
+  "version": "2.1.10",
   "homepage": "https://elm-pages.com",
   "moduleResolution": "node",
   "description": "Type-safe static sites, written in pure elm with your own custom elm-markup syntax.",
   "main": "index.js",
   "scripts": {
     "start": "cd examples/end-to-end && npm start",
-    "test": "npx elmi-to-json --version && elm-verify-examples --run-tests && elm-test && (cd generator && mocha) && (cd examples/routing && npm i && npm run build -- --debug && elm-test)",
+    "test": "npx elmi-to-json --version && elm-verify-examples --run-tests && elm-test && (cd generator && mocha) && (cd examples/routing && npm i && npm run build -- --debug && elm-test) && npm run test:snapshot",
+    "test:snapshot": "(cd examples/escaping && npm install && npm test && cd ../..) && (cd examples/base-path && npm install && npm test && cd ../..)",
     "cypress": "npm start & cypress run --spec cypress/integration/elm-pages-dev.spec.js",
     "review": "elm-review"
   },
@@ -26,6 +27,7 @@
     "commander": "^8.1.0",
     "connect": "^3.7.0",
     "cross-spawn": "7.0.3",
+    "devcert": "^1.2.0",
     "elm-doc-preview": "^5.0.5",
     "elm-hot": "^1.1.6",
     "fs-extra": "^10.0.0",

package/src/AriaLiveAnnouncer.elm

@@ -25,8 +25,8 @@ mainView title =
         --, Attr.attribute "ref" reference
         , Attr.style "position" "absolute"
         , Attr.style "top" "0"
-        , Attr.style "width" "1"
-        , Attr.style "height" "1"
+        , Attr.style "width" "1px"
+        , Attr.style "height" "1px"
         , Attr.style "padding" "0"
         , Attr.style "overflow" "hidden"
         , Attr.style "clip" "rect(0, 0, 0, 0)"

package/src/DataSource/File.elm

@@ -155,8 +155,9 @@ just the metadata.
 
     blogPost : DataSource BlogPostMetadata
     blogPost =
-        File.onlyFrontmatter "blog/hello-world.md"
+        File.onlyFrontmatter
             blogPostDecoder
+            "blog/hello-world.md"
 
     type alias BlogPostMetadata =
         { title : String

package/src/DataSource/Glob.elm

@@ -4,7 +4,7 @@ module DataSource.Glob exposing
     , captureFilePath
     , wildcard, recursiveWildcard
     , int, digits
-    , expectUniqueMatch
+    , expectUniqueMatch, expectUniqueMatchFromList
     , literal
     , map, succeed, toDataSource
     , oneOf
@@ -195,7 +195,7 @@ That will give us
 
 ## Matching a Specific Number of Files
 
-@docs expectUniqueMatch
+@docs expectUniqueMatch, expectUniqueMatchFromList
 
 
 ## Glob Patterns
@@ -1016,8 +1016,35 @@ expectUniqueMatch glob =
                         DataSource.succeed file
 
                     [] ->
-                        DataSource.fail "No files matched."
+                        DataSource.fail <| "No files matched the pattern: " ++ toPatternString glob
 
                     _ ->
                         DataSource.fail "More than one file matched."
             )
+
+
+{-| -}
+expectUniqueMatchFromList : List (Glob a) -> DataSource a
+expectUniqueMatchFromList globs =
+    globs
+        |> List.map toDataSource
+        |> DataSource.combine
+        |> DataSource.andThen
+            (\matchingFiles ->
+                case List.concat matchingFiles of
+                    [ file ] ->
+                        DataSource.succeed file
+
+                    [] ->
+                        DataSource.fail <| "No files matched the patterns: " ++ (globs |> List.map toPatternString |> String.join ", ")
+
+                    _ ->
+                        DataSource.fail "More than one file matched."
+            )
+
+
+toPatternString : Glob a -> String
+toPatternString glob =
+    case glob of
+        Glob pattern_ _ _ ->
+            pattern_

package/src/DataSource.elm

@@ -555,20 +555,20 @@ lookupUrls requestInfo =
             []
 
 
-{-| Build off of the response from a previous `StaticHttp` request to build a follow-up request. You can use the data
+{-| Build off of the response from a previous `DataSource` request to build a follow-up request. You can use the data
 from the previous response to build up the URL, headers, etc. that you send to the subsequent request.
 
     import DataSource
     import Json.Decode as Decode exposing (Decoder)
 
-    licenseData : StaticHttp.Request String
+    licenseData : DataSource String
     licenseData =
-        StaticHttp.get
+        DataSource.Http.get
             (Secrets.succeed "https://api.github.com/repos/dillonkearns/elm-pages")
             (Decode.at [ "license", "url" ] Decode.string)
-            |> StaticHttp.andThen
+            |> DataSource.andThen
                 (\licenseUrl ->
-                    StaticHttp.get (Secrets.succeed licenseUrl) (Decode.field "description" Decode.string)
+                    DataSource.Http.get (Secrets.succeed licenseUrl) (Decode.field "description" Decode.string)
                 )
 
 -}

package/src/Head.elm

@@ -1,5 +1,5 @@
 module Head exposing
-    ( Tag, metaName, metaProperty
+    ( Tag, metaName, metaProperty, metaRedirect
     , rssLink, sitemapLink, rootLanguage
     , structuredData
     , AttributeValue
@@ -17,7 +17,7 @@ so you can use the `Tag` type in your type annotations.
 But this module might be useful if you have a special use case, or if you are
 writing a plugin package to extend `elm-pages`.
 
-@docs Tag, metaName, metaProperty
+@docs Tag, metaName, metaProperty, metaRedirect
 @docs rssLink, sitemapLink, rootLanguage
 
 
@@ -383,6 +383,21 @@ metaName name content =
         ]
 
 
+{-| Example:
+
+    metaRedirect (Raw "0; url=https://google.com")
+
+Results in `<meta http-equiv="refresh" content="0; url=https://google.com" />`
+
+-}
+metaRedirect : AttributeValue -> Tag
+metaRedirect content =
+    node "meta"
+        [ ( "http-equiv", Raw "refresh" )
+        , ( "content", content )
+        ]
+
+
 {-| Low-level function for creating a tag for the HTML document's `<head>`.
 -}
 node : String -> List ( String, AttributeValue ) -> Tag

package/src/HtmlPrinter.elm

@@ -1,17 +1,18 @@
 module HtmlPrinter exposing (htmlToString)
 
-import ElmHtml.InternalTypes exposing (decodeElmHtml)
-import ElmHtml.ToString exposing (defaultFormatOptions, nodeToStringWithOptions)
 import Html exposing (Html)
 import Json.Decode as Decode
 import Json.Encode
+import Test.Html.Internal.ElmHtml.InternalTypes exposing (decodeElmHtml)
+import Test.Html.Internal.ElmHtml.ToString exposing (defaultFormatOptions, nodeToStringWithOptions)
+import VirtualDom
 
 
 htmlToString : Html msg -> String
 htmlToString viewHtml =
     case
         Decode.decodeValue
-            (decodeElmHtml (\_ _ -> Decode.succeed ()))
+            (decodeElmHtml (\_ _ -> VirtualDom.Normal (Decode.succeed ())))
             (asJsonView viewHtml)
     of
         Ok str ->