Fork me on GitHub
#cljsjs
<
2016-09-07
>
hlolli11:09:39

Theres' a bug in react-datepicker externs. Where excludeDates is said to be a function but is in reality array(excludeDates: _react2.default.PropTypes.array,). Before discovering the bug I tried to just update the react-datepicker. But Im struggling, like so often with generating externs. So for this file https://www.refheap.com/122782/raw via http://michaelmclellan.me/javascript-externs-generator/ what name should I extern?

martinklepsch13:09:38

@hlolli can't open your paste

martinklepsch14:09:48

also looking in the console and just typing Date might yield other options

hlolli14:09:20

yes but not Date.

hlolli14:09:38

Date works, and returns only extern for the function Date. The last person to create externs for react-datepicker used DatePicker according to react-datepicker.ext.js So I must be doing something wrong.

martinklepsch14:09:08

@hlolli what's the URL you're putting into the generator?

hlolli14:09:37

that raw pastebin I posted above. It's the generated js file from the jsx, but when I think about it, its the generated .js from the last cljsjs/react-datepicker. Maybe I run the project with node.js and get the newest .js file.

martinklepsch15:09:18

You will need something that serves the file with a text/javascript content type otherwise it won't be loaded as JS

hlolli15:09:35

tried but the same. If it can extern the function Date, it must be able to read it correctly?

martinklepsch15:09:06

Date is a JS constructor, are you sure it's coming from that file?

martinklepsch15:09:29

open the console on the externs generator as well so you see if any issues occur

hlolli15:09:31

Tried the node.js app for extern-generator, worked last time for me. I include all dependancies, index is react-onclickoutside. And still wont work.

generate-extern -f react.js, react-dom.js, index.js, moment.js, react-datepicker.inc.js -n DatePicker -o datep.ext.js

/usr/lib/node_modules/externs-generator/bin/extern:261
ma(sd,"exit").call(null,1));null==c&&(console.error("Please specify namespace to extern (e.g. -n jQuery)"),ma(sd,"exit").call(null,1));null==a&&(console.error("Please specify an output file for the extern (e.g. -o jquery-extern.js)"),ma(sd,"exit").call(null,1));for(var b=K(b),e=null,g=0,h=0;;)if(h<g){var k=e.W(null,h);Mf(d,k);h+=1}else if(b=K(b))e=b,Cc(e)?(b=tb(e),h=ub(e),e=b,g=S(b),b=h):(b=M(e),Mf(d,b),b=O(e),e=null,g=0),h=0;else break;d=ma(d,c);if(null==d)throw[B("Namespace '"),B(c),B("' was not found. Make sure the library is loaded and the name is spelled correctly.")].join("");
                                                                                                                                                                                                                                                                                                                     
Namespace 'DatePicker' was not found. Make sure the library is loaded and the name is spelled correctly.

martinklepsch15:09:11

@hlolli maybe open an issue and ping the people that previously created/updated the package

hlolli15:09:56

@therabidbanana (if its not inapproproate to ping you here), maybe you can look at the extern to react-datepicker you generated?

therabidbanana16:09:36

@hlolli : looking at the thread now

therabidbanana16:09:53

So are you just trying to update externs for current version?

hlolli16:09:41

I was trying that, to see if it solved the extern issue, that the externt wont say that excludeDates is a function, but an array. When using excludeDates on my datepicker component I encounter that error, telling me its not a function.

hlolli16:09:24

But I also have another bug unrelated to externs, hoping to see the library developers had fixed it (which is that the calander will disappear without giving onBlur or onFocus function call, but thats unrelated). (thats why Im curious to update react-datepicker to 0.29.0)

therabidbanana16:09:25

Not sure about the node externs-generator, haven't used that - it might not like the funky webpack wrappings from the react-datepicker build. It's entirely possible I missed a step with my notes - I had to try a few times to get the externs generator online to work

hlolli16:09:22

Yes I thought so too, that these webpack wrappings are causing the generator not finding the namespace functions. We could write this by hand, not that I know how to do that, but I would love to know how.

hlolli16:09:23

The full list of props for the datepicker is only ~25 functions/bools/arrays.

therabidbanana16:09:45

What errors are you seeing with the current externs?

hlolli16:09:01

react-datepicker.inc.js:454 Uncaught TypeError: excludeDates.some is not a function

therabidbanana16:09:07

What's the calling code look like that generates that?

hlolli16:09:46

Now like this, but its the same with js-obj and/or js-global-array :excludeDates [(js/moment)]

hlolli16:09:00

full code call tough

