Commit a5eb1f80 authored by Arthur Verschaeve's avatar Arthur Verschaeve

Merge pull request #1503 from ericcarraway/proofreading01

docs: Adjust minor grammar and punctuation issues
parents 7f2a830a ef4021d1
# Application Specification # Application Specification
We have created this short spec to help you create awesome and consistent todo apps. Make sure to not only read it, but also understand. We have created this short spec to help you create awesome and consistent todo apps. Make sure to not only read it but to understand it as well.
## Template Application ## Template Application
Our [template](https://github.com/tastejs/todomvc-app-template/) should be used as the base when implementing a todo app. Before implementing, we recommend you interact with some of the other apps to see how they're built and how they behave. Check out the [Backbone app](http://todomvc.com/examples/backbone) if you need a reference implementation. If something is unclear or could be improved, [let us know](https://github.com/tastejs/todomvc/issues). Our [template](https://github.com/tastejs/todomvc-app-template/) should be used as the base when implementing a todo app. Before implementing, we recommend that you interact with some of the other apps to see how they're built and how they behave. Check out the [Backbone app](http://todomvc.com/examples/backbone) if you need a reference implementation. If something is unclear or could be improved, [let us know](https://github.com/tastejs/todomvc/issues).
## Structure ## Structure
...@@ -25,7 +25,7 @@ js/ ...@@ -25,7 +25,7 @@ js/
readme.md readme.md
``` ```
Try to follow this structure as close a possible while still keeping to the framework’s best practices. Try to follow this structure as close as possible while still keeping to the framework’s best practices.
Components should be split up into separate files and placed into folders where it makes the most sense. Components should be split up into separate files and placed into folders where it makes the most sense.
...@@ -40,11 +40,11 @@ js/ ...@@ -40,11 +40,11 @@ js/
└── todo.js └── todo.js
``` ```
Keep in mind that framework’s best practices on how to structure your app come first. Keep in mind that the framework’s best practices on how to structure your app come first.
### README ### README
All examples must include a README describing the framework, the general implementation and the build process if required. There is an [example readme](https://github.com/tastejs/todomvc-app-template/blob/master/app-readme.md) included in the [template](https://github.com/tastejs/todomvc-app-template). All examples must include a README describing the framework, the general implementation, and the build process if required. There is an [example readme](https://github.com/tastejs/todomvc-app-template/blob/master/app-readme.md) included in the [template](https://github.com/tastejs/todomvc-app-template).
### Dependency Management ### Dependency Management
...@@ -61,11 +61,11 @@ Unless it conflicts with the project's best practices, your example should use [ ...@@ -61,11 +61,11 @@ Unless it conflicts with the project's best practices, your example should use [
} }
``` ```
You should `.gitignore` everything in `node_modules` except the files actually used by your example. That means documentation, READMEs and tests should not be included in the pull request. You should `.gitignore` everything in `node_modules` except the files actually used by your example. That means that documentation, READMEs and tests should not be included in the pull request.
### Code ### Code
Please try to keep the HTML as close to the template as possible. Remove the comments from the HTML when done. The `base.css` file should be referenced from the assets folder and not be touched. If you need to change some styles, use the `app.css` file, but try to keep it to a minimum. Remember to update the relative paths when using the template. Please try to keep the HTML as close to the template as possible. Remove the comments from the HTML when you are finished. The `base.css` file should be referenced from the assets folder and should not be touched. If you need to change some styles, use the `app.css` file, but try to keep changes to a minimum. Remember to update the relative paths when using the template.
Make sure to follow these: Make sure to follow these:
...@@ -85,7 +85,7 @@ When there are no todos, `#main` and `#footer` should be hidden. ...@@ -85,7 +85,7 @@ When there are no todos, `#main` and `#footer` should be hidden.
### New todo ### New todo
New todos are entered in the input at the top of the app. The input element should be focused when the page is loaded preferably using the `autofocus` input attribute. Pressing Enter creates the todo, appends it to the todo list and clears the input. Make sure to `.trim()` the input and then check that it's not empty before creating a new todo. New todos are entered in the input at the top of the app. The input element should be focused when the page is loaded, preferably by using the `autofocus` input attribute. Pressing Enter creates the todo, appends it to the todo list, and clears the input. Make sure to `.trim()` the input and then check that it's not empty before creating a new todo.
### Mark all as complete ### Mark all as complete
...@@ -115,8 +115,8 @@ Removes completed todos when clicked. Should be hidden when there are no complet ...@@ -115,8 +115,8 @@ Removes completed todos when clicked. Should be hidden when there are no complet
### Persistence ### Persistence
Your app should dynamically persist the todos to localStorage. If the framework has capabilities for persisting data (e.g. Backbone.sync), use that, otherwise vanilla localStorage. If possible, use the keys `id`, `title`, `completed` for each item. Make sure to use this format for the localStorage name: `todos-[framework]`. Editing mode should not be persisted. Your app should dynamically persist the todos to localStorage. If the framework has capabilities for persisting data (e.g. Backbone.sync), use that. Otherwise, use vanilla localStorage. If possible, use the keys `id`, `title`, `completed` for each item. Make sure to use this format for the localStorage name: `todos-[framework]`. Editing mode should not be persisted.
### Routing ### Routing
Routing is required for all frameworks. Use the built-in capabilities if supported, otherwise use the [Flatiron Director](https://github.com/flatiron/director) routing library located in the `/assets` folder. The following routes should be implemented: `#/` (all - default), `#/active` and `#/completed` (`#!/` is also allowed). When the route changes the todo list should be filtered on a model level and the `selected` class on the filter links should be toggled. When an item is updated while in a filtered state, it should be updated accordingly. E.g. if the filter is `Active` and the item is checked, it should be hidden. Make sure the active filter is persisted on reload. Routing is required for all implementations. If supported by the framework, use its built-in capabilities. Otherwise, use the [Flatiron Director](https://github.com/flatiron/director) routing library located in the `/assets` folder. The following routes should be implemented: `#/` (all - default), `#/active` and `#/completed` (`#!/` is also allowed). When the route changes, the todo list should be filtered on a model level and the `selected` class on the filter links should be toggled. When an item is updated while in a filtered state, it should be updated accordingly. E.g. if the filter is `Active` and the item is checked, it should be hidden. Make sure the active filter is persisted on reload.
...@@ -45,7 +45,7 @@ Read [idiomatic.js](https://github.com/rwldrn/idiomatic.js) for general JavaScri ...@@ -45,7 +45,7 @@ Read [idiomatic.js](https://github.com/rwldrn/idiomatic.js) for general JavaScri
## Anonymous Functions ## Anonymous Functions
When using anonymous functions, leave a space between the function name and opening parenthesis. When using anonymous functions, leave a space between the function name and the opening parenthesis.
Example: Example:
...@@ -113,7 +113,7 @@ define('Block', [ ...@@ -113,7 +113,7 @@ define('Block', [
When you submit your pull request, one of the first things we will do is run JSHint against your code. When you submit your pull request, one of the first things we will do is run JSHint against your code.
You can help speed the process by running it yourself: You can help speed up the process by running it yourself:
``` ```
jshint path/to/your/app/js jshint path/to/your/app/js
......
...@@ -7,7 +7,7 @@ Note: Before starting work on an app intended for submission, please open an iss ...@@ -7,7 +7,7 @@ Note: Before starting work on an app intended for submission, please open an iss
## Considerations before submitting a new app ## Considerations before submitting a new app
TodoMVC is a curation, not a collection. We want make it easier for people to TodoMVC is a curation, not a collection. We want to make it easier for people to
find a base for their web applications, not harder. This is why we can't accept find a base for their web applications, not harder. This is why we can't accept
every submission. However, we're always open to looking at novel ways to solve every submission. However, we're always open to looking at novel ways to solve
existing problems. existing problems.
...@@ -54,7 +54,7 @@ Modern browser (latest: Chrome, Firefox, Opera, Safari, IE9) ...@@ -54,7 +54,7 @@ Modern browser (latest: Chrome, Firefox, Opera, Safari, IE9)
## Unit Tests ## Unit Tests
At present, due to the large number of apps in the TodoMVC suite we haven't been mandating that unit tests be written in order for an application to be accepted. At present, due to a large number of apps in the TodoMVC suite we haven't been mandating that unit tests be written in order for an application to be accepted.
We do, however, plan on addressing this in a future release as we feel it would both help further ensure consistency and provide developers with a reference for writing tests for each framework. We do, however, plan on addressing this in a future release as we feel it would both help further ensure consistency and provide developers with a reference for writing tests for each framework.
......
...@@ -46,7 +46,7 @@ Colin is a software consultant at Scott Logic who is passionate about all softwa ...@@ -46,7 +46,7 @@ Colin is a software consultant at Scott Logic who is passionate about all softwa
#### [Sam Saccone](https://github.com/samccone) - Developer #### [Sam Saccone](https://github.com/samccone) - Developer
<img align="left" width="40" height="40" src="http://en.gravatar.com/userimage/602125/f2f1d93164ec62b527f0398c65b2d1f3.jpg?size=40"> <img align="left" width="40" height="40" src="http://en.gravatar.com/userimage/602125/f2f1d93164ec62b527f0398c65b2d1f3.jpg?size=40">
Sam is a Software Engineer at Google who is driven by an endless desire to create, solve problems, and improve developers lives. Sam is a Software Engineer at Google who is driven by an endless desire to create, solve problems, and improve developers' lives.
#### [Arthur Verschaeve](https://github.com/arthurvr) - Developer #### [Arthur Verschaeve](https://github.com/arthurvr) - Developer
......
...@@ -14,7 +14,7 @@ The TodoMVC project has a great many implementations of exactly the same app usi ...@@ -14,7 +14,7 @@ The TodoMVC project has a great many implementations of exactly the same app usi
## Running the tests ## Running the tests
These tests use Selenium 2 (WebDriver), via the JavaScript API (WebdriverJS). In order to run the tests you will need to install the dependencies. npm must be version 2.0.0 or greater, so upgrade it first with `npm install -g npm` if `npm --version` outputs anything less than 2.0.0. Run the following command from within the `tests` folder: These tests use Selenium 2 (WebDriver), via the JavaScript API (WebdriverJS). In order to run the tests, you will need to install the dependencies. npm must be version 2.0.0 or greater, so upgrade it first with `npm install -g npm` if `npm --version` outputs anything less than 2.0.0. Run the following command from within the `tests` folder:
```sh ```sh
$ npm install $ npm install
...@@ -165,12 +165,12 @@ In order to keep each test case fully isolated, the browser is closed then re-op ...@@ -165,12 +165,12 @@ In order to keep each test case fully isolated, the browser is closed then re-op
$ npm run test -- --speedMode $ npm run test -- --speedMode
``` ```
Before each test all the todo items are checked as completed and the 'clear complete' button pressed. This make the tests run in around half the time, but with the obvious risk that the tear-down code may fail. Before each test, all the todo items are checked as completed and the 'clear complete' button pressed. This makes the tests run in around half the time, but with the obvious risk that the tear-down code may fail.
## Lax mode ## Lax mode
There are certain implementations (e.g. GWT and Dojo) where the constraints of the framework mean that it is not possible to match exactly the HTML specification for TodoMVC. In these cases the tests can be run in a 'lax' mode where the XPath queries used to locate DOM elements are more general. For example, rather than looking for a checkbox `input` element with a class of `toggle`, in lax mode it simply looks for any `input` elements of type `checkbox`. To run the tests in lax mode, simply use the `--laxMode` argument: There are certain implementations (e.g. GWT and Dojo) where the constraints of the framework mean that it is not possible to match exactly the HTML specification for TodoMVC. In these cases, the tests can be run in a 'lax' mode where the XPath queries used to locate DOM elements are more general. For example, rather than looking for a checkbox `input` element with a class of `toggle`, in lax mode it simply looks for any `input` elements of type `checkbox`. To run the tests in lax mode, simply use the `--laxMode` argument:
```sh ```sh
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment