Debugging re-frame and reagent

canvas.cljs

;; versions 1 & 2 -- structure remains the same
(defn render [{:keys [data]}]
  (reagent/create-class
   {:reagent-render          (constantly [:svg.canvas])
    :component-did-mount     #(-> data clj->js do-render-graph)}))

main.cljs

;; version 1 -- canvas DOES NOT re-render
(defn render []
  [:div.main
   [search/render {:active?     @(rf/subscribe [:search/active?])
                   :coordinates @(rf/subscribe [:search/coordinates])}]
   [canvas/render {:data @(rf/subscribe [:main/payload])}]])

;; version 2 -- canvas re-renders
(defn render []
  [:div.main
   (when @(rf/subscribe [:search/active?]) 
     [search/render])
   [canvas/render {:data @(rf/subscribe [:main/payload])}]])

search.cljs

;; version 1
(defn render [{:keys [active? coordinates]}]
  (when active?
    (let [[x y] coordinates]
      [:div.search
       {:style {:position "absolute"
                :left (- x (/ vars/width 2))
                :top (-> y (- vars/height) (- vars/margin-bottom))}}
       [:input.search__input
        {:type "text"
         :on-change #(rf/dispatch [:search/value-change (-> % .-target .-value)])
         :on-key-down handle-key-down-event
         :value @(rf/subscribe [:search/value])
         :auto-focus true}]])))

;; version 2
(defn render []
  (let [[x y] @(rf/subscribe [:search/coordinates]
    [:div.search
     {:style {:position "absolute"
              :left (- x (/ vars/width 2))
              :top (-> y (- vars/height) (- vars/margin-bottom))}}
     [:input.search__input
      {:type "text"
       :on-change #(rf/dispatch [:search/value-change (-> % .-target .-value)])
       :on-key-down handle-key-down-event
       :value @(rf/subscribe [:search/value])
       :auto-focus true}]]))