Unable to display two components in OM

Question

I am attempting to learn Om, and have come across something I don't understand. I would expect this code

(defn search-page-view [app owner]
(reify
    om/IRender
    (render [_]
      (dom/div #js {:id "search-block"}
                  "Test")
      (dom/div #js {:id "results-block"}
               "Test2"))))
(om/root
 search-page-view app-state
  {:target (. js/document (getElementById "app"))})

to result in this html:

<div id="app>
  <div id="search-block">
    Test
  </div>
  <div id="results-block">
    Test2
  </div>
</div>

However, it does not! The first div containing Test does not display. What am I misunderstanding?

Edit with the solution (pointed out by FakeRainBrigand):

Changing the code to

(defn search-page-view [app owner]
  (reify
    om/IRender
    (render [_]
      (dom/div nil
               (dom/div #js {:id "search-block"}
                    "Test")
               (dom/div #js {:id "results-block"}
                    "Test2")))))

results in the expected html.

Answer 1

As explained here and by FakeRainBrigand explained, your render function must return a single renderable.