diff --git a/ui/lib/core/addon/components/replication-header.hbs b/ui/lib/core/addon/components/replication-header.hbs index 69816fb40c..be2fd0892c 100644 --- a/ui/lib/core/addon/components/replication-header.hbs +++ b/ui/lib/core/addon/components/replication-header.hbs @@ -13,7 +13,7 @@ {{/if}} -

+

{{@title}} {{#if @data.anyReplicationEnabled}} diff --git a/ui/lib/replication/addon/components/page/mode-index.hbs b/ui/lib/replication/addon/components/page/mode-index.hbs index d35e024b0f..720da2235c 100644 --- a/ui/lib/replication/addon/components/page/mode-index.hbs +++ b/ui/lib/replication/addon/components/page/mode-index.hbs @@ -6,7 +6,7 @@ {{#if @replicationDisabled}} -

+

{{#if (eq @replicationMode "dr")}} Enable Disaster Recovery Replication {{else if (eq @replicationMode "performance")}} diff --git a/ui/lib/replication/addon/templates/index.hbs b/ui/lib/replication/addon/templates/index.hbs index 25f497dc94..9b2c9c326e 100644 --- a/ui/lib/replication/addon/templates/index.hbs +++ b/ui/lib/replication/addon/templates/index.hbs @@ -9,7 +9,7 @@ {{! Replication is unsupported in non-enterprise or when using non-transactional storage (eg inmem) }} -

+

Replication unsupported

@@ -20,7 +20,7 @@ {{else if this.model.allReplicationDisabled}} -

+

Enable Replication

@@ -114,7 +114,7 @@ {{! Renders when at least one mode is not enabled }} -

+

Replication

diff --git a/ui/lib/replication/addon/templates/mode.hbs b/ui/lib/replication/addon/templates/mode.hbs index befb396e7e..40a8465112 100644 --- a/ui/lib/replication/addon/templates/mode.hbs +++ b/ui/lib/replication/addon/templates/mode.hbs @@ -17,7 +17,7 @@ -

+

{{this.model.replicationModeForDisplay}} {{this.model.replicationAttrs.modeForHeader}} diff --git a/ui/tests/acceptance/enterprise-replication-modes-test.js b/ui/tests/acceptance/enterprise-replication-modes-test.js index d042fe7f3e..50ddc1b8c7 100644 --- a/ui/tests/acceptance/enterprise-replication-modes-test.js +++ b/ui/tests/acceptance/enterprise-replication-modes-test.js @@ -12,7 +12,7 @@ import { STATUS_DISABLED_RESPONSE, mockReplicationBlock } from 'vault/tests/help const s = { navLink: (title) => `[data-test-sidebar-nav-link="${title}"]`, - title: '[data-test-replication-title]', + title: (t) => `[data-test-replication-title="${t}"]`, detailLink: (mode) => `[data-test-replication-details-link="${mode}"]`, summaryCard: '[data-test-replication-summary-card]', dashboard: '[data-test-replication-dashboard]', @@ -20,6 +20,13 @@ const s = { knownSecondary: (name) => `[data-test-secondaries-node="${name}"]`, }; +// wait for specific title selector as an attempt to stabilize flaky tests +async function assertTitle(assert, title, altSelector) { + const selector = altSelector || title; + await waitFor(s.title(selector)); + assert.dom(s.title(selector)).hasText(title); +} + module('Acceptance | Enterprise | replication modes', function (hooks) { setupApplicationTest(hooks); setupMirage(hooks); @@ -42,7 +49,8 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { await authPage.login(); await visit('/vault/replication'); - assert.dom(s.title).hasText('Replication unsupported', 'it shows the unsupported view'); + + await assertTitle(assert, 'Replication unsupported'); // Nav links assert.dom(s.navLink('Performance')).doesNotExist('hides performance link'); @@ -52,7 +60,8 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { test('replication page when disabled', async function (assert) { await this.setupMocks(STATUS_DISABLED_RESPONSE); await visit('/vault/replication'); - assert.dom(s.title).hasText('Enable Replication', 'it shows the enable view'); + + await assertTitle(assert, 'Enable Replication'); // Nav links assert.dom(s.navLink('Performance')).exists('shows performance link'); @@ -64,7 +73,8 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { assert.dom(s.enableForm).exists(); await click(s.navLink('Disaster Recovery')); - assert.dom(s.title).hasText('Enable Disaster Recovery Replication', 'it shows the enable view for dr'); + + await assertTitle(assert, 'Enable Disaster Recovery Replication', 'dr'); }); ['primary', 'secondary'].forEach((mode) => { @@ -75,7 +85,7 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { }); await visit('/vault/replication'); - assert.dom(s.title).hasText('Replication', 'it shows default view'); + await assertTitle(assert, 'Replication'); assert.dom(s.detailLink('performance')).hasText('Details', 'CTA to see performance details'); assert.dom(s.detailLink('dr')).hasText('Enable', 'CTA to enable dr'); @@ -89,7 +99,7 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { assert.dom(s.dashboard).exists(`it shows the replication dashboard`); await click(s.navLink('Disaster Recovery')); - assert.dom(s.title).hasText('Enable Disaster Recovery Replication', 'it shows the dr title'); + await assertTitle(assert, 'Enable Disaster Recovery Replication', 'dr'); assert.dom(s.enableForm).exists('it shows the enable view for dr'); }); }); @@ -100,7 +110,7 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { performance: mockReplicationBlock(), }); await visit('/vault/replication'); - assert.dom(s.title).hasText('Replication', 'it shows default view'); + await assertTitle(assert, 'Replication'); assert.dom(s.detailLink('performance')).hasText('Enable', 'CTA to enable performance'); assert.dom(s.detailLink('dr')).hasText('Details', 'CTA to see dr details'); @@ -114,7 +124,7 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { assert.dom(s.enableForm).exists('it shows the enable view for performance'); await click(s.navLink('Disaster Recovery')); - assert.dom(s.title).hasText(`Disaster Recovery primary`, 'it shows the dr title'); + await assertTitle(assert, 'Disaster Recovery primary', 'Disaster Recovery'); assert.dom(s.dashboard).exists(`it shows the replication dashboard`); }); @@ -124,15 +134,15 @@ module('Acceptance | Enterprise | replication modes', function (hooks) { performance: mockReplicationBlock('primary'), }); await visit('/vault/replication'); - assert.dom(s.title).hasText('Disaster Recovery & Performance primary', 'it shows primary view'); + await assertTitle(assert, 'Disaster Recovery & Performance primary', 'Disaster Recovery & Performance'); assert.dom(s.summaryCard).exists({ count: 2 }, 'shows 2 summary cards'); await click(s.navLink('Performance')); - assert.dom(s.title).hasText(`Performance primary`, `it shows the performance mode details`); + await assertTitle(assert, 'Performance primary', 'Performance'); assert.dom(s.enableForm).doesNotExist(); await click(s.navLink('Disaster Recovery')); - assert.dom(s.title).hasText(`Disaster Recovery primary`, 'it shows the dr mode details'); + await assertTitle(assert, 'Disaster Recovery primary', 'Disaster Recovery'); assert.dom(s.enableForm).doesNotExist(); }); }); diff --git a/ui/tests/acceptance/enterprise-replication-test.js b/ui/tests/acceptance/enterprise-replication-test.js index d079d49708..8998ee118e 100644 --- a/ui/tests/acceptance/enterprise-replication-test.js +++ b/ui/tests/acceptance/enterprise-replication-test.js @@ -165,14 +165,12 @@ module('Acceptance | Enterprise | replication', function (hooks) { 'shows the correct title of the empty state' ); - assert.ok( - find('[data-test-replication-title]').textContent.includes('Disaster Recovery'), - 'it displays the replication type correctly' - ); - assert.ok( - find('[data-test-replication-mode-display]').textContent.includes('primary'), - 'it displays the cluster mode correctly' - ); + assert + .dom('[data-test-replication-title="Disaster Recovery"]') + .includesText('Disaster Recovery', 'it displays the replication type correctly'); + assert + .dom('[data-test-replication-mode-display]') + .includesText('primary', 'it displays the cluster mode correctly'); // add dr secondary await click('[data-test-replication-link="secondaries"]'); diff --git a/ui/tests/integration/components/replication-page-test.js b/ui/tests/integration/components/replication-page-test.js index 07dbc502be..d9b6ed17b7 100644 --- a/ui/tests/integration/components/replication-page-test.js +++ b/ui/tests/integration/components/replication-page-test.js @@ -62,11 +62,11 @@ module('Integration | Component | replication-page', function (hooks) { await render( hbs`` ); - await waitFor('[data-test-replication-title]'); + await waitFor('[data-test-replication-title="dr"]'); // Title has spaces and newlines, so we can't use hasText because it won't match exactly - assert.dom('[data-test-replication-title]').includesText('Disaster Recovery'); + assert.dom('[data-test-replication-title="dr"]').includesText('Disaster Recovery'); this.set('model', { ...MODEL, replicationMode: 'performance' }); await settled(); - assert.dom('[data-test-replication-title]').includesText('Performance'); + assert.dom('[data-test-replication-title="performance"]').includesText('Performance'); }); });