app.js

window.photoFieldOnChange = function(id, fileList, incomingPort) {
  if (!app.ports[incomingPort])
    return console.error(`Unknown incoming port: ${incomingPort}`);

  if (fileList.length !== 1)
    return console.error(`Illegal fileList length ${fileList.length}`);

  const file = fileList[0];
  const objectURL = window.URL.createObjectURL(file);

  app.ports[incomingPort].send([ id, objectURL ]);
};

PhotoField.elm

view : { id : String, incomingPort : String } -> Signal.Address Action -> Model -> Html
view context address model =
  input
    [ type' "file"
    , title " "
    , accept "image/*"
    , attribute "capture" "true"
    , attribute "onchange" ("window.photoFieldOnChange(\"" ++ context.id ++ "\", this.files, \"" ++ context.incomingPort ++ "\")")
    ] []