diff --git a/app/styles/layout/_forms.scss b/app/styles/layout/_forms.scss
index 06b410f51..6d790df63 100644
--- a/app/styles/layout/_forms.scss
+++ b/app/styles/layout/_forms.scss
@@ -147,7 +147,7 @@ form {
.error {
color: $red;
- margin: 5px;
+ margin: 5px 0;
}
.login-form, .signup-form, .reset-password-form, .forgot-password-form {
diff --git a/app/templates/components/payments/funds-recipient/verification-document.hbs b/app/templates/components/payments/funds-recipient/verification-document.hbs
index 94e498615..740bcf8db 100644
--- a/app/templates/components/payments/funds-recipient/verification-document.hbs
+++ b/app/templates/components/payments/funds-recipient/verification-document.hbs
@@ -1,4 +1,4 @@
-{{#if (eq status 'required')}}
+{{#if (or (eq status 'required') (eq status 'errored'))}}
{{#if isBusy}}
Processing...
{{else if isUploading}}
@@ -6,7 +6,7 @@
{{else}}
We need you to upload a copy of your personal ID to verify your identity.
Please upload either a PNG or JPG image. Your file should be less than 8MB.
-
+
{{payments/funds-recipient/identity-document-file-upload
isBusy=isBusy
stripeConnectAccount=stripeConnectAccount
@@ -15,7 +15,10 @@
uploadDone=(action onUploadDone)
uploadError=(action onUploadError)
validationError=(action onValidationError)}}
-
+
+ {{#if (eq status 'errored')}}
+ Stripe was unable to verify your identity with the document you provided. Please try again.
+ {{/if}}
{{#if error}}
{{error}}
{{/if}}
diff --git a/tests/integration/components/payments/funds-recipient/verification-document-test.js b/tests/integration/components/payments/funds-recipient/verification-document-test.js
index 105c5f248..6a7843c4e 100644
--- a/tests/integration/components/payments/funds-recipient/verification-document-test.js
+++ b/tests/integration/components/payments/funds-recipient/verification-document-test.js
@@ -86,7 +86,17 @@ test('it shows errors if any', function(assert) {
renderPage();
- assert.equal(page.errorText, 'Lorem ipsum', 'Error is rendered');
+ assert.equal(page.error.text, 'Lorem ipsum', 'Error is rendered');
+});
+
+test('it renders Stripe error correctly', function(assert) {
+ assert.expect(2);
+ this.set('stripeConnectAccount', { verificationDocumentStatus: 'errored' });
+
+ renderPage();
+
+ assert.ok(page.error.isVisible, 'Error is rendered');
+ assert.ok(page.rendersFileUpload, 'File upload subcomponent is rendered');
});
// TODO: Figure out how to write these
diff --git a/tests/pages/components/payments/funds-recipient/verification-document.js b/tests/pages/components/payments/funds-recipient/verification-document.js
index d2d18dfd4..e6a8d6896 100644
--- a/tests/pages/components/payments/funds-recipient/verification-document.js
+++ b/tests/pages/components/payments/funds-recipient/verification-document.js
@@ -1,14 +1,19 @@
import Ember from 'ember';
-import { clickable, isVisible, text } from 'ember-cli-page-object';
+import { clickable, isVisible } from 'ember-cli-page-object';
const { $, run } = Ember;
export default {
scope: '.verification-document',
- errorText: text('.error'),
- rendersFileUpload: isVisible('input[type=file]'),
+
clickSubmit: clickable('button'),
+ error: {
+ scope: '.error'
+ },
+
+ rendersFileUpload: isVisible('input[type=file]'),
+
// since it's near impossible to simulate selecting a file with a filepicker
// this does the "next best" thing and triggers the "upload done" action on the component
triggerDocumentSubmitted(context, stripeFileId = 'fil_test') {
@@ -20,4 +25,3 @@ export default {
});
}
};
-