Fork me on GitHub
Slack Archive

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

2019-08-26

Channels

#clojurescript
<
2019-08-26
>
Lone Ranger00:08:48

Does anybody happen to know if pre and post conditions are stripped out in advanced compilation?

andy.fingerhut02:08:43

I can dynamically require at the top level in a cljs REPL, but given that it seems to only be supported to do require at the top level in cljs, anything you can do to restrict your technique to require only at the top level is good.

Lone Ranger02:08:21

I can see it being potentially useful in a code splitting context if you were trying to keep upfront load really tiny

Lone Ranger02:08:43

Lazy loading and whatnot

andy.fingerhut03:08:35

I would be perfectly happy if ClojureScript allowed me to do non-top-level requires -- I just do not know how to do it, and it might be impossible for implementation reasons that I do not yet know.

thheller06:08:42

it isn't possible. partly due do :advanced optimizations not allowing that and partly because all IO is async in JS

hamid tsh07:08:06

hi, js/setTimeout function doesn't work for me for reloading page automatically. Is there anybody can figure out why?

Lone Ranger11:08:32

What’s the code you’re running?

abdullahibra07:08:13

Hello guys how can i set browser back button to refer to specific page ? for example if i do a payment of something and need if the payment is completed and user want to back, he don't get the previous page but to specific other page how can you guys handle this ?

Lone Ranger11:08:03

Also checkout goog.History

hamid tsh09:08:05

hi. when reagent/render method called? actually how render function realize browser page difference for refreshing?

henrik10:08:18

It’s called when mounting the app, when a change is detected in an atom that the component depends on, or when instructed to do so by a parent component (for example, a component might re-render when called from a for, and the for re-runs).

henrik10:08:55

FYI, there’s a #reagent channel for Reagent-specific questions.

restenb13:08:33

how can I access JavaScript's this inside a Reagent component?

restenb13:08:10

tried using this-as but that seems to just give the global this or nothing at all

heefoo13:08:17

use :ref prop to save the component object in an atom

heefoo13:08:42

also there is the reagent.core/current-component, that i think does exacly this

abdullahibra16:08:31

is this line right? (set! (.. js/window -onpopstate) (fn [] (.go js/history -1)))

abdullahibra16:08:55

to change event of browser back to previous page?

abdullahibra16:08:10

maybe i can change -1 to whatever value right?

dpsutton16:08:55

can i confirm? :npm-deps is considered deprecated and should prefer to use the webpack guide?

Lone Ranger16:08:47

my personal suggestion if your workflow allows is to use figwheel's webpack

Lone Ranger16:08:40

it saves a lot boilerplate

dnolen16:08:27

@dpsutton not deprecated but we're not working on improving it for the browser use case

dnolen16:08:41

:npm-deps works great if you're targeting Node.js

dpsutton16:08:35

thanks @dnolen. We're targeting browser and would like to reuse some Icon -> SVG React components. Investigating :npm-deps vs webpack and i thought i had remembered the webpack guide was considered the more modern and supported way forward

martinklepsch17:08:06

cljs-bean has () in some places without single-quoting and I thought that that’s usually a syntax error, why is it not? https://github.com/mfikes/cljs-bean/blob/69f258871c1b5cb7051a3e4a0b93d7f3380dcbad/src/cljs_bean/core.cljs#L202

martinklepsch17:08:43

And is there a way I could make a custom type that wraps a bean so that ILookup works as if it’s a bean but also extend these things with additional protocol methods? I guess specify! would work?

martinklepsch17:08:45

let me know if the question is clear and I’ll try to rephrase / elaborate

mfikes19:08:59

I suppose you have at least three alternatives to consider: 1) specify!, which affects a single instance 2) Extending the cljs-bean types to new protocols 3) Making your own custom deftype that wraps a bean, perhaps implementing ILookup by delegating to the wrapped bean.

martinklepsch02:08:37

Thanks, that’s roughly what I considered. With option 3 is there a way to achieve that in a somewhat concise way? I assume I would have to list every protocol I want to delegate to the bean?

martinklepsch02:08:07

Are there any downsides to using specify?

thheller17:08:46

@martinklepsch not a syntax error. it is allowed syntax for an empy list.

martinklepsch17:08:43

@thheller wild. TIL 😅 thought you always had to quote it

