From 16783a1df5226a00f8e3ffa7e9e3e46292d5ef4f Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
Date: Wed, 14 Oct 2015 12:34:32 +0100
Subject: [PATCH] Fix gh-validation-settings-container throwing error on tag
 settings page

no issue
- check that component's `hasValidated` property exists
- add tests for `gh-validation-settings-container`
---
 .../gh-validation-status-container.js         |  7 +-
 .../gh-validation-status-container-test.js    | 72 +++++++++++++++++++
 2 files changed, 77 insertions(+), 2 deletions(-)
 create mode 100644 ghost/admin/tests/integration/components/gh-validation-status-container-test.js

diff --git a/ghost/admin/app/components/gh-validation-status-container.js b/ghost/admin/app/components/gh-validation-status-container.js
index f54a1c50e1..61c0c37215 100644
--- a/ghost/admin/app/components/gh-validation-status-container.js
+++ b/ghost/admin/app/components/gh-validation-status-container.js
@@ -11,8 +11,11 @@ import ValidationStateMixin from 'ghost/mixins/validation-state';
 export default Ember.Component.extend(ValidationStateMixin, {
     classNameBindings: ['errorClass'],
 
-    errorClass: Ember.computed('hasError', 'hasValidated.[]', function () {
-        if (this.hasValidated.contains(this.get('property'))) {
+    errorClass: Ember.computed('property', 'hasError', 'hasValidated.[]', function () {
+        let hasValidated = this.get('hasValidated'),
+            property = this.get('property');
+
+        if (hasValidated && hasValidated.contains(property)) {
             return this.get('hasError') ? 'error' : 'success';
         } else {
             return '';
diff --git a/ghost/admin/tests/integration/components/gh-validation-status-container-test.js b/ghost/admin/tests/integration/components/gh-validation-status-container-test.js
new file mode 100644
index 0000000000..1507020172
--- /dev/null
+++ b/ghost/admin/tests/integration/components/gh-validation-status-container-test.js
@@ -0,0 +1,72 @@
+/* jshint expr:true */
+import { expect } from 'chai';
+import {
+    describeComponent,
+    it
+} from 'ember-mocha';
+import hbs from 'htmlbars-inline-precompile';
+import Ember from 'ember';
+import DS from 'ember-data';
+
+describeComponent(
+    'gh-validation-status-container',
+    'Integration: Component: gh-validation-status-container',
+    {
+        integration: true
+    },
+    function () {
+        beforeEach(function () {
+            let testObject = new Ember.Object();
+            testObject.set('name', 'Test');
+            testObject.set('hasValidated', []);
+            testObject.set('errors', DS.Errors.create());
+
+            this.set('testObject', testObject);
+        });
+
+        it('has no success/error class by default', function () {
+            this.render(hbs`
+                {{#gh-validation-status-container class="gh-test" property="name" errors=testObject.errors hasValidated=testObject.hasValidated}}
+                {{/gh-validation-status-container}}
+            `);
+            expect(this.$('.gh-test')).to.have.length(1);
+            expect(this.$('.gh-test').hasClass('success')).to.be.false;
+            expect(this.$('.gh-test').hasClass('error')).to.be.false;
+        });
+
+        it('has success class when valid', function () {
+            this.get('testObject.hasValidated').push('name');
+
+            this.render(hbs`
+                {{#gh-validation-status-container class="gh-test" property="name" errors=testObject.errors hasValidated=testObject.hasValidated}}
+                {{/gh-validation-status-container}}
+            `);
+            expect(this.$('.gh-test')).to.have.length(1);
+            expect(this.$('.gh-test').hasClass('success')).to.be.true;
+            expect(this.$('.gh-test').hasClass('error')).to.be.false;
+        });
+
+        it('has error class when invalid', function () {
+            this.get('testObject.hasValidated').push('name');
+            this.get('testObject.errors').add('name', 'has error');
+
+            this.render(hbs`
+                {{#gh-validation-status-container class="gh-test" property="name" errors=testObject.errors hasValidated=testObject.hasValidated}}
+                {{/gh-validation-status-container}}
+            `);
+            expect(this.$('.gh-test')).to.have.length(1);
+            expect(this.$('.gh-test').hasClass('success')).to.be.false;
+            expect(this.$('.gh-test').hasClass('error')).to.be.true;
+        });
+
+        it('still renders if hasValidated is undefined', function () {
+            this.set('testObject.hasValidated', undefined);
+
+            this.render(hbs`
+                {{#gh-validation-status-container class="gh-test" property="name" errors=testObject.errors hasValidated=testObject.hasValidated}}
+                {{/gh-validation-status-container}}
+            `);
+            expect(this.$('.gh-test')).to.have.length(1);
+        });
+    }
+);