Detect IE browser compatibility mode on with ELM

Question

I have an application running in Elm. I need to show some alert msg to users before app loads in "IE compatible" mode as intend not to support, specific to IE Compatibility mode only.

with JavaScript I can do

navigator.userAgent.indexOf('compatible') > -1 ? true : false

But Is there a way to do that in ELm it self, like first thing in Main.init ?

I have tried using Elm port but application itself fails before reaching to port that's why it essential to check browser compatibility even before any Elm code runs.

Thanks

Answer 1

One way could be to use flags. Flags are values that can be passed into Elm when you first initialize the app from JavaScript:

  var app = Elm.Main.init({
    node: document.getElementById('myapp'),
    flags: {
      compatibilityMode: navigator.userAgent.indexOf('compatible') > -1
    }
  });

and on the Elm side is passed to the init function:

type alias Model = { compatibilityMode : Bool, ... }

type alias Flags = { compatibilityMode : Bool }

init : Flags -> ( Model, Cmd Msg )
init flags =
  ( { compatibilityMode = flags.compatibilityMode, ... }
  , Cmd.none
  )

...

main : Program Int Model Msg
main =
  Browser.element
    { init = init
    , view = view
    , update = update
    , subscriptions = subscriptions
    }