😮 4
Lone Ranger17:08:13

yeah I didn't know that either

dpsutton17:08:13

i think this is the line

dpsutton17:08:09

it quotes it for you

Alex Miller (Clojure team)17:08:07

quote means read-but-don't-evaluate

Alex Miller (Clojure team)17:08:24

but you don't need that because (eval ()) => ()

Alex Miller (Clojure team)17:08:46

the "special" case is non-empty lists

Alex Miller (Clojure team)17:08:14

in general, almost everything in clojure evaluates to itself, symbols and non-empty lists are the exceptions

scknkkrer17:08:42

Do you guys know any documentation about pitfalls of advanced optimization flag ?

martinklepsch17:08:40

Am I right in the understanding that using cljs-bean records will not yield the same fast-equality check characteristics that persistent data structures provide? (thinking in the context of using it in a React app)

mfikes20:08:42

Oh, I see you are, from the backlog 🙂 Well, if the underlying library you are using employs identical? then cljs-bean instances work properly with identical? because they are immutable. (But not persistent—in many cases they are closer to CoW).

mfikes20:08:49

If you are curious about the CoW aspect, here is a concrete example of that, where assoc results in a mutation being made to the result of a goog.object/clone call: https://github.com/mfikes/cljs-bean/blob/master/src/cljs_bean/core.cljs#L283

martinklepsch02:08:32

Awesome, thanks 🙏 Given that a big number of people use react maybe that’s something worth documenting more explicitly

Lone Ranger17:08:43

@scknkkrer mostly scattered legends and whispers

Lone Ranger17:08:09

I'm familiar with quite a few if you have any questions

scknkkrer17:08:31

I know that Google Closure trash out my symbols. Since when I find out this; I use only goog.object/getValuesByKeys to access object properties. But, What about setting them ?

scknkkrer17:08:45

Is there any safe way to do that @goomba?

Lone Ranger17:08:25

ahhh yes that's the main thing. what also works is js/thing.attribute.method

Lone Ranger17:08:01

but the (.. thing -attribute method) doesn't always work reliably

Lone Ranger17:08:59

and no -- there's no good way that I know of to prevent advanced compilation from occasionally trashing some of your symbols, but when I found the two solutions you mentioned I stopped investigating

scknkkrer17:08:44

@goomba, I’ve a problem with my code and I want to dig down. Any advice ?

scknkkrer17:08:33

only none for the optimizations works with my project.

scknkkrer18:08:05

core.cljs:10727 Uncaught TypeError: Cannot read property 'cljs$core$IFn$_invoke$arity$1' of undefined
    at $cljs$core$thisfn$$ (core.cljs:10727)
    at Function.cljs.core.clj__GT_js.cljs$core$IFn$_invoke$arity$variadic (core.cljs:10738)
    at cljs.core.clj__GT_js (core.cljs:10713)
    at events.cljs:20
    at std_interceptors.cljc:115
    at std_interceptors.cljc:114
    at re_frame.interceptor.invoke_interceptor_fn (interceptor.cljc:68)
    at re_frame.interceptor.invoke_interceptors (interceptor.cljc:106)
    at re_frame.interceptor.execute (interceptor.cljc:199)
    at re_frame.events.handle (events.cljc:65)
@goomba, an interesting stack-trace.

Lone Ranger18:08:00

what's the offending line of code? events.cljc line 65 it looks like

Lone Ranger18:08:09

or is that the re-frame code

Lone Ranger18:08:59

so I take it you think that this is a munging issue?

Lone Ranger18:08:12

are you able to access the javascript that you think is being munged from the console?

Lone Ranger18:08:40

oh and you said that this does work with no optimizations? Did you try :simple?

scknkkrer18:08:22

I’m digging with the source-map now. A normal clj->js call bugging.

Lone Ranger18:08:04

sorry, had to grab some lunch, how's it going?

scknkkrer18:08:51

whitespace optimization flag changed my problem. 

(index):305 Uncaught Error: Namespace "process.env" already declared.
    at Object.goog.provide ((index):305)
    at env.cljs:9
says, now.

Lone Ranger18:08:07

is this in figwheel? what command are you using to compile?

Lone Ranger18:08:15

and is this a runtime error or compiletime error?

scknkkrer18:08:26

Runtime error.

