Uncaught ReferenceError and Unexpected end of input using GraphicSVG Library

[CSchank]

Hi, we have an Elm graphics library MacCASOutreach/GraphicSVG which we are trying to use with Ellie. The library is written in pure Elm with no ports or anything like that. While the Elm compiles fine (as evidenced by the "Compile successful" text in the bottom-right of Ellie), we are receiving two runtime errors while using this library on Ellie and we're not sure how to debug them:

1. Uncaught ReferenceError: Elm is not defined
2. Uncaught SyntaxError: Unexpected end of input

The second one is particularly strange and may be the source of the first. When inspecting the error in the JavaScript console, it appears as if the generated JavaScript (workspace) simply ends on (rather abruptly!) the 11770th line:

var MacCASOutreach$graphicsvg$GraphicSVG$Circle = function (a) {
	return {$: 'Circle', a: a};
};
var MacCASOutreach$graphicsvg$GraphicSVG$circle = function (r) {
	retu

This appears to be a server-side issue and the issue has been recreated on several browsers and machines (to name a few, Chrome 69 and Safari 12.0.1 on macOS). A minimal example of these errors is available at https://ellie-app.com/3MN8kJX3zhma1 for you to see for yourself.

Any idea how we can fix this?

Best regards,
Chris

[emmanuel]

When I run Ellie locally, I see this info message in the logs when it's failing:

---
[info] Sent 200 in 1ms
[info] elm make
exit: 1
stdout:
stderr: {"type":"error","path":"elm.json","title":"MISSING DEPENDENCIES","message":["Your elm.json is missing some \"indirect\" dependencies:\n\n    ",{"bold":false,"underline":false,"color":"yellow","string":"\"elm/http\": \"1.0.0\"\n    \"elm/json\": \"1.0.0\"\n    \"elm/svg\": \"1.0.1\"\n    \"elm/time\": \"1.0.0\"\n    \"elm/url\": \"1.0.0\"\n    \"elm/virtual-dom\": \"1.0.2\""},"\n\nThis usually means you are editing elm.json by hand. It is much more reliable to\nuse the ",{"bold":false,"underline":false,"color":"GREEN","string":"elm install"}," command instead."]}

And before that, I see this line, reflecting when I installed the graphicsvg package:

---
{packages(packages: [{name: "elm/browser", version: "1.0.1"}, {name: "elm/core", version: "1.0.0"}, {name: "elm/html", version: "1.0.0"}, {name: "MacCASOutreach/graphicsvg", version: "3.0.0"}]){name version docs{name comment unions{name comment args tags{name args}} aliases{name comment args type} values{name comment type} binops{name comment type associativity precedence}}}}

It looks like the package wasn't installed correctly, but I don't see any further leads at the moment.

[emmanuel]

After directly installing the transitive dependencies, I get a different error:

Error: Browser.application programs cannot handle URLs like this: blob:https://ellie-app.com/5c94bfdb-2bdd-4059-bc74-b0df57ae31a7 What is the root? The root of your file system? Try looking at this program with `elm reactor` or some other server.

The only thing I have found so far is elm/browser#20, which apparently originates in elm/url (elm/url#10). I'm not clear where or how the blob: url is being generated, so I'm still confused about why graphicsvg is triggering this bug (which seems to be about interactions between Ellie and elm/url from what I can see).

[emmanuel]

It appears the compilation failure was due to a bad interaction between graphicsvg and Ellie (something about that blob: URL; I don't completely understand it). I'm able to report this because @CSchank fixed here (... "worked around it" might be more accurate): MacCASOutreach/graphicsvg@b9078a1

So that's good news. However, the original issue remains: namely that the transitive dependencies of graphicsvg were not installed when the package was installed into the Ellie workspace. I assume that's the expected behavior (that assumption is based on what elm install does).

Also, the elm/time and elm/svg packages aren't searchable in the same way as other core packages (i.e., searching for time doesn't return elm/time, and the same for url/elm/url).

[CSchank]

Building on this further, we determined that it is the elm/time package causing problems. We have a few different types of apps that expose different things. The app which does not use time subscriptions for animations seems to work without issue without any finessing. The apps which map time messages into their application for purposes of animation seem to be affected. The way to fix it is to first install elm/time and then GraphicSVG, without trying to compile the code first.

If you try to compile the code before installing elm-time (i.e. after just installing GraphicSVG as would be natural for anyone trying to use that module), you will receive this set of errors (see https://ellie-app.com/49w5VdT9cfDa1):

If this happens, you need to actually do the following to make it work:

1. Uninstall GraphicSVG first
2. Install elm/time
3. Compile in order to get an error about GraphicSVG not being found (weird as it may seem, this step is needed)
4. Install GraphicSVG and compile.
   Here's a link that works by using these steps (or by avoiding running without elm/time altogether): https://ellie-app.com/49wnNnmckxPa1

Under the hood, this error seems to be a weird EOF error where the JavaScript file ends on a certain line (doesn't seem to be in the middle of a line, just all the sudden stops).

In summary, we appear to have run into and successfully unscrambled (after a bit of effort -- we naturally assumed it to be one bug at the beginning) two bugs with Ellie:

1. Incorrect handling of apps which use Browser.application and thus are looking for a type of URL that Ellie does not provide properly.
2. Incorrect handling of elm/time imports, which I am not sure, but I assume affects other modules which use elm/time under the hood.

[readevalprint]

I just hit this error it seems too, trying to use the example from the Debouncer package without modification: https://github.com/Gizra/elm-debouncer/blob/2.0.0/examples/src/Basic.elm

It would seem to use elm/time as well but the suggestion above did not have an effect.

[readevalprint]

Also Gizra/elm-debouncer works locally with elm reactor. I'm still new to elm but let me know if I can help debug further...

[CSchank]

@readevalprint Did you try adding all of that package's (other) dependencies to the dependencies in Ellie?

[readevalprint]

@CSchank The only dependency I attempted to install was Gizra/elm-debouncer and then I tried the steps above and also directly installed elm/time. But no change in error message.

[tbash]

This is due to Ellie compiling with --debug and is a known issue of the compiler in certain situations, this being one of them.

To recreate locally:
execute:

$ mkdir temp && cd temp
$ elm init
$ elm install Gizra/elm-debouncer

copy:

module Main exposing (main)

import GraphicSVG exposing (..)
import GraphicSVG.EllieApp exposing (GetKeyState, gameApp)


init =
    { time = 0 }


type Msg
    = Tick Float GetKeyState


update msg model =
    case msg of
        Tick t _ ->
            { model | time = t }


view model =
    collage 500
        500
        [ circle model.time |> filled orange ]


main =
    gameApp
        Tick
        { model = init
        , view = view
        , update = update
        , title = "Ellie Example" -- This is the title of the browser window / tab
        }

into src/Main.elm
execute:

$ elm make src/Main.elm --debug

observe:

Dependencies loaded from local cache.
Dependencies ready!
Success! Compiled 1 module.
elm: Map.!: given key is not an element in the map
CallStack (from HasCallStack):
  error, called at libraries/containers/Data/Map/Internal.hs:603:17 in containers-0.5.10.2:Data.Map.Internal 

An issue exists for the compiler here: elm/compiler#1851

A feature request for adding the --optimize option conditionally has been created here: #66. This could be extended to include other optional compiler flags such as --debug, thus allowing this to compile. For now the workaround is to install elm/time using the UI, making it a direct dependency.