Skip to content

Commit

Permalink
Merge branch 'GPII-1336'
Browse files Browse the repository at this point in the history
* GPII-1336: (197 commits)
  GPII-1336:  Removed non-useful chromedriver package in favor of clearer install instructions.
  GPII-1336:  Added chromedriver installation caveats.
  GPII-1336: Refactored and hardened test environment for browser tests.
  GPII-1336: Restored `chromedriver` as a dev dependency.
  GPII-1336:  Fixed broken “test” script definition.
  GPII-1336:  Updated dependencies and documentation to reflect the new requirements, and to document the test problems with npm 3.10.10
  NOJIRA:  Updated gpii-express to released version.  Updated outdated dependencies based on output of `yarn outdated`.
  NOJIRA:  Updated to 3.0.0 dev release of infusion. Updated all outdated dependencies based on output of `yarn outdated`.
  GPII-2250: Fixed form submission when changing a text field and then pressing enter.
  KETTLE-51:  Upgrading kettle to pick up utf8 fixes.
  GPII-2179: Pin to a published version of infusion that includes the post-2.0.0 binder transform functions and deletion relay fix.
  NOJIRA:  Fixed bad formatting in docs based on review of GitHub output.
  NOJIRA:  Manually installed yarn in Travis config.
  NOJIRA:  Migrated Travis configuration to use `yarn` and Node 6.
  NOJIRA:  Added `chromedriver` to dev dependencies and simplified QI steps.
  NOJIRA:  Fixed chromedriver path in QI config.
  NOJIRA:  Simplified QI config per feedback from the team.
  NOJIRA: Updated QI config to ensure chromedriver is installed.
  NOJIRA:  Limited QI tests to Chrome for now.
  GPII-1815: Updated to standard common Vagrantfile and migrated `.qi.yml`.
  ...
  • Loading branch information
amb26 committed Feb 8, 2017
2 parents 299c1f9 + 71db4cf commit 3d8bc6b
Show file tree
Hide file tree
Showing 72 changed files with 7,873 additions and 1 deletion.
3 changes: 3 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"extends": "eslint-config-fluid"
}
31 changes: 31 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
# Logs
logs
*.log

# Runtime data
pids
*.pid
*.seed

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directory
# Commenting this out is preferred by some people, see
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git-
node_modules

# Users Environment Variables
.lock-wscript
bower_components
reports
.vagrant
8 changes: 8 additions & 0 deletions .istanbul.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
reporting:
print: none
dir: ./reports
reports:
- lcov
- cobertura
report-config:
cobertura: {file: report.cov }
19 changes: 19 additions & 0 deletions .qi.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
# A configuration file for our Quality Infrastructure builds: https://wiki.gpii.net/w/Quality_Infrastructure
email: [email protected]
env_runtime: linux-desktop

apps:
- app_name: gpii-json-schema
git_repository: https://github.com/the-t-in-rtf/gpii-json-schema.git
git_branch: GPII-1336
software_stack: nodejs
software_stack_version: lts
folder:
dest: /app/gpii-json-schema
run_in: fedora
deploy: false
setup:
- sudo yum install -y chromedriver
- yarn install
test_cmds:
- BROWSERS=chrome yarn test
13 changes: 13 additions & 0 deletions .travis.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
language: node_js
node_js: "6.9.1"
addons:
apt:
packages:
- xvfb
install:
- export DISPLAY=':99.0'
- Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
- npm install -g yarn
- yarn install
script:
- BROWSERS=firefox yarn test
19 changes: 19 additions & 0 deletions Gruntfile.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
/* eslint-env node */
"use strict";

module.exports = function (grunt) {
grunt.initConfig({
eslint: {
src: ["./src/**/*.js", "./tests/**/*.js", "./*.js"]
},
jsonlint: {
src: ["src/**/*.json", "tests/**/*.json", "./*.json"]
}
});

grunt.loadNpmTasks("fluid-grunt-eslint");
grunt.loadNpmTasks("grunt-jsonlint");

grunt.registerTask("lint", "Apply jshint and jsonlint", ["eslint", "jsonlint"]);
};

27 changes: 27 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
Copyright (c) 2015, Raising the Floor International
All rights reserved.

Redistribution and use in source and binary forms, with or without modification,
are permitted provided that the following conditions are met:

* Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.

* Redistributions in binary form must reproduce the above copyright notice, this
list of conditions and the following disclaimer in the documentation and/or
other materials provided with the distribution.

* Neither the name of the {organization} nor the names of its
contributors may be used to endorse or promote products derived from
this software without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
50 changes: 49 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1 +1,49 @@
# gpii-json-schema
# What is this?

