How do I detect the browser from Elm?
Specifically I want to be able to tell if the web app is running on a tablet (Safari on iPad, etc.) or not.
Asked
Active
Viewed 1,032 times
2 Answers
8
You can use Html.programWithFlags to pass information from Javascript to Elm on initialization.
Assuming you can infer browser from user agent, you could do something like this:
type alias Flags =
{ userAgent : String }
Your init would look like this:
init : Flags -> ( Model, Cmd Msg )
init flags =
...
main =
programWithFlags { init = init, ... }
And from Javascript, you would pass the flags in like this:
var app = Elm.Main.fullscreen({
userAgent: navigator.userAgent
});
Side note: User agent may not be enough to fully detect browser. You can see this StackOverflow answer which provides more reliable detection. Either way, the end result is that you would send some kind of flag along to the Elm app on init.
Community
- 1
- 1
Chad Gilbert
- 36,115
- 4
- 89
- 97
-
Any way to do this from Elm reactor? – Sridhar Ratnakumar Nov 15 '16 at 18:33
-
1No - Elm Reactor doesn't allow for custom ports or flags. However, if you want a lightweight dev server for Elm, check out [elm-live](https://github.com/tomekwi/elm-live). That has the same sort of feel as elm-reactor, but allows for custom pages wrapping and importing Elm files. – Chad Gilbert Nov 15 '16 at 18:35
-
I don't think elm-live supports 0.18 yet – Chris Schreiner Nov 20 '16 at 20:22
-
Elm-live supports 0.19 for a while now – TankorSmash Jan 30 '22 at 00:38
1
You can use elm-vendor package.
http://package.elm-lang.org/packages/coreytrampe/elm-vendor/latest
pdamoc
- 2,798
- 15
- 19
-
1The undocumented Native (Kernel) code folks used for this kind of thing is no longer available as of 0.19 as it conflicts with DCE. – Mario Dec 23 '19 at 08:05