Gotchas when working with promises, core.async, browser state?

I’m wondering what are the typical pitfalls when developing cljs projects and using core.async and promises; I just spent a few hours trying to figure out why my project (which worked before) was suddenly returning errors from a core.async go block. I tried another browser and it worked, so I’m guessing it had something to do with how Firefox was caching things?

After a lot of restarts/refreshes and clearing of browser data, I managed to get it to enough of a clean slate to work again without changing any code, but without really understanding what happened. I’d appreciate any general advice on what can commonly go wrong and how to manage it in the future.

Is it possible that what experienced might be due to a browser caching issue? I’ve never experienced any cross-browser issues with core.async, but that doesn’t mean to say there aren’t any. Do you still have the code that was giving you issues?

Yep, it was this:


(ns cheshire-cat.core
  (:require [cljs.core.async :refer [<! go]]
            [cljs.core.async.interop :refer-macros [<p!]]))

(defn say-goodbye []
  (doseq [e (.querySelectorAll js/document "#cat-name, #status")]
    (.then (js/Promise.resolve (.-finished (.animate e (js-obj "opacity" 0) 1000)))
                               #(set! (.-style.opacity e) 0))))

(defn ^:export init []
  (go 
    (let [response (js->clj (<p! (.json (<p! (js/fetch "cheshire-cat"))))) 
          [cat-name status] (seq (.querySelectorAll js/document "#cat-name, #status"))]
      (set! (.-textContent cat-name) (response "cat-name"))
      (set! (.-textContent status) (response "status"))
      (set! (.-style status) "font-size:400%")
      (set! (.-onclick (.querySelector js/document "#button1")) say-goodbye))))

The cheshire-cat endpoint returns a JSON map served by Jetty, defined in the clj file


  (GET "/cheshire-cat" [] (rr/response {"cat-name" "Cheshire Cat" "status" "grinning!!"}))

The page calls init() when it loads.

It would be nice to figure out how to reproduce the issue, then maybe I could get at the cause of it.

I’ve used core.async a lot by itself in the browser, but not with promises, so sadly I can’t help you with that aspect of it. My best guess is what you yourself have surmised, that it’s a browser caching issue, with older code that was failing not being updated.