[JSON Schemas](http://json-schema.org) are JSON documents that describe how a JSON object should be structured. The
JSON Schema standard includes rules about what fields are required, what type and format of data is allowed in a field,
and many other complex rules that allow you to do things like limit the length of a text field, or require between one
and three entries in an array.

This package provides a series of [Fluid components](https://github.com/fluid-project/infusion-docs/blob/master/src/documents/UnderstandingInfusionComponents.md)
to help add the power of [JSON Schemas](http://json-schema.org) to your project.

This package is intended to help with three key use cases:

1. Validating arbitrary JSON data and reporting problems to the end user. See the [validator documentation](./docs/validator.md) and [parser documentation](./docs/parser.md) for more details.
2. Rejecting invalid data sent to a REST endpoint (presumably via a POST or PUT request). See the [middleware documentation](./docs/middleware) for more details.
3. Adding appropriate headers to JSON responses so that it is clear what JSON Schema they adhere to. See the [handler documentation](./docs/handler.md) for more details.

# Running the tests

Before you can successfully run the tests, you will need to have the following installed:

# `node` (4.x or 6.x)
# `npm` or [`yarn`](http://yarnpkg.com/)
# [`chromedriver`](https://sites.google.com/a/chromium.org/chromedriver/)

*Note:* You cannot use the [https://www.npmjs.com/package/chromedriver](https://www.npmjs.com/package/chromedriver) npm
package to install chromedriver globally, as this will not be detected on Windows until
[this bug](https://github.com/giggio/node-chromedriver/issues/90) is resolved.

Once you have these installed, you can run the tests using commands like:

1. `yarn install`
2. `yarn test`

Or, if you're using `npm`, you can use commands like:

1. `npm install`
2. `npm test`

NOTE: When using `npm` version 3.10.10, the `test` script does not work properly. You can still run the tests with
that version of `npm` using commands like:

1. `npm install`
2. `node tests/all-tests.js`

# Using these components in a browser

This package depends on AJV. AJV can be used on the client-side, but must first be bundled using `browserify`. The
AJV package takes care of this automatically when it's installed, the required client-side bundle can be found in
`./node_modules/ajv/dist/ajv.bundle.js` once you've installed this package's dependencies.
16 changes: 16 additions & 0 deletions Vagrantfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# -*- mode: ruby -*-
# vi: set ft=ruby :

# This file loads a generic Vagrantfile that will build the environment
# specified in the .qi.yml file.
#
# DO NOT MODIFY THIS FILE
#
# if you want to change the VMs specifications go to README.md

VAGRANT_VMENV_PATH = `node -e "require('vagrant-vmenv')"`.delete!("\n")
puts "\nCan not find the vagrant-vmenv module, please install it:\n" +
"npm install -g https://github.com/amatas/vagrant-vmenv.git" if $?.to_i != 0

require_relative( VAGRANT_VMENV_PATH + '/Vagrantfile.rb')

91 changes: 91 additions & 0 deletions docs/errorBinder.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
# `gpii.schemas.client.errorBinder`

The `gpii-json-schema` package provides both [server and client-side validation](validator.md). The `errorBinder`
component provides a consistent means of associating errors returned by the validator with onscreen elements.

This component does not expose any invokers. Instead, it listens for changes to the `fieldErrors` model variable and
updates the display if needed.

## How do "bindings" work?

The `errorBinder` uses model->view bindings like those used with [`gpii-binder`](https://github.com/GPII/gpii-binder) to
associate validation errors reported by the validator with onscreen elements. That "binding" structure looks something
like:

```
bindings: {
"key": {
selector: "selector1",
path: "path1"
},
"selector2": "path2"
}
```

The map of bindings used by the base component are stored under `options.errorBindings`. By default, the component
tries to pick up the existing value from `options.bindings`, so that you can easily reuse existing bindings from
grades like 'templateFormControl`.

## Requirements

The `errorBinder` component requires both `gpii-binder` and `gpii-handlebars`.

## Component options


| Option | Type | Description |
| ------------------ | -------- | ----------- |
| `selectors.fieldError` | `Selector` | The selector representing the view that will display our error summary. |
| `templates.inlineError` | `String` | The filename/id of the template that will be used to produce the inline error output. |


# `gpii.schemas.client.errorAwareForm`

This is an extended version of the `templateFormControl` grade provided by the `gpii-handlebars` package.
It passes on validation errors returned by the server to an instance of the `errorBinder`, which displays
the errors next to each field. It also displays a summary of all errors.

## Component options

Here are the unique options you will likely want to customize when using the `errorAwareForm` component.

| Option | Type | Description |
| ------------------ | -------- | ----------- |
| `templates.error` | `String` | The filename/id of the template that will be used to produce the error summary. |
| `rules` | `Object` | The [model transformation rules](https://wiki.fluidproject.org/display/docs/fluid.model.transformWithRules) that control what information is passed to the server on form submit, and how the response is handled. See the `ajaxCapable` documentation in the `gpii-handlebars` package for details. |


See the `templateFormControl`documentation in the [`gpii-handlebars`](https://github.com/GPII/gpii-handlebars) package
for more details about supported options.


# `gpii.schemas.client.errorAwareForm.clientSideValidation`

This is an extended version of the `errorAwareForm` grade that adds client-side validation. It validates the model
content before submitting and prevents form submission if there are any errors.

## Component options

| Option | Type | Description |
| ------------------ | -------- | ----------- |
| `rules.modelToRequestPayload` | `Object` | The [model transformation rules](https://wiki.fluidproject.org/display/docs/fluid.model.transformWithRules) that control what information is submitted by the form are also used in validating the form data. |

## Invokers

### `{gpii.schemas.client.errorAwareForm.clientSideValidation}.submitForm(event)`
* `event {Object}`: The [jQuery event object](http://api.jquery.com/Types/#Event) passed to us by the DOM elements we're bound to.
* Returns: Nothing.

A gatekeeper function that only allows the form to be submitted if client-side validation succeeds. For details on
binding this to your own elements, see the `templateFormControl` documentation in the `gpii-handlebars` package.

### `{gpii.schemas.client.errorAwareForm.clientSideValidation}.validateContent()`
* Returns: Nothing.

Validate client-side model content and display any errors. It expects to validate the same transformed model data the
form transmits (see the `rules.modelToRequestPayload` option above).

# `gpii.schemas.client.errorAwareForm.clientSideValidation.realTime`

This is an extended version of the `clientSideValidation` grade that listens for all model changes, revalidates the
model and updates the onscreen error messages in real time.
Loading

0 comments on commit 3d8bc6b

Please sign in to comment.