Fork me on GitHub
#re-frame
<
2018-05-30
>
mikethompson00:05:44

@alex-dixon Sorry, that's not a problem (infinite loop) we've seen reported previously. So no good suggestion. @danielcompton any ideas?

👍 4
mikethompson00:05:59

@colindresj nothing available for clearing a cached sub. :-)

danielcompton00:05:34

@colindresj why do you want to clear a single cached sub? I can't think of any use cases for that that fit within the re-frame 'canon'

colindresj00:05:53

It might not fit within re-frame’s canon 😄

alex-dixon00:05:12

I reverted reagent to 0.7.0 but kept 10x at latest and I’m still seeing the first warning posted above only when in popped out mode

colindresj00:05:09

Although not official and probably discouraged, wouldn’t calling dispose! on a sub and swapping it out of re-frame.subs/query->reaction effectively bust a single sub @mikethompson @danielcompton?

danielcompton00:05:24

@alex-dixon can you post a small reproducible project with an issue? The only time I saw infinite loops was early on in 10x development when we used the same reagent as the host app, can't think what would be causing it now.

danielcompton00:05:14

Also this is intended behaviour: > Also when I refresh the page when it’s popped out it seems to disconnect….shows “Host window has closed. Reopen external window to continue tracing. cause the JS vm has closed. It is meant to reconnect when the page loads again, so you should only see it briefly when reloading. It sounds like this wasn't happening for you?

alex-dixon00:05:22

Unfortunately no. Also “rendered by another copy of React” is the warning I was still getting with 0.3.1 after downgrading reagent from 0.8.1 to 0.7.0.

danielcompton00:05:27

Yeah that would probably happen if you don't have the matching version of React/Reagent

danielcompton00:05:48

It's a little bit messy because of the Reagent 0.7 -> 0.8/React 15->16 transition

danielcompton00:05:12

We would have liked to only support React 16/Reagent 0.8, but it was in beta for quite a while so we have dual release branches for both

danielcompton00:05:39

We'll probably drop support for 0.7 when we next do significant work on 10x, it's caused no end of confusion for people

alex-dixon02:05:56

It seemed mranderson depended on a 0.8.0 prerelease. Didn’t investigate if that included React 16 by default. I know 0.8.1 does

alex-dixon02:05:55

Think I saw it using 0.3.1-react16

raymcdermott07:05:41

I’m using the re-com/modal-panel … and I want to add a scroller to the contents but wrapping the :child in a scroller ain’t working. Anybody done this before and know the magic or do I have to resort to lower level code?

Bravi12:05:40

is it possible to mock re-frame/dispatch somehow in my tests?

mikethompson12:05:38

Other than it being a test?

Bravi12:05:50

just for testing, nothing else

mikethompson12:05:58

Is the dispatch happening via :dispatch ?

mikethompson12:05:08

Ie. an effect?

Bravi12:05:30

no, just simply

:on-click #(rf/dispatch [:blabla])

mikethompson12:05:49

So, you are doing integration tests?

Bravi12:05:59

so what I’m trying to test is whether that dispatch is being called with the correct params

Bravi12:05:33

well.. I thought I was doing a unit test on a component 😄

mikethompson12:05:41

Hmm. You can easily enough stub out the event handler

mikethompson12:05:54

and check the contents of the event in there

Bravi12:05:58

a simple example

(defn some-component
  []
  [:a {:on-click #(rf/dispatch [:some-event "hello"])} "Hey"])

;; and then 

(deftest a-component
  (testing "So I'm trying to test that on-click here somehow"
    (with-redefs [rf/subscribe (fn [action] (println action "here")
                                 action)]
      (let [fn (-> (some-component) second :on-click)]
        (is (= (fn) "hello"))))))

Bravi12:05:15

*rf/dispatch

mikethompson12:05:05

yep, with-redefs was going to be my next suggestion

Bravi12:05:59

oh wait.. my mistake.

Bravi12:05:22

I guess I have to require re-frame in my test as well

Bravi12:05:46

coz I was getting something like cannot resolve rf/dispatch in this context

mikethompson12:05:07

(deftest my-test 
  (rf-test/run-test-sync

      ;; stub out the event handler 
      (rf/reg-event-db   
            :my-event   
             (fn [db v]  .... check v in here)

      Now test 

Bravi12:05:28

oh I didn’t know that one

Bravi12:05:35

thank you

gregg13:05:26

@raymcdermott, it shouldn't require low level code, assuming you just want to do the basics and scroll the modal contents (rather than the entire modal panel).

gregg13:05:39

The modal-panel is designed to shrink and grow horizontally and vertically based on the size of its content, so you can add 10 pages of text and it will just end up disappearing off the bottom of the page.

gregg13:05:49

I'm assuming you want a vertical scrollbar here. To get that you have to limit the height of your content.

gregg13:05:20

If you were to wrap the child so it looked like this:

[modal-panel
 :backdrop-color   "grey"
 :backdrop-opacity 0.4
 :style            {:font-family "Consolas"}
 :child [scroller
         :height "200px"
         :child [dialog-markup
                 form-data
                 process-ok
                 process-cancel]]]

gregg13:05:31

your content will scroll.

raymcdermott13:05:55

nice - yes @gregg…. that’s exactly it - thanks!

gregg13:05:57

You're welcome

gregg13:05:07

It's probably worth going one step further as well

gregg13:05:56

You might tell me, "but I don't want it to be a specific height, I want it to kind of be based on the height of the browser window"

gregg13:05:05

CSS has some special sizing units, called "vh" (as opposed to "px")

gregg13:05:08

These will size according to the browser height, so you can set :max-height "85vh" and it will keep the height of the modal panel no higher than 85% of the height of the browser window

😱 4
party-corgi 4
gregg13:05:17

Give it a go, you might like that better

gregg13:05:17

These units are pretty widely available: https://caniuse.com/#feat=viewport-units

raymcdermott14:05:33

can I use the NNvh measure all over the re-com components?

gregg15:05:09

Sure, wherever you can use px, you can use these

😍 4