(js/React.createElement
                            js/DatePicker
                            #js {:showYearDropdown true
                                 :dateFormat "YYYY-MM-DD"
                                 :key "service-left"
                                 :id "service-from"
                                 :excludeDates [(js/moment)]
                                 :maxDate (js/moment)
                                 :placeholderText "Date from"
                                 :onChange (fn [t]
                                             (om/update-state! this assoc :service-from t)
                                             (om/update-state! this assoc :service-from-focus? false)
                                             (when (js/moment.isMoment (:service-to (om/get-state this)))
                                               (when (.isAfter t (:service-to (om/get-state this)))
                                                 (om/update-state! this assoc :service-to nil))))
                                 :onBlur #(om/update-state! this assoc :service-from-focus? false)
                                 :onFocus #(om/update-state! this assoc :service-from-focus? true)
                                 :selected (:service-from (om/get-state this))
                                 :title "Service date from"
                                 :fixedHeight true
                                 :isClearable true
                                 :popoverTargetOffset "18px 0"})

therabidbanana16:09:25

Seems like #js isn't working like you expect it to and downgrading the CLJS vector to a real JS array

therabidbanana16:09:18

I'd guess the bug isn't in the externs there

therabidbanana16:09:57

You need to put #js in front of nested objects

therabidbanana16:09:03

(or in your case, arrays)

therabidbanana16:09:11

excludeDates: #js [(js/moment)]

hlolli16:09:49

yes, ahhhh, I should have known that.

hlolli16:09:39

it works now 😄 so I leave the package update to someone else. Thanks for looking into this!

therabidbanana16:09:00

I think clj->js handles arbitrary nesting, you could try wrapping all your options in that as well.

hlolli16:09:57

yes I do it all the time with style. But I was recently using react-material-ui, and all arrays there didnt need the #js tag. But then I remembered that I was using a wrapped lib from madvas.

therabidbanana16:09:59

(If you want to avoid forgetting another #js - it's easy to do, I think I've had the issue a few times)

hlolli16:09:21

ok, wow, I thought clj->js was just the exact same of #js, glad to learn that my millions of nested #js tags can be removed. I type #js too often hehe.

therabidbanana16:09:08

I think technically they compile differently (and theoretically #js is more efficient in that case - because it's a macro instead of a function call?), but I haven't looked into the details

hlolli16:09:19

ok ok. Well, its enough work today. Now I go home and... yes, do more clojure 😄 so see you around

mikebelanger19:09:53

Hi guys I’m having a hard time making an externs package, I’m using this tool : http://michaelmclellan.me/javascript-externs-generator/ and I’m trying to get an empty object, ( _module ) and it says it can’t find it. The js file is here : https://github.com/TriumphLLC/Blend4Web/blob/master/src/b4w.js I’m not sure I understand how to use this tool.

juhoteperi19:09:17

@mikebelanger what is an empty object?

mikebelanger19:09:50

@juhoteperi ie var _module = {};

juhoteperi20:09:01

But that is inside a closure: var b4w = ((typeof b4w === "object") ? b4w : (function(exports) {

mikebelanger20:09:59

@juhoteperi oh so I should try and grab the b4w object instead?

mikebelanger20:09:22

@juhoteperi ok it’s saying it can’t find the b4w. All I entered is ‘b4w’, do I have to enter one of the object’s values?

juhoteperi20:09:05

hmh, should work

mikebelanger20:09:58

It looks the b4w.js file has some namespace declarations above that, would that interfere with it?

juhoteperi20:09:19

I don't think it should be reading those JSDocs

juhoteperi20:09:29

what url are you using for the generator?

juhoteperi20:09:17

for the JS file

mikebelanger20:09:58

https://github.com/TriumphLLC/Blend4Web/blob/master/src/b4w.js ..mind you this is under the git blob, maybe that’s the problem

juhoteperi20:09:14

yes, it can load a html file

juhoteperi20:09:20

check browser console for errors

juhoteperi20:09:16

If it is hard to find proper copy available at http server, you can download the file to local disk and use this npm tool: https://github.com/jmmk/javascript-externs-generator (npm install -g externs-generator)

juhoteperi20:09:39

(In fact that is the same generator but as a npm package)

mikebelanger20:09:11

Are you sure it can handle html? The console is complaining about the ‘<!DOCTYPE html>’ right at the beginning

juhoteperi20:09:26

ah sorry, typo 😄

juhoteperi20:09:36

I meant to say, it can't load a html file

mikebelanger20:09:52

@juhoteperi it’s saying "SyntaxError: expected expression, got ‘<'"

mikebelanger20:09:08

Oh, sorry just read your last message 😛

mikebelanger20:09:19

@juhoteperi cool it works when I goto original git path, thanks!