Elm: switching from Browser.element to Browser.application - what are the required changes on JS side?

Viewed 127

The need to manipulate URLs recently arose in my Elm app, so according to the docs I had to change from a Browser.element-based approach to Browser.application. This required a few changes including my view function which had to be changed to return a record with a title and a body field.

There is no mention in the guide about updating the initializer JS code and I expected this will break my app because it is still initialized like so:

var app = Elm.Main.init({
  node: document.getElementById('elm')
});

The app kept working, it didn't brake it! Dumbfounded, I went googling and found this article that says "... [other elements in body] just have to appear after the script with Elm.Main.init". I do have some bootstrap-datepicker js lib referenced in a <script> tag before the elm initialization code!

What's the deal here? I fear I just happen to be lucky with some default behavior. How does Browser.application take over the body tag? What is the correct way to initialize a Browser.application-based Elm app that also has to include custom javascript in the html body? Maybe the elm guide should be updated to include such info as well.

1 Answers

The reason this works is because the Elm initialiser checks for the records it needs and ignores any others. It's the same as if you passed in:

var app = Elm.Main.init({
  foobar: null
});

(This is because JS is not type-checked like Elm, so objects can have fairly arbitrary shapes)

AFAIK you might need the flags key.

Related