Lone Ranger18:08:45

what command are you using to compile?

scknkkrer18:08:59

I’m using a project template called descjop. But, I’ve add some libraries like re-frame and secretary, and keep up-to-date some of them.

scknkkrer18:08:18

:dependencies [[org.clojure/clojure "1.10.0"]
                 [org.clojure/clojurescript "1.10.520" :exclusions [org.apache.ant/ant]]
                 [re-frame "0.10.6"]
                 [org.clojars.scknkkrer/suluk "0.0.20"]
                 [figwheel-sidecar "0.5.18"]
                 [org.clojure/core.async "0.4.490"]
                 [reagent "0.8.1"]
                 [ring/ring-core "1.5.1"]
                 [figwheel "0.5.18"]
                 [clj-commons/secretary "1.2.4"]]
  :plugins [[lein-cljsbuild "1.1.7"]
            [lein-externs "0.1.6"]
            [lein-shell "0.5.0"]
            [lein-figwheel "0.5.18" :exclusions [org.clojure/core.cache]]]

Lone Ranger18:08:02

and... what's the command? lein cljsbuild once...?

scknkkrer18:08:16

{:source-paths ["src_front" "src_front_profile/desktopnew_front/dev"]
                                   :incremental true
                                   :jar true
                                   :assert true
                                   :compiler {:output-to "app/dev/js/front.js"
                                              :externs ["app/dev/js/externs_front.js"]
                                              :warnings true
                                              :elide-asserts true
                                              ;; :target :nodejs

                                              ;; no optimize compile (dev)
                                              :optimizations :none
                                              :output-dir "app/dev/js/out_front"
                                              :foreign-libs [{:file "app/dev/js/bundle.js"
                                                              :provides ["react" "react-dom"],
                                                              :requires ["react" "react-dom"]
                                                              :global-exports {react React
                                                                               react-dom ReactDOM}}]

                                              ;; simple compile (dev)
                                              ;;:optimizations :simple

                                              ;; advanced compile (prod)
                                              ;;:optimizations :advanced

                                              ;; :source-map "app/dev/js/test.js.map"
                                              :pretty-print true
                                              :output-wrapper true}}
This build just fine. But this;

scknkkrer18:08:28

This is development.

scknkkrer18:08:50

Here is the production: 

{:source-paths ["src_front" "src_front_profile/desktopnew_front/prod"]
                                    :incremental true
                                    :jar true
                                    :assert true
                                    :compiler {:output-to "app/prod/js/front.js"
                                               :externs ["app/prod/js/externs_front.js"]
                                               :warnings true
                                               :elide-asserts true
                                               :foreign-libs [{:file "app/prod/js/bundle.js"
                                                               :provides ["react" "react-dom" "create-react-class" "react-dom/server"]
                                                               :global-exports {react React
                                                                                react-dom ReactDOM
                                                                                create-react-class createReactClass
                                                                                react-dom/server ReactDOMServer}}]
                                               :output-dir "app/prod/js/out_front"
                                               :optimizations :whitespace
                                               :source-map "app/prod/js/test.js.map"
                                               :pseudo-names true
                                               :pretty-print true
                                               :output-wrapper false}}

Lone Ranger18:08:47

are your global exports different for a reason?

scknkkrer18:08:23

Nothing special. Just as documentation said.

Lone Ranger18:08:40

also, if you're using reagent and re-frame from any recent version, you shouldn't require react or react-dom as foreign libs

scknkkrer18:08:10

But, I’m using external libraries like ReactStrap.

Lone Ranger18:08:36

ah, that's probably what the externs.js

Lone Ranger18:08:51

how are you including reactstrap?

scknkkrer18:08:35

Directly via Webpack. Like; 

import React from 'react';
import ReactDOM from 'react-dom';

window.React = React;
window.ReactDOM = ReactDOM;

window.ReactStrap = require("reactstrap");

window.TextMask = require("react-text-mask");
window.TextMaskAddons = require("text-mask-addons");

Lone Ranger18:08:41

gotcha. and what's going on at env.cljs line 9?

scknkkrer18:08:23

Was that a question or a statement ? I’m sorry, my English needs some practice.

scknkkrer18:08:09

And here is my compiler messages under simple option.

scknkkrer18:08:15

