Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jan 31 2019 10:57
  • Jan 30 2019 22:22
    bitpirate starred japgolly/scalajs-react
  • Jan 30 2019 08:11

    japgolly on master

    Update docs for changes in 1.4.0 (compare)

  • Jan 29 2019 13:20
  • Jan 28 2019 08:08
    booleguo starred japgolly/scalajs-react
  • Jan 28 2019 04:09

    japgolly on v1.4.0

    (compare)

  • Jan 28 2019 04:05

    japgolly on master

    Towards v1.4.1 (compare)

  • Jan 28 2019 04:04

    japgolly on master

    Prepare for v1.4.0 Upgrade React to 16.6.3 React.lazy and 85 more (compare)

  • Jan 28 2019 04:04
    japgolly closed #521
  • Jan 28 2019 04:04
    japgolly opened #521
  • Jan 28 2019 04:03

    japgolly on v1.4.x

    Add note about Reusability/Reus… doc formatting Prepare to release v1.4.0 (compare)

  • Jan 28 2019 04:02
    wiitht starred japgolly/scalajs-react
  • Jan 28 2019 03:18

    japgolly on v1.4.x

    Test AsyncCallback.init Update Travis CI caching (compare)

  • Jan 28 2019 03:02

    japgolly on v1.4.x

    Update Travis CI cache dirs Revise changelog (compare)

  • Jan 28 2019 03:00
    japgolly labeled #520
  • Jan 28 2019 03:00
    japgolly labeled #519
  • Jan 27 2019 17:36
  • Jan 26 2019 06:49
    japgolly commented #520
  • Jan 26 2019 05:55
    japgolly commented #519
  • Jan 26 2019 02:35
    cquiroz opened #520
