Fixes per @ZmagoD's request

app/javascript/src/components/validation/components/ValidatedErrorHelpBlock.jsx

@@ -26,12 +26,6 @@ class ValidatedErrorHelpBlock extends Component {
     return <span key={key}>{error.message}</span>;
   }
 
-  constructor(props) {
-    super(props);
-
-    this.cleanProps = this.cleanProps.bind(this);
-  }
-
   cleanProps() {
     // Remove additional props from the props
     const { tag, ...cleanProps } = this.props;
@@ -39,9 +33,12 @@ class ValidatedErrorHelpBlock extends Component {
   }
 
   render() {
-    const errors = this.context.errors(this.props.tag) || [];
+    // Remove additional props from the props
+    const { tag, ...cleanProps } = this.props;
+
+    const errors = this.context.errors(tag) || [];
     return (
-      <MyHelpBlock {...this.cleanProps()}>
+      <MyHelpBlock {...cleanProps}>
         {errors.map((error) => ValidatedErrorHelpBlock.renderErrorMessage(error))}
       </MyHelpBlock>
     );

app/javascript/src/components/validation/components/ValidatedFormGroup.jsx

@@ -3,20 +3,11 @@ import { FormGroup } from "react-bootstrap";
 import PropTypes from "prop-types";
 
 class ValidatedFormGroup extends Component {
-  constructor(props) {
+  render() {
-    super(props);
-
-    this.cleanProps = this.cleanProps.bind(this);
-  }
-
-  cleanProps() {
     // Remove additional props from the props
     const { tag, ...cleanProps } = this.props;
-    return cleanProps;
-  }
 
-  render() {
+    const hasError = this.context.hasErrorForTag(tag);
-    const hasError = this.context.hasErrorForTag(this.props.tag);
     const formGroupClass = `form-group ${hasError ? " has-error" : ""}`;
     const validationState = hasError ? "error" : null;
 
@@ -24,7 +15,7 @@ class ValidatedFormGroup extends Component {
       <FormGroup
         className={formGroupClass}
         validationState={validationState}
-        {...this.cleanProps()}
+        {...cleanProps}
       />
     );
   }

app/javascript/src/scenes/SettingsPage/scenes/teams/new/index.jsx

@@ -20,7 +20,6 @@ import {
   SETTINGS_TEAMS_ROUTE,
   SETTINGS_TEAM_ROUTE
 } from "../../../../../config/routes";
-import { TEAMS_NEW_PATH } from "../../../../../config/api_endpoints";
 import { getTeamsList } from "../../../../../components/actions/TeamsActions";
 import {
   ValidatedForm,

features/settings_page/profile.feature

@@ -24,7 +24,7 @@ Scenario: Unsuccessful avatar image upload, file is too big
   Then I click on image within ".avatar-container" element
   And I attach a "Moon.png" file to "user_avatar_input" field
   Then I click "Update" button
-  And I should see "Avatar file size must be less than 0.2 MB" error message under "user_avatar_input" field
+  And I should see "file too large (maximum size is 0.2 MB)" error message under "user_avatar_input" field
 
 @javascript
 Scenario: Unsuccessful avatar image upload, file is invalid
@@ -32,7 +32,7 @@ Scenario: Unsuccessful avatar image upload, file is invalid
   Then I click on image within ".avatar-container" element
   And I attach a "File.txt" file to "user_avatar_input" field
   Then I click "Update" button
-  And I should see "Avatar content type is invalid" error message under "user_avatar_input" field
+  And I should see "invalid file extension" error message under "user_avatar_input" field
 
 @javascript
 Scenario: Successful upload avatar image
@@ -93,7 +93,7 @@ Scenario: Unsuccessful Password Change, passwords does not match
   And I fill in "mypassword5678" in New password field
   And I fill in "mypassword56788" in New password confirmation field
   Then I click "Update" button
-  And I should see "Passwords don't match"
+  And I should see "doesn't match"
 
 @javascript
 Scenario: Unsuccessful Password Change, current password is invalid