带有 Play 框架的 ScalaJs（测试错误）

Question

I am trying to use ScalaJs cross build project with Play Framework 2.5. I am facing a problem when I am trying to run the tests for Client.scala . The error I am getting is -

caused by: TypeError: Cannot call method "appendChild" of null .

Client snippet

@JSExport
object DashboardClient extends js.JSApp {
@JSExport
def main(): Unit = {
val dashboard = new Dashboard
dom.document.getElementById("bodyContent").appendChild(dashboard.bodyFrag.render)
}

This bodyFrag is inside a different class

 def bodyFrag =
div(
  div(
    `class` := "row border-bottom",
    div(
      `class` := "col-md-12",
      div(
        `class` := "col-md-2 image-alignment",
        img(width := "161", src := "/assets/images/mountain.jpg")
      ),
      div(`class` := "col-md-10")
    )
  ),
  div(
    `class` := "row border-bottom",
    div(
      `class` := "col-md-12",
      div(
        `class` := "col-md-12",
        h1(`class` := "text-center", "Dashboard")
      )
    )
  )
)

So when I am trying to test is using utest I get the above mentioned error. Please help.

PS - I am completely new to Scala and ScalaJs.

Answer 1

Well, the error doesn't appear to have anything to do with bodyFrag . (Or Play, or even Scala.js, really.) The error is literally saying that getElementById("bodyContent") is null, which means it doesn't yet exist. I assume it's declared in the HTML.

This is a common trap in browser code. You need to wait for the DOM to be ready before you try manipulating it; you don't show the HTML page, so I'm not sure whether you're doing that, but I suspect not.

There are various ways to wait for DOM ready -- the common (but slower) onload approach, and the jQuery approach, are discussed in the jQuery documentation . As a quick fix, I would recommend wrapping the call to your Scala.js code inside window.onload .