diff --git a/ui/app/components/auth-form.js b/ui/app/components/auth-form.js index a2ebe58449a4..2790508a4e20 100644 --- a/ui/app/components/auth-form.js +++ b/ui/app/components/auth-form.js @@ -3,7 +3,21 @@ import { supportedAuthBackends } from 'vault/helpers/supported-auth-backends'; const BACKENDS = supportedAuthBackends(); const { computed, inject } = Ember; -export default Ember.Component.extend({ +const attributesForSelectedAuthBackend = { + token: ['token'], + userpass: ['username', 'password'], + ldap: ['username', 'password'], + github: ['username', 'password'], + okta: ['username', 'password'], +}; + +const DEFAULTS = { + token: null, + username: null, + password: null, +}; + +export default Ember.Component.extend(DEFAULTS, { classNames: ['auth-form'], routing: inject.service('-routing'), auth: inject.service(), @@ -14,6 +28,21 @@ export default Ember.Component.extend({ this.$('li.is-active').get(0).scrollIntoView(); }, + didReceiveAttrs() { + this._super(...arguments); + let newMethod = this.get('selectedAuthType'); + let oldMethod = this.get('oldSelectedAuthType'); + + if (oldMethod && oldMethod !== newMethod) { + this.resetDefaults(); + } + this.set('oldSelectedAuthType', newMethod); + }, + + resetDefaults() { + this.setProperties(DEFAULTS); + }, + cluster: null, redirectTo: null, @@ -22,9 +51,9 @@ export default Ember.Component.extend({ return BACKENDS.findBy('type', this.get('selectedAuthType')); }), - providerComponentName: Ember.computed('selectedAuthBackend.type', function() { - const type = Ember.String.dasherize(this.get('selectedAuthBackend.type')); - return `auth-form/${type}`; + providerPartialName: Ember.computed('selectedAuthType', function() { + const type = Ember.String.dasherize(this.get('selectedAuthType')); + return `partials/auth-form/${type}`; }), hasCSPError: computed.alias('csp.connectionViolations.firstObject'), @@ -45,15 +74,18 @@ export default Ember.Component.extend({ }, actions: { - doSubmit(data) { + doSubmit() { + let data = {}; this.setProperties({ loading: true, error: null, }); - const targetRoute = this.get('redirectTo') || 'vault.cluster'; - //const {password, token, username} = data; - const backend = this.get('selectedAuthBackend.type'); - const path = this.get('customPath'); + let targetRoute = this.get('redirectTo') || 'vault.cluster'; + let backend = this.get('selectedAuthBackend.type'); + let path = this.get('customPath'); + let attributes = attributesForSelectedAuthBackend[backend]; + + data = Ember.assign(data, this.getProperties(...attributes)); if (this.get('useCustomPath') && path) { data.path = path; } diff --git a/ui/app/components/download-button.js b/ui/app/components/download-button.js index 72fee1106ef4..2e2847c887fa 100644 --- a/ui/app/components/download-button.js +++ b/ui/app/components/download-button.js @@ -12,7 +12,7 @@ export default Ember.Component.extend({ return `${this.get('filename')}-${new Date().toISOString()}.${this.get('extension')}`; }), - fileLike: computed('data', 'mime', 'strigify', 'download', function() { + fileLike: computed('data', 'mime', 'stringify', 'download', function() { let file; let data = this.get('data'); let filename = this.get('download'); diff --git a/ui/app/styles/components/shamir-progress.scss b/ui/app/styles/components/shamir-progress.scss index 4bb418328a76..1169b45a4db7 100644 --- a/ui/app/styles/components/shamir-progress.scss +++ b/ui/app/styles/components/shamir-progress.scss @@ -1,11 +1,12 @@ .shamir-progress { .shamir-progress-progress { display: inline-block; + margin-top: $size-10; margin-right: $size-8; } .progress { box-shadow: 0 0 0 4px $progress-bar-background-color; - display: inline; - width: 150px; + margin-top: $size-10; + min-width: 90px; } } diff --git a/ui/app/templates/components/auth-form.hbs b/ui/app/templates/components/auth-form.hbs index 73b35345a476..2d94e536adfd 100644 --- a/ui/app/templates/components/auth-form.hbs +++ b/ui/app/templates/components/auth-form.hbs @@ -1,7 +1,7 @@ -
- {{#if (and cluster.standby hasCSPError)}} - {{message-error errorMessage=cspErrorText data-test-auth-error=true}} - {{else}} - {{message-error errorMessage=error data-test-auth-error=true}} - {{/if}} - {{component providerComponentName onSubmit=(action 'doSubmit') }} -
- {{#unless (eq selectedAuthBackend.type "token")}} - {{toggle-button toggleTarget=this toggleAttr="useCustomPath"}} -
- {{#if useCustomPath}} - -
- -
-

- If this backend was mounted using a non-default path, enter it here. -

- {{/if}} -
- {{/unless}} +
+
+ {{#if (and cluster.standby hasCSPError)}} + {{message-error errorMessage=cspErrorText data-test-auth-error=true}} + {{else}} + {{message-error errorMessage=error data-test-auth-error=true}} + {{/if}} + {{partial providerPartialName}} +
+ {{#unless (eq selectedAuthBackend.type "token")}} + {{toggle-button toggleTarget=this toggleAttr="useCustomPath"}} +
+ {{#if useCustomPath}} + +
+ +
+

+ If this backend was mounted using a non-default path, enter it here. +

+ {{/if}} +
+ {{/unless}} +
-
-
- -
+
+ +
+ diff --git a/ui/app/templates/components/auth-form/git-hub.hbs b/ui/app/templates/components/auth-form/git-hub.hbs deleted file mode 100644 index a87e98afc0d5..000000000000 --- a/ui/app/templates/components/auth-form/git-hub.hbs +++ /dev/null @@ -1,17 +0,0 @@ -
-
- -
- {{input - type="password" - value=token - name="token" - id="token" - class="input" - }} -
-
-
diff --git a/ui/app/templates/components/auth-form/token.hbs b/ui/app/templates/components/auth-form/token.hbs deleted file mode 100644 index 7f89628f9571..000000000000 --- a/ui/app/templates/components/auth-form/token.hbs +++ /dev/null @@ -1,17 +0,0 @@ -
-
- -
- {{input - type="password" - value=token - name="token" - class="input" - data-test-token=true - }} -
-
-
diff --git a/ui/app/templates/components/shamir-flow.hbs b/ui/app/templates/components/shamir-flow.hbs index 5c5d22403b0e..91b7f1196466 100644 --- a/ui/app/templates/components/shamir-flow.hbs +++ b/ui/app/templates/components/shamir-flow.hbs @@ -114,9 +114,9 @@
{{else}} -
- {{message-error errors=errors}} -
+ +
+ {{message-error errors=errors}}
{{#if hasBlock}} {{yield}} @@ -132,29 +132,28 @@ {{input class="input"type="password" name="key" value=key data-test-shamir-input=true}}
-
-
-
-
-
- -
-
- {{#if (or started hasProgress)}} - {{shamir-progress - threshold=threshold - progress=progress - }} - {{/if}} +
+
+
+
+ +
+
+ {{#if (or started hasProgress)}} + {{shamir-progress + threshold=threshold + progress=progress + }} + {{/if}} +
-
+ {{/if}} diff --git a/ui/app/templates/components/shamir-progress.hbs b/ui/app/templates/components/shamir-progress.hbs index 63f9f14be8a3..053c283cf98a 100644 --- a/ui/app/templates/components/shamir-progress.hbs +++ b/ui/app/templates/components/shamir-progress.hbs @@ -1,8 +1,10 @@
-
+
{{progress}} / {{threshold}} keys provided +
+
diff --git a/ui/app/templates/partials/auth-form/git-hub.hbs b/ui/app/templates/partials/auth-form/git-hub.hbs new file mode 100644 index 000000000000..90333e5c852f --- /dev/null +++ b/ui/app/templates/partials/auth-form/git-hub.hbs @@ -0,0 +1,13 @@ +
+ +
+ {{input + type="password" + value=token + name="token" + id="token" + class="input" + data-test-token=true + }} +
+
diff --git a/ui/app/templates/components/auth-form/ldap.hbs b/ui/app/templates/partials/auth-form/ldap.hbs similarity index 100% rename from ui/app/templates/components/auth-form/ldap.hbs rename to ui/app/templates/partials/auth-form/ldap.hbs diff --git a/ui/app/templates/components/auth-form/okta.hbs b/ui/app/templates/partials/auth-form/okta.hbs similarity index 100% rename from ui/app/templates/components/auth-form/okta.hbs rename to ui/app/templates/partials/auth-form/okta.hbs diff --git a/ui/app/templates/partials/auth-form/token.hbs b/ui/app/templates/partials/auth-form/token.hbs new file mode 100644 index 000000000000..9428b38ed251 --- /dev/null +++ b/ui/app/templates/partials/auth-form/token.hbs @@ -0,0 +1,12 @@ +
+ +
+ {{input + type="password" + value=token + name="token" + class="input" + data-test-token=true + }} +
+
diff --git a/ui/app/templates/components/auth-form/userpass.hbs b/ui/app/templates/partials/auth-form/userpass.hbs similarity index 100% rename from ui/app/templates/components/auth-form/userpass.hbs rename to ui/app/templates/partials/auth-form/userpass.hbs diff --git a/ui/app/templates/partials/userpass-form.hbs b/ui/app/templates/partials/userpass-form.hbs index ec1945a29850..e4c2d2636083 100644 --- a/ui/app/templates/partials/userpass-form.hbs +++ b/ui/app/templates/partials/userpass-form.hbs @@ -1,28 +1,25 @@ -
-
- -
- {{input - value=username - name="username" - id="username" - class="input" - }} -
+
+ +
+ {{input + value=username + name="username" + id="username" + class="input" + data-test-username=true + }}
-
- -
- {{input - value=password - name="password" - id="password" - type="password" - class="input" - }} -
+
+
+ +
+ {{input + value=password + name="password" + id="password" + type="password" + class="input" + data-test-password=true + }}
- +
diff --git a/ui/app/templates/vault/cluster/init.hbs b/ui/app/templates/vault/cluster/init.hbs index 1eb3478244be..db068bfa2261 100644 --- a/ui/app/templates/vault/cluster/init.hbs +++ b/ui/app/templates/vault/cluster/init.hbs @@ -71,19 +71,19 @@
{{else}} -
-
+ +

@@ -156,18 +156,17 @@ {{pgp-list listLength=1 onDataUpdate=(action 'setRootKey')}}

{{/if}} - -
-
- -
+
+
+ +
+ {{/if}} {{/s.content}} {{/splash-page}} diff --git a/ui/package.json b/ui/package.json index ee8a0f32d2b8..4d61bf4de1c1 100644 --- a/ui/package.json +++ b/ui/package.json @@ -56,7 +56,7 @@ "ember-cli-inject-live-reload": "^1.4.1", "ember-cli-mirage": "^0.4.1", "ember-cli-moment-shim": "2.2.1", - "ember-cli-page-object": "^1.13.0", + "ember-cli-page-object": "1.14", "ember-cli-pretender": "0.7.0", "ember-cli-qunit": "^4.0.0", "ember-cli-sass": "6.0.0", diff --git a/ui/tests/acceptance/auth-test.js b/ui/tests/acceptance/auth-test.js index 361d70e779f0..0f024de892cf 100644 --- a/ui/tests/acceptance/auth-test.js +++ b/ui/tests/acceptance/auth-test.js @@ -1,9 +1,13 @@ import { test } from 'qunit'; import moduleForAcceptance from 'vault/tests/helpers/module-for-acceptance'; import { supportedAuthBackends } from 'vault/helpers/supported-auth-backends'; +import authForm from '../pages/components/auth-form'; +import { create } from 'ember-cli-page-object'; + +const component = create(authForm); moduleForAcceptance('Acceptance | auth', { - afterEach() { + beforeEach() { return authLogout(); }, }); @@ -25,3 +29,15 @@ test('auth query params', function(assert) { }); }); }); + +test('it clears token when changing selected auth method', function(assert) { + visit('/vault/auth'); + andThen(function() { + assert.equal(currentURL(), '/vault/auth'); + }); + component.token('token').tabs.filterBy('name', 'GitHub')[0].link(); + component.tabs.filterBy('name', 'Token')[0].link(); + andThen(function() { + assert.equal(component.tokenValue, '', 'it clears the token value when toggling methods'); + }); +}); diff --git a/ui/tests/pages/components/auth-form.js b/ui/tests/pages/components/auth-form.js index 921b300efe65..7f930f505a9b 100644 --- a/ui/tests/pages/components/auth-form.js +++ b/ui/tests/pages/components/auth-form.js @@ -1,6 +1,14 @@ -import { clickable, text } from 'ember-cli-page-object'; +import { collection, clickable, fillable, text, value } from 'ember-cli-page-object'; export default { + tabs: collection('[data-test-auth-method]', { + name: text(), + link: clickable('[data-test-auth-method-link]'), + }), + username: fillable('[data-test-username]'), + token: fillable('[data-test-token]'), + tokenValue: value('[data-test-token]'), + password: fillable('[data-test-password]'), errorText: text('[data-test-auth-error]'), login: clickable('[data-test-auth-submit]'), }; diff --git a/ui/yarn.lock b/ui/yarn.lock index d7a98cc21b72..3a749b3a8e91 100644 --- a/ui/yarn.lock +++ b/ui/yarn.lock @@ -2756,15 +2756,14 @@ ember-cli-normalize-entity-name@^1.0.0: dependencies: silent-error "^1.0.0" -ember-cli-page-object@^1.13.0: - version "1.13.0" - resolved "https://registry.yarnpkg.com/ember-cli-page-object/-/ember-cli-page-object-1.13.0.tgz#9ac9342d9f90a363c429fbb14f3ad5c0be11827a" +ember-cli-page-object@1.14: + version "1.14.1" + resolved "https://registry.yarnpkg.com/ember-cli-page-object/-/ember-cli-page-object-1.14.1.tgz#2e3599c204c56440c6c8154fc686c603816f877a" dependencies: ceibo "~2.0.0" ember-cli-babel "^6.6.0" ember-cli-node-assets "^0.2.2" ember-native-dom-helpers "^0.5.3" - ember-test-helpers "^0.6.3" jquery "^3.2.1" rsvp "^4.7.0"