Compiling ["app/prod/js/front.js"] from ["src_front" "src_front_profile/desktopnew_front/prod"]...
WARNING: var: suluk.response/res->text is not public at line 21 app/prod/js/out_front/suluk/constants/constants.cljs
WARNING: get already refers to: cljs.core/get being replaced by: suluk.requests.get/get at line 7 app/prod/js/out_front/suluk/requests/get.cljs
WARNING: get already refers to: cljs.core/get being replaced by: suluk.requests.core/get at line 7 app/prod/js/out_front/suluk/requests/core.cljs
Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/object-assign/index.js:4: WARNING - constant $jscomp assigned a value more than once.
Original definition at  [synthetic:base] :26
var $jscomp = $jscomp || {};
    ^^^^^^^^^^^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:1614: WARNING - unreachable code
      return "";
      ^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:3242: WARNING - unreachable code
      return null;
      ^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:3272: WARNING - unreachable code
      return null;
      ^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:5296: WARNING - unreachable code
      return null;
      ^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:5852: WARNING - unreachable code
      return namespace;
      ^^^^^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:5861: WARNING - unreachable code
      var parentNamespace = parentHostContext;
      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:7567: WARNING - unreachable code
      return false;
      ^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:16495: WARNING - unreachable code
      return findHostInstance(component);
      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager println
WARNING: /Users/sckn/projects/business/qulak/desktopnew/app/prod/js/out_front/node_modules/react-dom/cjs/react-dom.development.js:16932: WARNING - unreachable code
      return findHostInstance(componentOrElement);
      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Aug 26, 2019 9:43:29 PM com.google.javascript.jscomp.LoggerErrorManager printSummary
WARNING: 0 error(s), 10 warning(s)
Successfully compiled ["app/prod/js/front.js"] in 41.537 seconds.

Lone Ranger18:08:22

I meant what is the code in your file env.cljs on line 9 (where the stacktrace says the error occurs)

scknkkrer18:08:38

Just a simple ns with one var on it. Let me copy-and-paste it.

scknkkrer18:08:02

(ns process.env
  "A shim namespace for the Node.js process library")

(goog-define NODE_ENV "development")

Lone Ranger18:08:01

hmm.. well according to that error message, process.env is being declared multiple times from different files

scknkkrer18:08:52

I’m trying infer-externs flag. But, nothing good.

Lone Ranger18:08:40

😕 so whatever it is looks like it isn't going to be an easy fix, sorry. I don't think there's much more I'd be able to do from here

scknkkrer18:08:55

No problem, thank you for your help. If I get the error, I’ll share the solution.

👍 4
scknkkrer19:08:42

@goomba, It’s about externs. I did prove my hypothesis. I removed foreign-libs from compiler options. Added webpack file externally.

Lone Ranger19:08:03

hey great!! good work!!

scknkkrer19:08:17

But. Some clojurescript functions has to be declared in extern file.

scknkkrer19:08:16

How you guys hand external libraries’ externs ? Specifically, comes with webpack ?

Lone Ranger19:08:22

I use figwheel-main

scknkkrer20:08:36

I’m using a couple of external libraries that I should take care of. That’s the problem.

michael.heuberger22:08:18

good morning guys - having issues here compiling a cljs project using a scoped npm package. always complains with 

No such namespace: @microsoft/office-js, could not locate _CIRCA_microsoft_SLASH_office_js.cljs, _CIRCA_microsoft_SLASH_office_js.cljc, or JavaScript source providing "@microsoft/office-js" (Please check that namespaces with dashes use underscores in the ClojureScript file name) in file src/cljs/smx_ms_outlook_addin/app.cljs

henrik09:08:49

Try compiling with http://shadow-cljs.org/. It’s considerably easier to use NPM libs with Shadow.

Lone Ranger10:08:40

I'd also recommend figwheel-main with deps.edn using the webpack approach

michael.heuberger21:08:09

thanks guys but don’t think can switch to shadow or figwheel for that project. only can stick to boot-clj and clojurescript’s npm-deps compiler option. works very well when package is NOT scoped. only giving me headaches when scoped.

michael.heuberger22:08:14

wondering if it’s this bug https://clojure.atlassian.net/browse/CLJS-2633 ? if you read the latest comment then it is unclear on that ticket if it’s already fixed or not?