diff --git a/ChangeLog.md b/ChangeLog.md --- a/ChangeLog.md +++ b/ChangeLog.md @@ -1,3 +1,9 @@ +# 1.0.3 + +* I switched to using stack to build, and updated the documentation to explain how to use stack. It is + still possible to use cabal but I suggest using stack. There is no functionality change in this release, + just updated documentation. + # 1.0.2 * Update to build with latest ghcjs master. The breaking change was diff --git a/Makefile b/Makefile new file mode 100644 --- /dev/null +++ b/Makefile @@ -0,0 +1,22 @@ +.PHONY: all clean +INSTALL_ROOT:=$(shell stack path --local-install-root) + +all: js-build/install-root js-build/todo.min.js + +js-build/install-root: $(INSTALL_ROOT) + mkdir -p js-build + ln -s $(INSTALL_ROOT) js-build/install-root + +js-build/todo.min.js: js-build/todo.js + closure --compilation_level=ADVANCED_OPTIMIZATIONS js-build/todo.js > js-build/todo.min.js + +js-build/todo.js: $(INSTALL_ROOT)/bin/todo.jsexe/all.js + mkdir -p js-build + echo "(function(global,React,ReactDOM) {" > js-build/todo.js + cat $(INSTALL_ROOT)/bin/todo.jsexe/all.js >> js-build/todo.js + echo "})(window, window['React'], window['ReactDOM']);" >> js-build/todo.js + sed -i 's/goog.provide.*//' js-build/todo.js + sed -i 's/goog.require.*//' js-build/todo.js + +clean: + rm -rf js-build diff --git a/README.md b/README.md --- a/README.md +++ b/README.md @@ -8,28 +8,45 @@ The [haddocks](https://hackage.haskell.org/package/react-flux) contain the documentation. -# Build +# Using in your own project -This package requires GHC 7.10.2 and the improved-base branch of ghcjs. -I followed the instructions in the [ghcjs wiki](https://github.com/ghcjs/ghcjs/wiki/GHCJS-with-GHC-7.10) -to install the improved-base branch. Once ghcjs is installed, I use the following to build react-flux: +I use stack to build my frontend which uses react-flux. I set up stack and +ghcjs using [these +instructions](http://docs.haskellstack.org/en/stable/ghcjs.html). Note that +react-flux requires GHCJS master (a.k.a. improved base). At the moment I want +to use GHC 7.10.3 and no ghcjs snapshot uses lts-4.1 and GHC 7.10.3, so I am +building ghcjs manually. So what I do is [install ghcjs from +git](https://github.com/ghcjs/ghcjs) using the following. (Once the ghcjs +snapshots have caught up I will transition to using them and have stack install +ghcjs instead of installing ghcjs manually.) ~~~ -echo "compiler: ghcjs" > cabal.config -cabal configure -cabal build +$ git clone https://github.com/ghcjs/ghcjs.git +$ cabal install ./ghcjs +$ ghcjs-boot --dev ~~~ +After this, in my application which depends on react-flux, I use the following `stack.yaml`: + +~~~ +resolver: lts-4.1 +compiler: ghcjs-0.2.0_ghc-7.10.3 +packages: + - . +extra-deps: + - react-flux-1.0.3 +~~~ + + # Example Applications The source contains some [example applications](https://bitbucket.org/wuzzeb/react-flux/src/tip/example). -To try out the TODO example, execute +To try out the TODO example, clone the repository, set up ghcjs manually as in the previous section, and then execute: ~~~ -cabal configure -fexample -cabal build -cd example/todo +stack build make +cd example/todo firefox todo.html ~~~ @@ -38,28 +55,29 @@ # Test Suite -To run the test suite, first you must build both the example applications and the test-client. (The -test-client is a react-flux application which contains code for everything not contained in the todo -example.) +To run the test suite, first you must build both the example applications and +the test-client using ghcjs. (The test-client is a react-flux application +which contains code for everything not contained in the todo example.) This is +the first `stack build` below. Then, you must build the test suite, which is a +haskell application using +[hspec-webdriver](https://hackage.haskell.org/package/hspec-webdriver). This +must be built using GHC (not GHCJS), so there is a separate `stack.yaml` file +in the `test/spec` directory. In summary, run the following commands: -~~~ -echo "compiler: ghcjs" > cabal.config -cabal configure -fexample -ftest-client -cabal build +~~~ {.bash} +stack build +make +cd test/spec +stack build ~~~ -The above builds the TODO application and the test client. Next, install [selenium-server-standalone](http://www.seleniumhq.org/download/) (also from -[npm](https://www.npmjs.com/package/selenium-server-standalone-jar)). Then, build the -[hspec-webdriver](https://hackage.haskell.org/package/hspec-webdriver) test suite using GHC (not -GHCJS). I use stack for this, although you can use cabal too if you like. Also, at the moment, the prerelease -of the react-intl library must be installed from npm. +[npm](https://www.npmjs.com/package/selenium-server-standalone-jar)). Also, at the moment, the beta +version of the react-intl library must be installed from npm. ~~~ cd test/client -npm install react-intl@next -cd ../spec -stack build +npm install react-intl@v2.0.0-beta-2 ~~~ Finally, start selenium-server-standalone and execute the test suite. Make sure you also have @@ -67,6 +85,7 @@ started from the `test/spec` directory, otherwise it does not find the correct javascript files. ~~~ +cd test/spec stack exec react-flux-spec ~~~ diff --git a/example/purecss-side-menu/index.html b/example/purecss-side-menu/index.html --- a/example/purecss-side-menu/index.html +++ b/example/purecss-side-menu/index.html @@ -9,8 +9,8 @@
- - + + diff --git a/example/routing/route-example.html b/example/routing/route-example.html --- a/example/routing/route-example.html +++ b/example/routing/route-example.html @@ -8,6 +8,6 @@
- + diff --git a/example/todo/Makefile b/example/todo/Makefile deleted file mode 100644 --- a/example/todo/Makefile +++ /dev/null @@ -1,13 +0,0 @@ -js-build/todo.min.js: js-build/todo.js - closure --compilation_level=ADVANCED_OPTIMIZATIONS js-build/todo.js > js-build/todo.min.js - -js-build/todo.js: ../../dist/build/todo/todo.jsexe/all.js - mkdir -p js-build - echo "(function(global,React,ReactDOM) {" > js-build/todo.js - cat ../../dist/build/todo/todo.jsexe/all.js >> js-build/todo.js - echo "})(window, window['React'], window['ReactDOM']);" >> js-build/todo.js - sed -i 's/goog.provide.*//' js-build/todo.js - sed -i 's/goog.require.*//' js-build/todo.js - -clean: - rm -rf js-build diff --git a/example/todo/todo-dev.html b/example/todo/todo-dev.html --- a/example/todo/todo-dev.html +++ b/example/todo/todo-dev.html @@ -7,8 +7,8 @@
- - - + + + diff --git a/example/todo/todo.html b/example/todo/todo.html --- a/example/todo/todo.html +++ b/example/todo/todo.html @@ -7,8 +7,8 @@
- - - + + + diff --git a/react-flux.cabal b/react-flux.cabal --- a/react-flux.cabal +++ b/react-flux.cabal @@ -1,5 +1,5 @@ name: react-flux -version: 1.0.2 +version: 1.0.3 synopsis: A binding to React based on the Flux application architecture for GHCJS category: Web homepage: https://bitbucket.org/wuzzeb/react-flux @@ -8,15 +8,16 @@ author: John Lenz maintainer: John Lenz build-type: Simple +description: See the README below. cabal-version: >=1.10 extra-source-files: ChangeLog.md, README.md, + Makefile, example/README.md, example/css/*.css, example/css/bg.png, - example/todo/Makefile, example/todo/*.hs, example/todo/*.html, example/todo/run-in-node.js, diff --git a/src/React/Flux/Addons/Intl.hs b/src/React/Flux/Addons/Intl.hs --- a/src/React/Flux/Addons/Intl.hs +++ b/src/React/Flux/Addons/Intl.hs @@ -3,10 +3,10 @@ -- be used for formatting and pluralization even if you intend to present your application in a single -- language and locale. -- --- These bindings are for the 2.0 version of ReactIntl which is currently just a --- pre-release, and due to how react-flux works, it also requires React 0.14. For temporary documentation, +-- These bindings are for the 2.0 version of ReactIntl which is currently in beta (I am currently +-- using v2.0.0-beta-2). For temporary documentation, -- see . Because this is a binding to a --- pre-release, the API below might change! I consider it unlikely, but if a change is required I will +-- beta, the API below might change! I consider it unlikely, but if a change is required I will -- violate the PVP and not increment the major number, just the minor number. -- -- To use these bindings, you need to provide the @ReactIntl@ variable. In the browser you can just diff --git a/test/client/TestClient14.hs b/test/client/TestClient14.hs --- a/test/client/TestClient14.hs +++ b/test/client/TestClient14.hs @@ -19,7 +19,7 @@ intlSpec :: ReactView () intlSpec = defineView "intl" $ \() -> - intlProvider_ "en-US" (Just js_translations) Nothing $ + intlProvider_ "en" (Just js_translations) Nothing $ view intlSpecBody () mempty intlSpecBody :: ReactView () diff --git a/test/client/test-client13.html b/test/client/test-client13.html --- a/test/client/test-client13.html +++ b/test/client/test-client13.html @@ -6,7 +6,7 @@
- - + + diff --git a/test/client/test-client14.html b/test/client/test-client14.html --- a/test/client/test-client14.html +++ b/test/client/test-client14.html @@ -4,10 +4,11 @@
- - + + - - + + + diff --git a/test/spec/Main.hs b/test/spec/Main.hs --- a/test/spec/Main.hs +++ b/test/spec/Main.hs @@ -6,5 +6,5 @@ main :: IO () main = do - _ <- system "cd ../../example/todo && make" + _ <- system "cd ../.. && make" hspec Spec.spec diff --git a/test/spec/TestClientSpec.hs b/test/spec/TestClientSpec.hs --- a/test/spec/TestClientSpec.hs +++ b/test/spec/TestClientSpec.hs @@ -227,7 +227,7 @@ loadLog `shouldReturn` ["Closing alert"] it "switchs nav items" $ runWD $ do - navUl <- findElem $ ByCSS "div#bootstrap nav > ul" + navUl <- findElem $ ByCSS "div#bootstrap ul" i1 <- findElemFrom navUl $ ByCSS "li:first-child a" i2 <- findElemFrom navUl $ ByCSS "li:nth-child(2) a" i3 <- findElemFrom navUl $ ByCSS "li:nth-child(3) a" @@ -286,7 +286,7 @@ openPage $ "file://" ++ dir ++ "/../client/" ++ filename it "displays the intl formatted data" $ runWD $ do - "f-number" `intlSpanShouldBe` "90.0%" + "f-number" `intlSpanShouldBe` "90%" "f-int" `intlSpanShouldBe` "100,000" "f-double" `intlSpanShouldBe` "40,000.2" "f-shortday" `intlSpanShouldBe` "Jul 20, 1969" @@ -300,7 +300,7 @@ let moon = fromGregorian 1969 7 20 daysAgo = diffDays today moon yearsAgo :: Int = round $ realToFrac daysAgo / (365 :: Double) -- is close enough - "f-relative" `intlSpanShouldBe` (show yearsAgo ++ " years ago") + "f-relative" `intlSpanShouldBe` (show (yearsAgo-1) ++ " years ago") "f-relative-days" `intlSpanShouldBe` (showWithComma daysAgo ++ " days ago") it "displays messages" $ runWD $ do diff --git a/test/spec/stack.yaml b/test/spec/stack.yaml --- a/test/spec/stack.yaml +++ b/test/spec/stack.yaml @@ -1,3 +1,3 @@ -resolver: lts-3.11 +resolver: lts-4.1 packages: - '.'