elkhadirzyad
@elkhadirzyad
image.png
@oyvind i have spread in red, what am i missing ?
Rohan Sircar
@rohan-sircar
Does it compile?
elkhadirzyad
@elkhadirzyad
with implicit class SpreadOpsB <: StBuildingComponent[_] it works
now i have error
image.png
in line 590
image.png
Rohan Sircar
@rohan-sircar
Put the code in code tags please
Wrap it in triple backticks - ```
elkhadirzyad
@elkhadirzyad
ok
Armin Keyvanloo
@arminio

Hi all,
I need some help setting up my first unit test for sjs react. I have the following test:

import utest._
.....

object TestTest extends TestSuite {

  val tests: Tests = Tests {

    "plainElement" - {
      val re: VdomElement = <.div("Good")
      val c               = ReactTestUtils.renderIntoDocument(re)
      test(c, """<div>Good</div>""")
    }
  }
}

When I run it I get this error:

- TestTest.plainElement.0 2ms 
  scala.scalajs.js.JavaScriptException: ReferenceError: document is not defined
    <jscode>.Object.renderIntoDocument(react-dom-test-utils.development.js:1163)
    japgolly.scalajs.react.test.ReactTestUtils$.renderIntoDocument(ReactTestUtils.scala:66)
    <jscode>.array$9(Chicken.scala:51)
    scala.scalajs.runtime.AnonFunction0.apply(AnonFunctions.scala:22)

So renderIntoDocument is erroring as there are no documents to render to.
Does anyone know what is causing this?

Armin Keyvanloo
@arminio

In the setup section of this page: https://github.com/japgolly/scalajs-react/blob/master/doc/TESTING.md#test-scripts
it says:
// React JS itself. // NOTE: Requires react-with-addons.js instead of just react.js

I am not entirely sure what that means and how to set up the reacts addson via the scalajs-bundler

Any help will be much appreciated

Armin Keyvanloo
@arminio

In addition to the above, I have also tried using test-state.
Things are starting to get really frustrating for me.
My test (copied from the test-state example) fail with this error:

-------------------------------- Running Tests --------------------------------
X app.TodoTest 0ms 
  scala.scalajs.js.JavaScriptException: ReferenceError: Sizzle is not defined
    teststate.domzipper.sizzle.Exports.$init$(Exports.scala:7)
    app.MyTestState$.<init>(MyTestState.scala:8)
    app.MyTestState$.<clinit>(MyTestState.scala:8)
    app.TodoTestDsl$.<init>(TodoTestDsl.scala:68)
    app.TodoTestDsl$.<clinit>(TodoTestDsl.scala:58)
    app.TodoTest$.<init>(TodoTest.scala:16)
    app.TodoTest$.<clinit>(TodoTest.scala:8)
    <jscode>.{anonymous}()(TodoTest.scala:8)
    scala.scalajs.reflect.LoadableModuleClass.loadModule(Reflect.scala:24)
    utest.PlatformShims$.loadModule(PlatformShims.scala:26)
[info] 
[error] Failed tests:
[error]         app.TodoTest
[error] (Test / test) sbt.TestsFailedException: Tests unsuccessful
[error] Total time: 3 s, completed 07-Sep-2020 17:32:07
sbt:client>

This is my sbt:

lazy val client = (project in file("client"))
  .enablePlugins(ScalaJSPlugin)
  .enablePlugins(ScalaJSBundlerPlugin)
  .settings(
    scalaJSUseMainModuleInitializer := true,
    libraryDependencies ++= Seq(
      "com.github.japgolly.scalajs-react" %%% "core"              % "1.7.5",
      "com.github.japgolly.scalajs-react" %%% "extra"             % "1.7.5",
      "com.github.japgolly.scalacss"      %%% "ext-react"         % "0.6.1",
      "com.lihaoyi"                       %%% "upickle"           % "1.2.0",
      "io.suzaku"                         %%% "diode-react"       % "1.1.13",
      "com.lihaoyi"                       %%% "autowire"          % "0.3.2",
      "com.github.japgolly.scalajs-react" %%% "test"              % "1.7.5" % Test,
      "org.querki"                        %%% "jquery-facade"     % "2.0" % Test,
      "com.lihaoyi"                       %%% "utest"             % "0.7.5" % Test,
//      "com.github.japgolly.test-state"    %%% "core"              % TestStateVer % "test",
//      "com.github.japgolly.test-state"    %%% "dom-zipper"        % TestStateVer % "test",
      "com.github.japgolly.test-state"    %%% "dom-zipper-sizzle" % TestStateVer % "test",
      "com.github.japgolly.test-state"    %%% "ext-scalajs-react" % TestStateVer % "test",
      "com.github.julien-truffaut"        %%% "monocle-core"      % "2.0.4",
      "com.github.julien-truffaut"        %%% "monocle-macro"     % "2.0.4",
      "com.github.japgolly.scalajs-react" %%% "ext-monocle-cats"  % "1.7.5",
      "org.scala-js"                      %%% "scalajs-java-time" % "1.0.0" % Test
    ),
    npmDependencies in Compile ++= Seq(
//      "sizzle""2.3.0",
      "react"     -> "16.13.1",
      "react-dom" -> "16.13.1",
      "bootstrap""4.5.2",
      "jquery""1.9.1",
      "popper.js""1.16.1"
    )

  )
  .settings(addCompilerPlugin("org.scalamacros" %% "paradise" % "2.1.1" cross CrossVersion.full))
  .settings(testFrameworks += new TestFramework("utest.runner.Framework"))

Can someone please give me hand to resolve these issues?

Armin Keyvanloo
@arminio
Also I would like to mention that:
val TestStateVer = "2.4.1"
Armin Keyvanloo
@arminio

This is now fixed:

When I run it I get this error:

- TestTest.plainElement.0 2ms 
  scala.scalajs.js.JavaScriptException: ReferenceError: document is not defined
    <jscode>.Object.renderIntoDocument(react-dom-test-utils.development.js:1163)
    japgolly.scalajs.react.test.ReactTestUtils$.renderIntoDocument(ReactTestUtils.scala:66)
    <jscode>.array$9(Chicken.scala:51)
    scala.scalajs.runtime.AnonFunction0.apply(AnonFunctions.scala:22)

So renderIntoDocument is erroring as there are no documents to render to.
Does anyone know what is causing this?

This was fixed by adding requireJsDomEnv in Test := true to build.sbt

But still haven't found a solution to the Test State issue above (Sizzle is not defined)
Can anyone help please?
Armin Keyvanloo
@arminio
FIXED
oh... I added .enablePlugins(JSDependenciesPlugin) and the Sizzle is not defined issue went away!
So even though I don't use the JSDependenciesPlugin myself, it seems that it needs to be enabled for the com.github.japgolly.test-state" %%% "dom-zipper-sizzle dependency to work
Armin Keyvanloo
@arminio
Is my understanding correct?
Armin Keyvanloo
@arminio
Hi @japgolly, would you be able to tell me plz what the Sack class represents in TestState?
nafg
@nafg
@arminio if you provide a link maybe someone else can
nafg
@nafg
I just did some browsing, it looks like it's used by the implementation as a typeclass for quasi-derivation internally
Anyway he doesn't reply here much, you might try tweeting him or opening an issue on the repo asking for to add a few lines of documentation ("private internal implementation detail" or an explanation of how people can use it)
David Barri
@japgolly
Oh wow, what funny timing this is for me to check in here :D
David Barri
@japgolly
@nafg is right. My habit when in front of a computer is to spend about 5-10 reading reddit or whatever, then it's just full-steam-ahead coding non-stop. I find the burden of having to reply to github, email, and twitter sometimes more than enough so it's extremely rare that I go out looking for more spaces to reply / chat / talk. I'm just a work machine. So yeah sorry @arminio, I hope there's enough knowledge around people here that everyone can help everyone out. Otherwise feel free to raise a StackOverflow question or Github issue if no one knows, I'll try to make time to respond but there might be a wait because I've literally got months and months worth of work already queued up.
David Barri
@japgolly
@arminio To answer the question about Sack though, it's pretty funny that you're peeking around there. I'm gonna guess that you inspected a type and the IDE dealiased the type for you. As you can see from the subtypes, a Sackis a value, a recursive product or a recursive coproduct. @nafg made an educated guess that it's related to typeclass derivation but it's actually the structure of all composable concepts in Test State. Users are not supposed to know about it because it's part of the internal API and you never interact with it directly. The public types that you should know about are documented here https://github.com/japgolly/test-state/blob/master/doc/TYPES.md and under-the-hood, some of them dealias to Sacks. If you want to be explicit about your Test State types, use the type members provided on your dsl object. This is an example: https://github.com/japgolly/test-state/blob/master/example-react/src/test/scala/teststate/example/react/TodoTestDsl.scala#L76
Oh and everything is plural. There's no dsl.Action vs dsl.Actions; the type is always the plural form even if the value contains only one action.
@arminio Yes, you're exactly right about JSDependenciesPlugin
David Barri
@japgolly
So it seems some of the documentation has become stale in the post-Scala.JS-1.0-world, @arminio it'd be really appreciated if you would kindly submit a PR, or even an issue with a list of changes you had to make, so that we can update the doc for future users.
And sorry you bumped into a few problems. Glad to hear you got it sorted out
Armin Keyvanloo
@arminio
Thanks for replying to all my queries above @japgolly :thumbsup:
I am planing to create a PR of the test-state documentation once I have everything working.
Would you be able to tell me what's the best way to ask test-state related questions on stackoverflow?
Should I simply tag my test-state questions with scalajs-react?
Armin Keyvanloo
@arminio

So it seems some of the documentation has become stale in the post-Scala.JS-1.0-world, @arminio it'd be really appreciated if you would kindly submit a PR, or even an issue with a list of changes you had to make, so that we can update the doc for future users.

@japgolly PR for a small update to the test-state documentation raised:
japgolly/test-state#144

nafg
@nafg
val state: StateSnapshot[State] = ???
val field1Snapshot = state.zoomStateL(State.field1)
val field2Snapshot = state.zoomStateL(State.field2)

field1Snapshot.setState(x) >> field2Snapshot.setState(y)
Is there any way to make that work?
Because of the way it works it seems like the second setState essentially overrides the first
Is there a way to decompose and then recompose state-setting like that?
mvillafuertem
@mvillafuertem
@japgolly Hi I have been working so far with slinky, I have created a project with some examples of hooks. now I would like to know how to write custom hooks using scalajs-react. Any example using useMemo, useContext or useRef without declaring components? Here my example in Slinky.
Artsiom Miklushou
@mikla

Hi,

Is it okay to have EmptyVDomElement contstucted as VdomElement.apply(null) ?

Carlos Quiroz
@cquiroz
There is an EmptyVdom instance
Artsiom Miklushou
@mikla
Ended up using React.Fragment. Thx
Mathieu Prevel
@mprevel

Hi,

What is the best way to use a callback in a facade exposing a js.Any => js.Any function ?
Should I use a (x:js.Any) => Callback(...).runNow() ?

☮ David Barri ☮ 🖤 ✊🏿
@japgolly_twitter
Hey. The .toJsFn1 method on your callback sounds like what you're looking for.
Mathieu Prevel
@mprevel
Maybe I'm wrong, but I cannot use .toJsFn1 if I need to use the function parameter in the Callback ?
David Barri
@japgolly
Oh my bad I didn't realise you were using the parameter. In that case, you've got two options: (1) exactly what you wrote above, (2) use CallbackKleisli and then call .toJsFn. (1) is nice and simple and (2) is a great option if you're doing lots of composition but in many cases it's likely to just be over-engineering for no benefit so you'll have to access your situation and choose whichever's best. Hope that helps
Mathieu Prevel
@mprevel
Thanks. :) In my current case it is a simple Callback that reads the event target value to update the current component state, so I'll go for (1). But it is good to know about option (2) for more complex cases.