Ember-CLI wrapper for password-strength checking via https://github.com/dropbox/zxcvbn
npm install ember-cli-password-strength
This addon is an Ember-CLI wrapper for zxcvbn, a "realistic password strength estimator".
In addition to bringing that package into your project, Ember-CLI-Password-Strength exposes a password-strength shim
as an ES6 module you can import anywhere in your application, rather than using the Bower package's global variable.
Check out the Demo!
ember install ember-cli-password-strength
Zxcvbn is a large library (400kB gzipped). You can load it asynchronously
by configuring your ember-cli-build.js. This is the recommended configuration, but is not the default
so as to maintain backwards compatibility:
``javascript`
let app = new EmberAddon(defaults, {
'ember-cli-password-strength': {
bundleZxcvbn: false
}
});
`javascript
//components/foo.js
import Component from '@ember/component';
import { computed } from '@ember/object';
import { inject } from '@ember/service';
export default Component.extend({
passwordStrength: inject(),
password: '',
/**
* passwordStrength.strength returns a promise which
* will resolve after the zxcvbn library has been loaded.
*
*/
strength: computed('password', function () {
const passwordStrength = this.get('passwordStrength');
passwordStrength.strength(this.get('password')).then(obj => {
console.log(obj);
});
}),
/**
* strengthSync expects zxcvbn to be loaded already
*/
strengthSync: computed('password', function () {
const passwordStrength = this.get('passwordStrength');
const obj = passwordStrength.strength(this.get('password');
console.log(obj);
}),
/**
* If you are using the result in a template then strengthProxy saves
* a step in wrapping the returned promise in an Ember.ObjectProxy
*/
strengthProxy: computed('password', function () {
const passwordStrength = this.get('passwordStrength');
const obj = passwordStrength.strength(this.get('password');
console.log(obj);
})
});
`
`javascript
//routes/foo.js
import Route from '@ember/routing/route';
import { inject } from '@ember/service';
export default Route.extend({
passwordStrength: inject(),
beforeModel() {
const passwordStrength = this.get('passwordStrength');
return passwordStrength.load();
}
});
`
Simply import the password-strength shim into your project:
`javascript
//components/foo.js
import Ember from 'ember';
import strength from 'password-strength';
const { Component, computed } = Ember;
export default Component.extend({
password: '',
strength: computed('password', function () {
return strength(this.get('password'));
})
});
`
Full documentation for the strength checking method can be found here.
This README outlines the details of collaborating on this Ember addon.
* git clone git@github.com:elwayman02/ember-cli-password-strength.git
*
*
* ember serve
* Visit your app at http://localhost:4200.
* npm test (Runs ember try:each to test your addon against multiple Ember versions)ember test
*
*
* ember build`
For more information on using ember-cli, visit https://ember-cli.com/.