Use Payload with EventSource

This removes manual handling of `JSVal` when working with
`EventSource` (Server-sent events).

Note, Payload is reused from `WebSocket`, but only the `TEXT` / `JSON`
cases are valid.

- [x] Add callbacks to `eventSourceConnect` to handle `Payload`
- [x] Error handling now operates on `MisoString`

Author: dmjio

js/miso.js

@@ -101,18 +101,27 @@ function websocketSend(socket, message) {
     socket.send(message);
   }
 }
-function eventSourceConnect(url, onOpen, onMessage, onError) {
-  let eventSource = new EventSource(url);
-  eventSource.onopen = function() {
-    onOpen();
-  };
-  eventSource.onerror = function(error) {
-    onError(error);
-  };
-  eventSource.onmessage = function(msg) {
-    onMessage(msg.data);
-  };
-  return eventSource;
+function eventSourceConnect(url, onOpen, onMessageText, onMessageJSON, onError) {
+  try {
+    let eventSource = new EventSource(url);
+    eventSource.onopen = function() {
+      onOpen();
+    };
+    eventSource.onerror = function() {
+      onError("EventSource error received");
+    };
+    eventSource.onmessage = function(msg) {
+      try {
+        const json = JSON.parse(msg.data);
+        onMessageJSON(json);
+      } catch (err) {
+        onMessageText(msg.data);
+      }
+    };
+    return eventSource;
+  } catch (err) {
+    onError(err.message);
+  }
 }
 function eventSourceClose(eventSource) {
   if (eventSource) {

js/miso.prod.js

@@ -22,21 +22,25 @@ module Miso.EventSource
   -- *** Types
   , EventSource (..)
   , URL
+  -- *** Re-exports
+  , Payload (..)
   ) where
 -----------------------------------------------------------------------------
+import           Data.Aeson
+-----------------------------------------------------------------------------
 import           Miso.Effect
 import           Miso.Runtime
------------------------------------------------------------------------------
-import           Language.Javascript.JSaddle
+import           Miso.String
 -----------------------------------------------------------------------------
 -- | <https://developer.mozilla.org/en-US/docs/Web/API/EventSource>
 connect
-  :: URL
+  :: FromJSON value
+  => URL
   -> (EventSource -> action)
   -- ^ onOpen
-  -> (JSVal -> action)
+  -> (Payload value -> action)
   -- ^ onMessage
-  -> (JSVal -> action)
+  -> (MisoString -> action)
   -- ^ onError
   -> Effect parent model action
 connect = eventSourceConnect

src/Miso/EventSource.hs

@@ -795,13 +795,15 @@ eventSourceConnect
   -> JSM ()
   -> (JSVal -> JSM ())
   -> (JSVal -> JSM ())
+  -> (JSVal -> JSM ())
   -> JSM JSVal
-eventSourceConnect url onOpen onMessage onError = do
+eventSourceConnect url onOpen onMessageText onMessageJSON onError = do
   onOpen_ <- asyncCallback onOpen
-  onMessage_ <- asyncCallback1 onMessage
+  onMessageText_ <- asyncCallback1 onMessageText
+  onMessageJSON_ <- asyncCallback1 onMessageJSON
   onError_ <- asyncCallback1 onError
   jsg "miso" # "eventSourceConnect" $
-    (url, onOpen_, onMessage_, onError_)
+    (url, onOpen_, onMessageText_, onMessageJSON_, onError_)
 -----------------------------------------------------------------------------
 eventSourceClose :: JSVal -> JSM ()
 eventSourceClose eventSource = void $ do

src/Miso/FFI/Internal.hs

@@ -1292,13 +1292,14 @@ eventSourceConnectionIds = unsafePerformIO (newIORef (0 :: Int))
 -----------------------------------------------------------------------------
 -- | <https://developer.mozilla.org/en-US/docs/Web/API/EventSource/EventSource>
 eventSourceConnect
-  :: URL
+  :: FromJSON value
+  => URL
   -- ^ EventSource URL
   -> (EventSource -> action)
   -- ^ onOpen
-  -> (JSVal -> action)
+  -> (Payload value -> action)
   -- ^ onMessage
-  -> (JSVal -> action)
+  -> (MisoString -> action)
   -- ^ onError
   -> Effect parent model action
 eventSourceConnect url onOpen onMessage onError = do
@@ -1307,8 +1308,13 @@ eventSourceConnect url onOpen onMessage onError = do
     eventSourceId <- freshEventSource
     socket <- FFI.eventSourceConnect url
       (sink $ onOpen eventSourceId)
-      (sink . onMessage)
-      (sink . onError)
+      (\e -> do string <- fromJSValUnchecked e
+                sink (onMessage (TEXT string)))
+      (\e -> do value <- fromJSValUnchecked e
+                case fromJSON value of
+                  Error errMsg -> sink (onError (ms errMsg))
+                  Success json_ -> sink $ onMessage (JSON json_))
+      (sink . onError <=< fromJSValUnchecked)
     insertEventSource _componentId eventSourceId socket
   where
     insertEventSource :: ComponentId -> EventSource -> Socket -> JSM ()

src/Miso/Runtime.hs

@@ -157,20 +157,30 @@ export function websocketSend (
 export function eventSourceConnect (
     url: string,
     onOpen,
-    onMessage,
+    onMessageText,
+    onMessageJSON,
     onError,
 ): EventSource {
-  let eventSource = new EventSource(url);
-  eventSource.onopen = function () {
-    onOpen();
-  };
-  eventSource.onerror = function (error) {
-    onError(error);
-  };
-  eventSource.onmessage = function (msg) {
-    onMessage(msg.data);
-  };
-  return eventSource;
+  try {
+    let eventSource = new EventSource(url);
+    eventSource.onopen = function () {
+        onOpen();
+    };
+    eventSource.onerror = function () {
+        onError('EventSource error received');
+    };
+    eventSource.onmessage = function (msg) {
+        try {
+            const json = JSON.parse (msg.data);
+            onMessageJSON(json);
+        } catch (err) {
+            onMessageText(msg.data)
+        }
+    };
+    return eventSource;
+  } catch (err) {
+      onError (err.message);
+  }
 }
 
 export function eventSourceClose (