From f31dc15a65664d5b05099f0ebc127c41f6c7dced Mon Sep 17 00:00:00 2001 From: Angel Garbarino Date: Thu, 7 May 2020 09:19:47 -0600 Subject: [PATCH] Sidebranch: component and acceptance tests (#8903) * address secondary card overflow issue * setup replicaiton header test * address secondary card overflow issue * setup replication secondary card test * setup replicaiton header test * setup replicaiton page test * setup replication secondary card test * setup replication dashboard test * setup replicaiton page test * remove unused code * fix overflow * finish test for rep dashboard * update rep secondary card test * finish rep header test * fix rep table rows and header test * fix header test * fix missing data-test-primary-cluster * add to secondary test * remove pauseTest * add to enterprise replication test * add mode to dr secondary test * remove pauseTest * add enterprise to test * amend per pr commments * re organize rep secondary card test * adjust error heights with design input * move const around in rep secondary card test * move const around and message for rep dashboard test * amend per pr review comments * remove styling from grid-item-left * remove dup hasErrorClass key * quick fix * test failure fix * fix test due to merge * remove hasErrorClass * modify test message --- .../components/replication-dashboard.scss | 6 +- .../addon/components/replication-header.js | 12 +-- .../components/replication-secondary-card.js | 16 +++- .../templates/components/alert-inline.hbs | 2 +- .../components/replication-dashboard.hbs | 14 +-- .../components/replication-header.hbs | 6 +- .../templates/components/replication-page.hbs | 2 +- .../components/replication-secondary-card.hbs | 20 ++--- .../acceptance/enterprise-replication-test.js | 49 ++++++++++ .../components/replication-dashboard-test.js | 58 ++++++++++++ .../components/replication-header-test.js | 49 ++++++++++ .../components/replication-page-test.js | 22 +++++ .../replication-secondary-card-test.js | 89 +++++++++++++++++++ .../components/replication-table-rows-test.js | 33 ++++--- 14 files changed, 328 insertions(+), 50 deletions(-) create mode 100644 ui/tests/integration/components/replication-dashboard-test.js create mode 100644 ui/tests/integration/components/replication-header-test.js create mode 100644 ui/tests/integration/components/replication-page-test.js create mode 100644 ui/tests/integration/components/replication-secondary-card-test.js diff --git a/ui/app/styles/components/replication-dashboard.scss b/ui/app/styles/components/replication-dashboard.scss index 67ca5c0eb3ae..778f34cf70e0 100644 --- a/ui/app/styles/components/replication-dashboard.scss +++ b/ui/app/styles/components/replication-dashboard.scss @@ -23,14 +23,12 @@ .card-container { display: grid; - grid-gap: 2rem; + grid-gap: 1rem; grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr 1fr 0.8fr; + grid-template-rows: 0.2fr 1fr 0.2fr; padding: $spacing-l; line-height: 1.5; - height: 230px; - @include until(1320px) { // prevent an issue with the card descriptions wrapping and expanding height min-height: 250px; diff --git a/ui/lib/core/addon/components/replication-header.js b/ui/lib/core/addon/components/replication-header.js index 1f567ad032b3..17ed3907320c 100644 --- a/ui/lib/core/addon/components/replication-header.js +++ b/ui/lib/core/addon/components/replication-header.js @@ -1,18 +1,8 @@ -/** - * @module ReplicationHeader - * ARG TODO: finish - * - * @example - * ```js - * - * ``` - */ - import Component from '@ember/component'; import layout from '../templates/components/replication-header'; export default Component.extend({ layout, - data: null, isSecondary: null, + 'data-test-replication-header': true, }); diff --git a/ui/lib/core/addon/components/replication-secondary-card.js b/ui/lib/core/addon/components/replication-secondary-card.js index ef51e11e0b9a..7317bc58bbe1 100644 --- a/ui/lib/core/addon/components/replication-secondary-card.js +++ b/ui/lib/core/addon/components/replication-secondary-card.js @@ -3,6 +3,21 @@ import { computed } from '@ember/object'; import layout from '../templates/components/replication-secondary-card'; import { clusterStates } from 'core/helpers/cluster-states'; +/** + * @module ReplicationSecondaryCard + * ReplicationSecondaryCard components + * + * @example + * ```js + * + * ``` + * @param {string} [title=null] - The title to be displayed on the top left corner of the card. + * @param replicationDetails=null{DS.Model.replicationDetails} - An Ember data object off the Ember data model. It is computed at the parent component and passed through to this component. + */ + export default Component.extend({ layout, title: null, @@ -31,7 +46,6 @@ export default Component.extend({ // we should use the clusterStates helper instead return this.state === 'stream-wals'; }), - hasErrorClass: computed('replicationDetails', 'title', 'state', 'connection', function() { const { title, state, connection } = this; diff --git a/ui/lib/core/addon/templates/components/alert-inline.hbs b/ui/lib/core/addon/templates/components/alert-inline.hbs index 9bfd0f733450..973623816579 100644 --- a/ui/lib/core/addon/templates/components/alert-inline.hbs +++ b/ui/lib/core/addon/templates/components/alert-inline.hbs @@ -2,6 +2,6 @@ @glyph={{this.alertType.glyph}} class={{this.alertType.glyphClass}} /> -

+

{{@message}}

diff --git a/ui/lib/core/addon/templates/components/replication-dashboard.hbs b/ui/lib/core/addon/templates/components/replication-dashboard.hbs index 77a415c897b3..f33d086ccdf2 100644 --- a/ui/lib/core/addon/templates/components/replication-dashboard.hbs +++ b/ui/lib/core/addon/templates/components/replication-dashboard.hbs @@ -1,4 +1,4 @@ -
+
{{#if isSecondary}}

Primary Cluster @@ -7,7 +7,7 @@ If you set a primary_cluster_addr when enabling replication, it will appear here.

{{#if replicationDetails.primaryClusterAddr}} - {{replicationDetails.primaryClusterAddr}} + {{replicationDetails.primaryClusterAddr}} {{else}} no known primary cluster address {{/if}} @@ -18,7 +18,8 @@ @title={{concat "Re-indexing in progress" reindexingStage}} @type="info" @secondIconType="loading" - @message="This can cause a delay depending on the size of the data store. You can use Vault during this time."/> + @message="This can cause a delay depending on the size of the data store. You can use Vault during this time." + data-test-isReindexing/> {{/if}}
@@ -36,10 +37,11 @@ @type="info" @secondIconType="loading" @message="The cluster is syncing. This happens when the secondary is too far behind the primary to use the normal stream-wals state for catching up." - @class="has-top-margin-xl" /> + @class="has-top-margin-xl" + data-test-isSyncing/> {{/if}} - + @clusterMode={{clusterMode}}/> +
diff --git a/ui/lib/core/addon/templates/components/replication-header.hbs b/ui/lib/core/addon/templates/components/replication-header.hbs index f13fb2b3eb6b..77aa9eb4720d 100644 --- a/ui/lib/core/addon/templates/components/replication-header.hbs +++ b/ui/lib/core/addon/templates/components/replication-header.hbs @@ -33,10 +33,10 @@

{{title}} - + {{if isSecondary 'Secondary' 'Primary'}} - + {{data.dr.clusterIdDisplay}}

@@ -44,7 +44,7 @@ {{#if showTabs}} -
+