tyop and missing test case

auth0 · May 28, 2018 · ce1c8ad · ce1c8ad
1 parent ce1f581
commit ce1c8ad
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 11 deletions.
diff --git a/src/__tests__/field/__snapshots__/password_pane.test.jsx.snap b/src/__tests__/field/__snapshots__/password_pane.test.jsx.snap
@@ -34,7 +34,7 @@ exports[`PasswordPane disables input when submitting 1`] = `
     data-placeholder="placeholder"
     data-policy="policy"
     data-showPassword="showPassword"
-    data-showPasswordStrenghtMessage={false}
+    data-showPasswordStrengthMessage={false}
     data-strengthMessages={Object {}}
     data-value="password"
   />
@@ -54,7 +54,7 @@ exports[`PasswordPane renders correctly 1`] = `
     data-placeholder="placeholder"
     data-policy="policy"
     data-showPassword="showPassword"
-    data-showPasswordStrenghtMessage={false}
+    data-showPasswordStrengthMessage={false}
     data-strengthMessages={Object {}}
     data-value="password"
   />
@@ -74,7 +74,7 @@ exports[`PasswordPane renders correctly when \`allowShowPassword\` is true 1`] =
     data-placeholder="placeholder"
     data-policy="policy"
     data-showPassword="showPassword"
-    data-showPasswordStrenghtMessage={false}
+    data-showPasswordStrengthMessage={false}
     data-strengthMessages={Object {}}
     data-value="password"
   />
@@ -107,14 +107,14 @@ exports[`PasswordPane sets isValid as true when \`isFieldVisiblyInvalid\` is fal
     data-placeholder="placeholder"
     data-policy="policy"
     data-showPassword="showPassword"
-    data-showPasswordStrenghtMessage={false}
+    data-showPasswordStrengthMessage={false}
     data-strengthMessages={Object {}}
     data-value="password"
   />
 </div>
 `;
 
-exports[`PasswordPane sets showPasswordStrenghtMessage as true when \`isFieldValid\` is false 1`] = `
+exports[`PasswordPane sets showPasswordStrengthMessage as false when \`isFieldValid\` is true 1`] = `
 <div
   className="auth0-lock-input-block auth0-lock-input-show-password"
 >
@@ -127,7 +127,27 @@ exports[`PasswordPane sets showPasswordStrenghtMessage as true when \`isFieldVal
     data-placeholder="placeholder"
     data-policy="policy"
     data-showPassword="showPassword"
-    data-showPasswordStrenghtMessage={true}
+    data-showPasswordStrengthMessage={false}
+    data-strengthMessages={Object {}}
+    data-value="password"
+  />
+</div>
+`;
+
+exports[`PasswordPane sets showPasswordStrengthMessage as true when \`isFieldValid\` is false 1`] = `
+<div
+  className="auth0-lock-input-block auth0-lock-input-show-password"
+>
+  <div
+    data-__type="password_input"
+    data-disabled={false}
+    data-invalidHint="blankErrorHint"
+    data-isValid={false}
+    data-onChange={[Function]}
+    data-placeholder="placeholder"
+    data-policy="policy"
+    data-showPassword="showPassword"
+    data-showPasswordStrengthMessage={true}
     data-strengthMessages={Object {}}
     data-value="password"
   />

diff --git a/src/__tests__/field/password_pane.test.jsx b/src/__tests__/field/password_pane.test.jsx
@@ -61,12 +61,18 @@ describe('PasswordPane', () => {
 
     expectComponent(<PasswordPane {...defaultProps} />).toMatchSnapshot();
   });
-  it('sets showPasswordStrenghtMessage as true when `isFieldValid` is false', () => {
+  it('sets showPasswordStrengthMessage as true when `isFieldValid` is false', () => {
     require('field/index').isFieldValid = () => false;
     let PasswordPane = getComponent();
 
     expectComponent(<PasswordPane {...defaultProps} />).toMatchSnapshot();
   });
+  it('sets showPasswordStrengthMessage as false when `isFieldValid` is true', () => {
+    require('field/index').isFieldValid = () => true;
+    let PasswordPane = getComponent();
+
+    expectComponent(<PasswordPane {...defaultProps} />).toMatchSnapshot();
+  });
   it('sets isValid as true when `isFieldVisiblyInvalid` is false', () => {
     require('field/index').isFieldVisiblyInvalid = () => false;
     let PasswordPane = getComponent();

diff --git a/src/field/password/password_pane.jsx b/src/field/password/password_pane.jsx
@@ -23,7 +23,7 @@ export default class PasswordPane extends React.Component {
         <PasswordInput
           value={c.getFieldValue(lock, 'password')}
           invalidHint={i18n.str('blankErrorHint')}
-          showPasswordStrenghtMessage={!c.isFieldValid(lock, 'password')}
+          showPasswordStrengthMessage={!c.isFieldValid(lock, 'password')}
           isValid={!c.isFieldVisiblyInvalid(lock, 'password')}
           onChange={this.handleChange}
           placeholder={placeholder}

diff --git a/src/ui/input/password_input.jsx b/src/ui/input/password_input.jsx
@@ -9,7 +9,7 @@ export const icon =
 export default class PasswordInput extends React.Component {
   static propTypes = {
     invalidHint: PropTypes.string.isRequired,
-    showPasswordStrenghtMessage: PropTypes.bool.isRequired,
+    showPasswordStrengthMessage: PropTypes.bool.isRequired,
     isValid: PropTypes.bool.isRequired,
     onChange: PropTypes.func.isRequired,
     placeholder: PropTypes.string,
@@ -35,7 +35,7 @@ export default class PasswordInput extends React.Component {
   render() {
     const {
       invalidHint,
-      showPasswordStrenghtMessage,
+      showPasswordStrengthMessage,
       isValid,
       onChange,
       policy,
@@ -48,7 +48,7 @@ export default class PasswordInput extends React.Component {
     const { focused, changing } = this.state;
 
     const passwordStrength =
-      policy && focused && changing && showPasswordStrenghtMessage ? (
+      policy && focused && changing && showPasswordStrengthMessage ? (
         <PasswordStrength messages={strengthMessages} password={value} policy={policy} />
       ) : null;