From 382505bb9e96dc7972dfc80cd2e59368546e0a47 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Thu, 12 Jun 2014 15:40:22 +0200 Subject: [PATCH 1/7] Step 1: Setup --- build.sbt | 7 +++++++ project/build.properties | 1 + project/plugins.sbt | 1 + src/main/scala/tutorial/webapp/TutorialApp.scala | 7 +++++++ 4 files changed, 16 insertions(+) create mode 100644 build.sbt create mode 100644 project/build.properties create mode 100644 project/plugins.sbt create mode 100644 src/main/scala/tutorial/webapp/TutorialApp.scala diff --git a/build.sbt b/build.sbt new file mode 100644 index 0000000..93886a2 --- /dev/null +++ b/build.sbt @@ -0,0 +1,7 @@ +enablePlugins(ScalaJSPlugin) + +name := "Scala.js Tutorial" +scalaVersion := "2.13.3" + +// This is an application with a main method +scalaJSUseMainModuleInitializer := true diff --git a/project/build.properties b/project/build.properties new file mode 100644 index 0000000..0837f7a --- /dev/null +++ b/project/build.properties @@ -0,0 +1 @@ +sbt.version=1.3.13 diff --git a/project/plugins.sbt b/project/plugins.sbt new file mode 100644 index 0000000..1a10340 --- /dev/null +++ b/project/plugins.sbt @@ -0,0 +1 @@ +addSbtPlugin("org.scala-js" % "sbt-scalajs" % "1.3.0") diff --git a/src/main/scala/tutorial/webapp/TutorialApp.scala b/src/main/scala/tutorial/webapp/TutorialApp.scala new file mode 100644 index 0000000..9be2dd8 --- /dev/null +++ b/src/main/scala/tutorial/webapp/TutorialApp.scala @@ -0,0 +1,7 @@ +package tutorial.webapp + +object TutorialApp { + def main(args: Array[String]): Unit = { + println("Hello world!") + } +} From 7481ee8d86d2f113ee0778c0b65ca87adb343bb7 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Fri, 13 Jun 2014 08:58:35 +0200 Subject: [PATCH 2/7] Step 2: Integrating with HTML --- scalajs-tutorial-fastopt.html | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 scalajs-tutorial-fastopt.html diff --git a/scalajs-tutorial-fastopt.html b/scalajs-tutorial-fastopt.html new file mode 100644 index 0000000..f931017 --- /dev/null +++ b/scalajs-tutorial-fastopt.html @@ -0,0 +1,11 @@ + + + + + Codestin Search App + + + + + + From faf303adb2ffba71d001859e834d3e30d5710b39 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Fri, 13 Jun 2014 10:42:28 +0200 Subject: [PATCH 3/7] Step 3: Using the DOM --- build.sbt | 2 ++ src/main/scala/tutorial/webapp/TutorialApp.scala | 11 ++++++++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/build.sbt b/build.sbt index 93886a2..482f981 100644 --- a/build.sbt +++ b/build.sbt @@ -5,3 +5,5 @@ scalaVersion := "2.13.3" // This is an application with a main method scalaJSUseMainModuleInitializer := true + +libraryDependencies += "org.scala-js" %%% "scalajs-dom" % "1.1.0" diff --git a/src/main/scala/tutorial/webapp/TutorialApp.scala b/src/main/scala/tutorial/webapp/TutorialApp.scala index 9be2dd8..5c64096 100644 --- a/src/main/scala/tutorial/webapp/TutorialApp.scala +++ b/src/main/scala/tutorial/webapp/TutorialApp.scala @@ -1,7 +1,16 @@ package tutorial.webapp +import org.scalajs.dom +import org.scalajs.dom.document + object TutorialApp { def main(args: Array[String]): Unit = { - println("Hello world!") + appendPar(document.body, "Hello World") + } + + def appendPar(targetNode: dom.Node, text: String): Unit = { + val parNode = document.createElement("p") + parNode.textContent = text + targetNode.appendChild(parNode) } } From 258203d6527168f812890f242244ec68bbdbdce7 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Fri, 13 Jun 2014 10:57:20 +0200 Subject: [PATCH 4/7] Step 4: Reacting on User Input --- scalajs-tutorial-fastopt.html | 4 ++++ src/main/scala/tutorial/webapp/TutorialApp.scala | 7 +++++++ 2 files changed, 11 insertions(+) diff --git a/scalajs-tutorial-fastopt.html b/scalajs-tutorial-fastopt.html index f931017..f17aefd 100644 --- a/scalajs-tutorial-fastopt.html +++ b/scalajs-tutorial-fastopt.html @@ -5,6 +5,10 @@ Codestin Search App + + diff --git a/src/main/scala/tutorial/webapp/TutorialApp.scala b/src/main/scala/tutorial/webapp/TutorialApp.scala index 5c64096..e3ba9dc 100644 --- a/src/main/scala/tutorial/webapp/TutorialApp.scala +++ b/src/main/scala/tutorial/webapp/TutorialApp.scala @@ -1,5 +1,7 @@ package tutorial.webapp +import scala.scalajs.js.annotation.JSExportTopLevel + import org.scalajs.dom import org.scalajs.dom.document @@ -13,4 +15,9 @@ object TutorialApp { parNode.textContent = text targetNode.appendChild(parNode) } + + @JSExportTopLevel("addClickedMessage") + def addClickedMessage(): Unit = { + appendPar(document.body, "You clicked the button!") + } } From 0296d63024ecaee5748262bc169097bb99b483d3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Doeraene?= Date: Sat, 23 Jan 2016 11:10:26 +0100 Subject: [PATCH 5/7] Step 5: Setup the UI in Scala.js --- scalajs-tutorial-fastopt.html | 4 ---- src/main/scala/tutorial/webapp/TutorialApp.scala | 16 +++++++++++++--- 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/scalajs-tutorial-fastopt.html b/scalajs-tutorial-fastopt.html index f17aefd..f931017 100644 --- a/scalajs-tutorial-fastopt.html +++ b/scalajs-tutorial-fastopt.html @@ -5,10 +5,6 @@ Codestin Search App - - diff --git a/src/main/scala/tutorial/webapp/TutorialApp.scala b/src/main/scala/tutorial/webapp/TutorialApp.scala index e3ba9dc..ac34cfd 100644 --- a/src/main/scala/tutorial/webapp/TutorialApp.scala +++ b/src/main/scala/tutorial/webapp/TutorialApp.scala @@ -1,12 +1,23 @@ package tutorial.webapp -import scala.scalajs.js.annotation.JSExportTopLevel - import org.scalajs.dom import org.scalajs.dom.document object TutorialApp { def main(args: Array[String]): Unit = { + document.addEventListener("DOMContentLoaded", { (e: dom.Event) => + setupUI() + }) + } + + def setupUI(): Unit = { + val button = document.createElement("button") + button.textContent = "Click me!" + button.addEventListener("click", { (e: dom.MouseEvent) => + addClickedMessage() + }) + document.body.appendChild(button) + appendPar(document.body, "Hello World") } @@ -16,7 +27,6 @@ object TutorialApp { targetNode.appendChild(parNode) } - @JSExportTopLevel("addClickedMessage") def addClickedMessage(): Unit = { appendPar(document.body, "You clicked the button!") } From d144be00b1acadf15e76132d56e28bd7060f07b3 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Sat, 14 Jun 2014 16:18:27 +0200 Subject: [PATCH 6/7] Step 6: Testing --- build.sbt | 7 ++++ project/plugins.sbt | 2 ++ .../scala/tutorial/webapp/TutorialTest.scala | 35 +++++++++++++++++++ 3 files changed, 44 insertions(+) create mode 100644 src/test/scala/tutorial/webapp/TutorialTest.scala diff --git a/build.sbt b/build.sbt index 482f981..1dffc2e 100644 --- a/build.sbt +++ b/build.sbt @@ -7,3 +7,10 @@ scalaVersion := "2.13.3" scalaJSUseMainModuleInitializer := true libraryDependencies += "org.scala-js" %%% "scalajs-dom" % "1.1.0" + +// Add support for the DOM in `run` and `test` +jsEnv := new org.scalajs.jsenv.jsdomnodejs.JSDOMNodeJSEnv() + +// uTest settings +libraryDependencies += "com.lihaoyi" %%% "utest" % "0.7.4" % "test" +testFrameworks += new TestFramework("utest.runner.Framework") diff --git a/project/plugins.sbt b/project/plugins.sbt index 1a10340..920f1f6 100644 --- a/project/plugins.sbt +++ b/project/plugins.sbt @@ -1 +1,3 @@ addSbtPlugin("org.scala-js" % "sbt-scalajs" % "1.3.0") + +libraryDependencies += "org.scala-js" %% "scalajs-env-jsdom-nodejs" % "1.1.0" diff --git a/src/test/scala/tutorial/webapp/TutorialTest.scala b/src/test/scala/tutorial/webapp/TutorialTest.scala new file mode 100644 index 0000000..47503fc --- /dev/null +++ b/src/test/scala/tutorial/webapp/TutorialTest.scala @@ -0,0 +1,35 @@ +package tutorial.webapp + +import utest._ + +import scala.scalajs.js + +import org.scalajs.dom +import org.scalajs.dom.document +import org.scalajs.dom.ext._ + +object TutorialTest extends TestSuite { + + // Initialize App + TutorialApp.setupUI() + + def tests = Tests { + test("HelloWorld") { + assert(document.querySelectorAll("p").count(_.textContent == "Hello World") == 1) + } + + test("ButtonClick") { + def messageCount = + document.querySelectorAll("p").count(_.textContent == "You clicked the button!") + + val button = document.querySelector("button").asInstanceOf[dom.html.Button] + assert(button != null && button.textContent == "Click me!") + assert(messageCount == 0) + + for (c <- 1 to 5) { + button.click() + assert(messageCount == c) + } + } + } +} From c9591eaf04b87555c52980415a1fc9dea2bb4692 Mon Sep 17 00:00:00 2001 From: Tobias Schlatter Date: Fri, 13 Jun 2014 17:00:28 +0200 Subject: [PATCH 7/7] Step 7: Optimizing for Production --- scalajs-tutorial.html | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 scalajs-tutorial.html diff --git a/scalajs-tutorial.html b/scalajs-tutorial.html new file mode 100644 index 0000000..815b892 --- /dev/null +++ b/scalajs-tutorial.html @@ -0,0 +1,11 @@ + + + + + Codestin Search App + + + + + +