{"action":"created","issue":{"url":"https://api.github.com/repos/tastejs/todomvc/issues/1300","labels_url":"https://api.github.com/repos/tastejs/todomvc/issues/1300/labels{/name}","comments_url":"https://api.github.com/repos/tastejs/todomvc/issues/1300/comments","events_url":"https://api.github.com/repos/tastejs/todomvc/issues/1300/events","html_url":"https://github.com/tastejs/todomvc/pull/1300","id":77160760,"number":1300,"title":"TypeScript & React/Flux TodoMVC Example","user":{"login":"bparadie","id":1578115,"avatar_url":"https://avatars.githubusercontent.com/u/1578115?v=3","gravatar_id":"","url":"https://api.github.com/users/bparadie","html_url":"https://github.com/bparadie","followers_url":"https://api.github.com/users/bparadie/followers","following_url":"https://api.github.com/users/bparadie/following{/other_user}","gists_url":"https://api.github.com/users/bparadie/gists{/gist_id}","starred_url":"https://api.github.com/users/bparadie/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bparadie/subscriptions","organizations_url":"https://api.github.com/users/bparadie/orgs","repos_url":"https://api.github.com/users/bparadie/repos","events_url":"https://api.github.com/users/bparadie/events{/privacy}","received_events_url":"https://api.github.com/users/bparadie/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":12,"created_at":"2015-05-16T23:41:15Z","updated_at":"2015-05-17T17:16:38Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/tastejs/todomvc/pulls/1300","html_url":"https://github.com/tastejs/todomvc/pull/1300","diff_url":"https://github.com/tastejs/todomvc/pull/1300.diff","patch_url":"https://github.com/tastejs/todomvc/pull/1300.patch"},"body":"This PR continues the discussion started in https://github.com/tastejs/todomvc/pull/1196 .\r\n\r\nPlease consider adding this example to `todomvc`.\r\n\r\nThis application is a port of the [flux-todomvc](https://github.com/facebook/flux/tree/master/examples/flux-todomvc) example, which is part of Facebook's [Flux](https://github.com/facebook/flux) project.\r\n\r\nThe original example uses [JSX](http://facebook.github.io/react/docs/jsx-in-depth.html), which is a JavaScript syntax extension that looks similar to XML. \r\nTransforming JSX to Javascript is pretty easy as James Brantly explained in his recent React.js Conf 2015 talk [Static typing with Flow and TypeScript](http://conf.reactjs.com/schedule.html#static-typing-with-flow-and-typescript). James Brantly's [reactconf](https://github.com/jbrantly/reactconf) uses [webpack](http://webpack.github.io/) and [ts-jsx-loader](https://github.com/jbrantly/ts-jsx-loader). This project on the other hand uses [gulp](http://gulpjs.com/),  [react-tools](https://www.npmjs.com/package/react-tools) and [gulp-browserify](https://www.npmjs.com/package/gulp-browserify) instead.\r\n\r\nDuring the build phase all `*.ts` are first being copied to a temporary `./build` folder and then compiled to Javascript using the Typescript compiler. A second pass then intelligently replaces `React.jsx(...)` with transformed JSX code in every `*.jsx.ts` file. For more details see `./gulpfile.js`.\r\nThe build mechanics are all implemented in `./gulpfile.js`. The output folder is `./web`.\r\n\r\nThis project also supports minification using Google's Closure Compiler.\r\n\r\nHere is a live demo:\r\nhttp://bparadie.github.io/fluxts-todomvc\r\n\r\n#### Known issues\r\n\r\n- `jshint` on `web/js/bundle.js` and `web/js/bundle.min.js` currently fail, because those files are generated from Typescript source files. For that reason I've added a `tshint` pass.\r\n- running the tests against `typescript-reactflux` currently reports 5 failed tests (25 tests pass). Routing is currently not supported and documented in `knownIssues.js`.\r\n\r\nRunning `mocha allTests.js --no-timeouts --reporter spec --framework=typescript-reactflux` currently produces this output:\r\n\r\n```\r\n  TodoMVC - typescript-reactflux\r\n    When page is initially opened\r\n      ✓ should focus on the todo input field\r\n    No Todos\r\n      ✓ should hide #main and #footer (49ms)\r\n    New Todo\r\n      ✓ should allow me to add todo items (419ms)\r\n      ✓ should clear text input field when an item is added (221ms)\r\n      ✓ should append new items to the bottom of the list (506ms)\r\n      ✓ should trim text input (228ms)\r\n      ✓ should show #main and #footer when items added (223ms)\r\n    Mark all as completed\r\n      ✓ should allow me to mark all items as completed (509ms)\r\n      ✓ should allow me to clear the completion state of all items (551ms)\r\n      ✓ complete all checkbox should update state when items are completed / cleared (561ms)\r\n    Item\r\n      ✓ should allow me to mark items as complete (418ms)\r\n      ✓ should allow me to un-mark items as complete (443ms)\r\n      ✓ should allow me to edit an item (728ms)\r\n      ✓ should show the remove button on hover\r\n    Editing\r\n      ✓ should hide other controls when editing (452ms)\r\n      ✓ should save edits on enter (727ms)\r\n      ✓ should save edits on blur (799ms)\r\n      ✓ should trim entered text (735ms)\r\n      ✓ should remove the item if an empty text string was entered (677ms)\r\n      ✓ should cancel edits on escape (691ms)\r\n    Counter\r\n      ✓ should display the current number of todo items (340ms)\r\n    Clear completed button\r\n      ✓ should display the correct text (443ms)\r\n      ✓ should remove completed items when clicked (531ms)\r\n      ✓ should be hidden when there are no items that are completed (500ms)\r\n    Persistence\r\n      ✓ should persist its data (721ms)\r\n    Routing\r\n      1) should allow me to display active items\r\n      2) should respect the back button\r\n      3) should allow me to display completed items\r\n      4) should allow me to display all items\r\n      5) should highlight the currently applied filter\r\n\r\n\r\n  25 passing (1m)\r\n  5 failing\r\n\r\n```\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/tastejs/todomvc/issues/comments/102824212","html_url":"https://github.com/tastejs/todomvc/pull/1300#issuecomment-102824212","issue_url":"https://api.github.com/repos/tastejs/todomvc/issues/1300","id":102824212,"user":{"login":"arthurvr","id":6025224,"avatar_url":"https://avatars.githubusercontent.com/u/6025224?v=3","gravatar_id":"","url":"https://api.github.com/users/arthurvr","html_url":"https://github.com/arthurvr","followers_url":"https://api.github.com/users/arthurvr/followers","following_url":"https://api.github.com/users/arthurvr/following{/other_user}","gists_url":"https://api.github.com/users/arthurvr/gists{/gist_id}","starred_url":"https://api.github.com/users/arthurvr/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/arthurvr/subscriptions","organizations_url":"https://api.github.com/users/arthurvr/orgs","repos_url":"https://api.github.com/users/arthurvr/repos","events_url":"https://api.github.com/users/arthurvr/events{/privacy}","received_events_url":"https://api.github.com/users/arthurvr/received_events","type":"User","site_admin":false},"created_at":"2015-05-17T17:16:38Z","updated_at":"2015-05-17T17:16:38Z","body":"> I've reduced the whole build chain into one gulpfile.js. I thought, that's acceptable. \r\nMy build chain is just a bit more complicated. You can't squeeze it into an npm script.\r\n\r\nIt's mainly complicated because most of it is unnecessary. We only require the things necessary to run the app, no minification, for example."}}