Fork me on GitHub
Slack Archive

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

2021-03-23

Channels

#reagent
<
2021-03-23
>
underplank22:03:01

Hi all. Im using a re-com input-text area to do the text area in this -> https://text-to-wardley.vercel.app/

underplank22:03:12

On my local before I release the text area is nicely sized to take up the left 30% of the page. Once I release it it just doesnt respect the width property and remains narrow, and certainly doesnt resize. any pointers?

p-himik22:03:22

Is there any code that we could look at?

underplank22:03:34

Im wondering if for some reason its not re-rendering, so i've added a sub for the window width / height

underplank22:03:23

^^ that didnt work

p-himik22:03:27

The container that has the real textarea seems to have the right width. Check the div with class rc-input-text.

p-himik22:03:04

Seems like it's just the textarea itself that doesn't fill its parent width-wise for some reason. Maybe there's some issue in CSS? Something being used in dev but not making it to the prod?

underplank22:03:31

hmm. yeah css might be it. I diffed the html and it was the same...

p-himik22:03:55

Check out Bootstrap CSS. Re-com requires it.

p-himik22:03:26

On the re-com demo web page you can see that the text area input has additional styles applied to it that all come from Boostrap.

underplank22:03:00

hmm.. I do have bootstrap pulled in.

underplank22:03:20

but thats a good guess.

p-himik22:03:37

You mean this Bootstrap? :)

p-himik22:03:56

There are also two fonts that aren't loaded, at least on my end.

underplank22:03:25

oh good pickup.

p-himik22:03:28

Never use http:// to include resources in your HTML, always use //. It will use the same protocol your page was loaded with.

underplank22:03:50

BINGO! thanks! looks like its working now

👍 3
gadfly36122:03:44

Hi all, I haven't worked with reagent in quite some time. I was wondering if anyone could help out with the following issue on the reagent cookbook. https://github.com/reagent-project/reagent-cookbook/issues/62 For context, we recently bumped the reagent version in all recipes, but that broke this recipe (and possibly others). Also, I am unsure what is considered best testing practices these days. So I was hoping to receive help updating this recipe or replacing it altogether. PRs welcomed 🤞

lilactown01:03:30

do you have React installed? older versions of reagent depended on react-cljsjs; new versions expect you to install React yourself, either by depending on react cljsjs in your app or via npm depending on your project setup

👍 3
Brice Ruth03:03:40

hiya - I created that issue, so ... I may be able to answer - I don't see an explicit react dependency

Brice Ruth03:03:01

specifically, it has an :exclusions for cljsjs/react

lilactown03:03:39

in your app?

Brice Ruth04:03:12

I got something that at least got through to compiling the JS ... 

:dependencies [[org.clojure/clojure "1.10.1"]
                 [org.clojure/clojurescript "1.10.773"]
                 [reagent "1.0.0"]
                 [cljsjs/react "15.6.1-1"]
                 ;; [cljsjs/react-with-addons "15.6.1-0"]
                 [cljs-react-test "0.1.4-SNAPSHOT" :exclusions [cljsjs/react-with-addons]]
                 [prismatic/dommy "1.1.0"]]

Brice Ruth04:03:49

but, it fails then ... 

Error while loading file: "resources/public/js/compiled/test.js"
SyntaxError: resources/public/js/compiled/test.js:285:503 Expected an operand but found const

Brice Ruth04:03:30

might be because I'm trying with nashorn since I haven't taken the time to setup karma/chrome-headless/etc.

Brice Ruth04:03:04

setting that up right now to check ... be just a minute

gadfly36104:03:22

In addition, I think cljs-react-test won't work with new versions of react / is no longer maintained. I am curious what is currently used by the community as a replacement.

Brice Ruth04:03:30

was running in a Docker container, but setting all that up in there is a PITA ...

Brice Ruth04:03:53

yeah - ultimately, I'm not trying to get something SPECIFIC to work ... I'm trying to write tests with reagent ... that's all - what's being used?

Brice Ruth04:03:01

nobody testing?

gadfly36104:03:47

@U01SEDZ83N0 yeah, for sure, i am also interested in whatever the current testing practices are and would prefer replacing that recipe all together (since it is stale and now broken after the blind version updates to all the recipes)

Brice Ruth04:03:49

23 03 2021 23:17:21.242:WARN [web-server]: 404: /out/goog/deps.js
23 03 2021 23:17:21.268:WARN [web-server]: 404: /out/cljs_deps.js
Chrome Headless 89.0.4389.90 (Mac OS 11.2.2) ERROR
  Uncaught TypeError: Cannot read property 'TestUtils' of undefined
  at out/cljs_react_test/utils.js:79:48

  TypeError: Cannot read property 'TestUtils' of undefined
      at out/cljs_react_test/utils.js:79:48


Subprocess failed (exit code: 1)

lilactown04:03:27

we use react-testing-library at work

lilactown04:03:25

but honestly I think a lot of teams eschew testing their front end outside of manual testing or browser automation

Brice Ruth04:03:08

will take a deeper look tomorrow!

Brice Ruth04:03:11

thx all 🙂

lilactown04:03:14

👍:skin-tone-2:

gadfly36104:03:54

@U01SEDZ83N0 @U4YGF4NGM thanks! Regarding the recipe in question, I think for now I'll revert the version of reagent back and move it to the 'old recipes' section. I'll also add a note in the readme that new testing recipes are welcomed.

seancorfield23:03:34

@ps Will you please stop cross-posting questions unless someone specifically tells you you’re posting in the wrong channel and should post a question elsewhere.

zendevil.eth23:03:14

@U04V70XH6 what if the post pertains to two topics?

seancorfield23:03:11

Post it in the single channel you think is most appropriate. If someone tells you it belongs in another channel only then post it elsewhere (and remove it from the original channel).

seancorfield23:03:35

That way folks won’t waste time dealing with a question in a channel when it is being dealt with in another channel.