reagent

2024-07-19T17:20:53.265889Z

Hi, how a "data-<name>" attribute should be written?

2024-07-19T17:20:54.394789Z

I'm getting this error:

🙌 1
2024-07-19T17:21:03.900259Z

2024-07-19T17:21:23.026239Z

forget the "=" the error is the same

p-himik 2024-07-19T17:24:27.068339Z

:data-* works just fine for me. By "the error is the same", do you mean that it still includes = even when you remove it?

2024-07-19T17:25:07.751049Z

no, the error still comes out when the attribute doesn't have the =

p-himik 2024-07-19T17:25:41.813979Z

And the error then is about :data-bs-toggle, not :data-bs-toggle=, right? Just want to confirm.

p-himik 2024-07-19T17:28:15.978029Z

If yes, then what's components/input?

2024-07-19T17:29:12.945979Z

yes, the error (warning) is about :data-bs-toggle

2024-07-19T17:29:49.035939Z

the resulting html is something like <button ... dataBsToggle="dropdown">

p-himik 2024-07-19T17:30:37.689349Z

OK, but what is components/input?

2024-07-19T17:31:59.226809Z

(defn input [{:keys [label error container-size value name id] :as p}]
  (let [input-id (str "input_" (or id name))
        props (dissoc p :label :container-size error)
        class-str ((or container-size :normal) container-classes)
        input-props (merge-props props {:id input-id :value (or value "") :class (when error "is-invalid")})]
    [:div {:class class-str}
     [:label.form-label {:for input-id} label]
     [:input.form-control input-props]
     (when error [:div.invalid-feedback error])]))

p-himik 2024-07-19T17:36:07.265969Z

And does the overall rendering go through the regular Reagent machinery? What's the version of React and react-dom?

2024-07-19T17:36:59.299929Z

17.0.2

2024-07-19T17:37:12.554489Z

and yes regular reagent

p-himik 2024-07-19T17:38:27.051889Z

Alright, same here. And the Reagent version?

2024-07-19T17:39:52.248879Z

1.2.0

p-himik 2024-07-19T17:44:46.501219Z

Also the same. I just tried it to double-check and it ended up as data-bs-toggle="dropdown" in the HTML, without a warning. Just as expected. What's also weird is that you see dataBsToggle in the HTML but the warning is about data-bs-toggle. I don't see how these two facts can be observed together. There can be all sorts of weird behaviors in these scenarios: • The actual Reagent version is different (check what's on the classpath of the CLJS build process) • The actual React version is different (check node_modules/react/package.json) • There are two versions of React loaded by the page

p-himik 2024-07-19T17:44:52.415789Z

Oh! What's merge-props?

p-himik 2024-07-19T17:50:53.453109Z

Alright, no clue then apart from the bullet list above. I'll take a look if you create a public MRE.

2024-07-19T17:52:16.123069Z

thanks, we will continue debugging ... I'll ask if it is possible to create something public

2024-07-19T17:55:40.336339Z

🥳 it is working, we cleaned and re-installed with npm and now it is working

2024-07-19T17:56:25.501929Z

there were definitely something wrong with the node modules

2024-07-19T17:56:38.245669Z

thank you very much!

👍 1
p-himik 2024-07-19T19:37:10.618149Z

Might've been nested node_modules somewhere with an older version of React, or something like that. It's a good idea to report such nested modules in your CI or somewhere else (e.g. shadow-cljs release report produces an output that specifies which modules are included more than once).