From 7f4b9d2cbfbfde9167fc710c80d09c120bed0d3d Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Wed, 6 Nov 2024 12:39:20 -0800 Subject: [PATCH 01/35] course objective row description/parentObjectives FadeText expansion now sync --- .../course/objective-list-item-parents.hbs | 8 ++++- .../components/course/objective-list-item.hbs | 10 ++++++- .../components/course/objective-list-item.js | 9 ++++++ .../addon/components/editable-field.hbs | 2 ++ .../addon/components/editable-field.js | 4 +++ .../addon/components/fade-text.js | 30 ++++++++++++------- 6 files changed, 51 insertions(+), 12 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index b57dd64675..e7eed982e4 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -30,6 +30,8 @@
    • diff --git a/packages/ilios-common/addon/components/objective-sort-manager.js b/packages/ilios-common/addon/components/objective-sort-manager.js index 94ea9338c4..d4ea89a370 100644 --- a/packages/ilios-common/addon/components/objective-sort-manager.js +++ b/packages/ilios-common/addon/components/objective-sort-manager.js @@ -13,6 +13,7 @@ export default class ObjectiveSortManagerComponent extends Component { @tracked draggedAboveItem; @tracked draggedBelowItem; @tracked sortedItems; + @tracked expanded; @cached get objectives() { @@ -99,4 +100,9 @@ export default class ObjectiveSortManagerComponent extends Component { } } } + + @action + toggleExpansion() { + this.expanded = !this.expanded; + } } diff --git a/packages/ilios-common/addon/components/session/objective-list-item.hbs b/packages/ilios-common/addon/components/session/objective-list-item.hbs index c60cb03965..854f75914c 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item.hbs @@ -20,8 +20,8 @@ {{else}} {{/if}} From 7dd08fa08cc87ab78a059fecee77e56c5448692e Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Wed, 6 Nov 2024 13:48:47 -0800 Subject: [PATCH 05/35] fixed objectives line-height for non-editors --- .../app/styles/ilios-common/mixins/objectives.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index e5cb85bc66..c2999ed1f9 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -120,6 +120,7 @@ .description { p { + @include font-size.font-size("base"); margin: 0; } button { @@ -178,7 +179,8 @@ margin-bottom: 0; } - button { + button, + .display-text { @include font-size.font-size("base"); } } From 874ac4228c3e9bc306c7abf6fc56dc5dc67acdaa Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Wed, 6 Nov 2024 16:37:25 -0800 Subject: [PATCH 06/35] fixed tests --- .../components/editable-field-test.js | 20 ++++++--- .../integration/components/fade-text-test.js | 41 ++++++++++++++----- 2 files changed, 46 insertions(+), 15 deletions(-) diff --git a/packages/test-app/tests/integration/components/editable-field-test.js b/packages/test-app/tests/integration/components/editable-field-test.js index b80fa005fb..7164b2d5c2 100644 --- a/packages/test-app/tests/integration/components/editable-field-test.js +++ b/packages/test-app/tests/integration/components/editable-field-test.js @@ -104,12 +104,10 @@ module('Integration | Component | editable field', function (hooks) { test('focus when editor opens on textarea', async function (assert) { this.set('value', 'lorem'); this.set('label', 'Foo Bar'); - await render( - hbs` + await render(hbs` -`, - ); +`); await click('[data-test-edit]'); assert.dom('textarea', this.element).isFocused(); @@ -122,13 +120,25 @@ module('Integration | Component | editable field', function (hooks) { const fadedClass = 'is-faded'; const fadedSelector = '.is-faded'; this.set('value', text); - await render(hbs``); + this.set('fadeTextIsExpanded', false); + this.set('expandAllFadeText', (isExpanded) => { + this.set('fadeTextIsExpanded', isExpanded); + }); + await render( + hbs``, + ); await waitFor(fadedSelector); assert.dom('.display-text-wrapper', this.element).hasClass(fadedClass); await click('[data-test-expand]'); + assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(fadedClass); + await click('[data-test-collapse]'); await waitFor(fadedSelector); diff --git a/packages/test-app/tests/integration/components/fade-text-test.js b/packages/test-app/tests/integration/components/fade-text-test.js index 14a9f70bb9..7d4cefe07d 100644 --- a/packages/test-app/tests/integration/components/fade-text-test.js +++ b/packages/test-app/tests/integration/components/fade-text-test.js @@ -30,7 +30,7 @@ module('Integration | Component | fade-text', function (hooks) { test('it renders empty', async function (assert) { await render(hbs``); - assert.strictEqual(component.text, ''); + assert.strictEqual(component.text, '', 'has no text'); await render(hbs``); assert.dom(this.element).hasText(''); @@ -54,7 +54,13 @@ module('Integration | Component | fade-text', function (hooks) { test('it fades tall text given as component argument', async function (assert) { this.set('longHtml', this.longHtml); - await render(hbs``); + this.set('expanded', false); + this.set('onExpandAll', (isExpanded) => { + this.set('expanded', isExpanded); + }); + await render( + hbs``, + ); // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); @@ -75,8 +81,17 @@ module('Integration | Component | fade-text', function (hooks) { test('it fades tall text given as block', async function (assert) { this.set('longHtml', this.longHtml); - - await render(hbs` + this.set('expanded', false); + this.set('onExpandAll', (isExpanded) => { + this.set('expanded', isExpanded); + }); + + await render(hbs`
    {{displayText}} @@ -114,21 +129,27 @@ module('Integration | Component | fade-text', function (hooks) { const longText = `An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades. An objective description so long that it fades.`; this.set('longHtml', this.longHtml); this.set('longText', longText); - await render(hbs``); + this.set('expanded', false); + this.set('onExpandAll', (isExpanded) => { + this.set('expanded', isExpanded); + }); + await render( + hbs``, + ); // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); - assert.strictEqual(component.text, longText); - assert.ok(component.expand.isVisible); - assert.notOk(component.collapse.isVisible); + assert.strictEqual(component.text, longText, 'component text matches'); + assert.ok(component.expand.isVisible, 'expand button is visible'); + assert.notOk(component.collapse.isVisible, 'collapse button is NOT visible'); await component.expand.click(); assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); - assert.notOk(component.expand.isVisible); - assert.ok(component.collapse.isVisible); + assert.notOk(component.expand.isVisible, 'expand button is NOT visible'); + assert.ok(component.collapse.isVisible, 'collpase button is visible'); await component.collapse.click(); From ad1c2fb02e25111dff957df840a3673dff24efd6 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 07:38:25 -0800 Subject: [PATCH 07/35] removed unnecessary getter --- .../components/course/objective-list-item.hbs | 4 +- .../components/course/objective-list-item.js | 4 -- .../addon/components/editable-field.js | 4 -- .../session/objective-list-item.hbs | 40 +++++++++++++------ .../components/session/objective-list-item.js | 4 -- 5 files changed, 29 insertions(+), 27 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item.hbs b/packages/ilios-common/addon/components/course/objective-list-item.hbs index 33b6806dae..275ed2fcc1 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item.hbs @@ -14,7 +14,7 @@ @isSaveDisabled={{this.hasErrorForTitle}} @save={{perform this.saveTitleChanges}} @close={{this.revertTitleChanges}} - @fadeTextExpanded={{this.fadeTextIsExpanded}} + @fadeTextExpanded={{this.fadeTextExpanded}} @onExpandAllFadeText={{this.expandAllFadeText}} > diff --git a/packages/ilios-common/addon/components/course/objective-list-item.js b/packages/ilios-common/addon/components/course/objective-list-item.js index 8f571286ab..f2530b61d3 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item.js +++ b/packages/ilios-common/addon/components/course/objective-list-item.js @@ -57,10 +57,6 @@ export default class CourseObjectiveListItemComponent extends Component { return this.isManagingParents || this.isManagingDescriptors || this.isManagingTerms; } - get fadeTextIsExpanded() { - return this.fadeTextExpanded; - } - saveTitleChanges = dropTask(async () => { this.addErrorDisplayFor('title'); const isValid = await this.isValid('title'); diff --git a/packages/ilios-common/addon/components/editable-field.js b/packages/ilios-common/addon/components/editable-field.js index 9790e10737..8ffb227685 100644 --- a/packages/ilios-common/addon/components/editable-field.js +++ b/packages/ilios-common/addon/components/editable-field.js @@ -15,10 +15,6 @@ export default class EditableFieldComponent extends Component { return strippedText.length === 0; } - get fadeTextIsExpanded() { - return this.args.fadeTextIsExpanded; - } - saveData = dropTask(async () => { await timeout(1); const result = await this.args.save(); diff --git a/packages/ilios-common/addon/components/session/objective-list-item.hbs b/packages/ilios-common/addon/components/session/objective-list-item.hbs index 854f75914c..b1c0f1010c 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item.hbs @@ -1,6 +1,9 @@
    @@ -11,10 +14,14 @@ @isSaveDisabled={{this.hasErrorForTitle}} @save={{perform this.saveTitleChanges}} @close={{this.revertTitleChanges}} - @fadeTextExpanded={{this.fadeTextIsExpanded}} + @fadeTextExpanded={{this.fadeTextExpanded}} @onExpandAllFadeText={{this.expandAllFadeText}} > - + {{else}} @@ -33,18 +40,18 @@ @save={{perform this.saveParents}} @isSaving={{this.saveParents.isRunning}} @cancel={{this.cancel}} - @fadeTextExpanded={{this.fadeTextIsExpanded}} + @fadeTextExpanded={{this.fadeTextExpanded}} @onExpandAllFadeText={{this.expandAllFadeText}} />
    - {{#if (and @editable (not this.isManaging) (not this.showRemoveConfirmation) (not this.showRemoveConfirmation))}} + {{#if + (and + @editable + (not this.isManaging) + (not this.showRemoveConfirmation) + (not this.showRemoveConfirmation) + ) + }}
    +
    \ No newline at end of file diff --git a/packages/ilios-common/addon/components/session/objective-list-item.js b/packages/ilios-common/addon/components/session/objective-list-item.js index 7893732c88..97e5eb1d33 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item.js +++ b/packages/ilios-common/addon/components/session/objective-list-item.js @@ -56,10 +56,6 @@ export default class SessionObjectiveListItemComponent extends Component { return this.isManagingParents || this.isManagingDescriptors || this.isManagingTerms; } - get fadeTextIsExpanded() { - return this.fadeTextExpanded; - } - saveTitleChanges = dropTask(async () => { this.addErrorDisplayFor('title'); const isValid = await this.isValid('title'); From f0e7610bed6df6c437b5f831b4593dc6d38a15fe Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 07:39:49 -0800 Subject: [PATCH 08/35] added needed assert.expect() calls to because of nested assert.strictEqual() calls --- .../tests/integration/components/fade-text-test.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/packages/test-app/tests/integration/components/fade-text-test.js b/packages/test-app/tests/integration/components/fade-text-test.js index 7d4cefe07d..1b69c8ec34 100644 --- a/packages/test-app/tests/integration/components/fade-text-test.js +++ b/packages/test-app/tests/integration/components/fade-text-test.js @@ -52,11 +52,13 @@ module('Integration | Component | fade-text', function (hooks) { }); test('it fades tall text given as component argument', async function (assert) { + assert.expect(5); this.set('longHtml', this.longHtml); this.set('expanded', false); this.set('onExpandAll', (isExpanded) => { this.set('expanded', isExpanded); + assert.strictEqual(this.expanded, isExpanded); }); await render( hbs``, @@ -80,10 +82,13 @@ module('Integration | Component | fade-text', function (hooks) { }); test('it fades tall text given as block', async function (assert) { + assert.expect(5); this.set('longHtml', this.longHtml); + this.set('expanded', false); this.set('onExpandAll', (isExpanded) => { this.set('expanded', isExpanded); + assert.strictEqual(this.expanded, isExpanded); }); await render(hbs` { this.set('expanded', isExpanded); + assert.strictEqual(this.expanded, isExpanded); }); await render( hbs``, From 6d99d67632c736fdce2c8951b1aa5826665eafe9 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 14:00:19 -0800 Subject: [PATCH 09/35] fixed bug where description would not expand when editing a parentObjective --- .../addon/components/course/objective-list-item.hbs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item.hbs b/packages/ilios-common/addon/components/course/objective-list-item.hbs index 275ed2fcc1..55325a5589 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item.hbs @@ -27,7 +27,7 @@ {{else}} {{/if}} From d6c5aa9aeddd457630ae992591e169ba3cd0a134 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 14:41:50 -0800 Subject: [PATCH 10/35] fixed inconsistent course description expansion icon style --- .../styles/ilios-common/components/course/objective-list.scss | 4 ---- .../app/styles/ilios-common/components/fade-text.scss | 1 + .../app/styles/ilios-common/mixins/objectives.scss | 1 + 3 files changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/ilios-common/app/styles/ilios-common/components/course/objective-list.scss b/packages/ilios-common/app/styles/ilios-common/components/course/objective-list.scss index 2a3588bac9..0f0f04bb42 100644 --- a/packages/ilios-common/app/styles/ilios-common/components/course/objective-list.scss +++ b/packages/ilios-common/app/styles/ilios-common/components/course/objective-list.scss @@ -16,10 +16,6 @@ transparent, c.$culturedGrey ); - - button { - @include m.ilios-button; - } } } } diff --git a/packages/ilios-common/app/styles/ilios-common/components/fade-text.scss b/packages/ilios-common/app/styles/ilios-common/components/fade-text.scss index fc5cc67e9e..51e0256954 100644 --- a/packages/ilios-common/app/styles/ilios-common/components/fade-text.scss +++ b/packages/ilios-common/app/styles/ilios-common/components/fade-text.scss @@ -15,6 +15,7 @@ button { &.expand-text-button { @include m.ilios-link-button; + display: block; } } diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index c2999ed1f9..16a157d590 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -124,6 +124,7 @@ margin: 0; } button { + @include ilios-button.ilios-link-button; @include font-size.font-size("base"); p { From 5a3efb671c29e7a4afa9670ea74c9487848741bc Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 14:44:21 -0800 Subject: [PATCH 11/35] sort manager course descriptions' draggable icon and text display improved --- .../ilios-common/mixins/sort-manager.scss | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss b/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss index 4e7c8672fc..19aefd69a6 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss @@ -38,15 +38,22 @@ .sortable-items { list-style-type: none; .item { + align-items: center; background-color: c.$culturedGrey; border-radius: 4px; box-sizing: border-box; cursor: pointer; + display: flex; + gap: 1em; margin: 10px 0.3rem 0 0; opacity: 1; padding: 1rem; vertical-align: middle; + svg { + min-width: 16px; + } + .fa { vertical-align: top; } @@ -58,12 +65,14 @@ display: inline-block; } - .fade-text-control { + .fade-text { button { - background: c.$tealBlue; - border-radius: 3px; - color: c.$white; - padding: 0.3em 1em; + &.expand-text-button { + background: c.$tealBlue; + border-radius: 3px; + color: c.$white; + padding: 0.3em 1em; + } } } From ae0e552dc614ab42c2424ee70fdfce68eadb4c5f Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 7 Nov 2024 15:07:21 -0800 Subject: [PATCH 12/35] fixed Session version of Course issues --- .../addon/components/session/objective-list-item.hbs | 2 +- .../ilios-common/components/session/objective-list.scss | 4 ---- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/packages/ilios-common/addon/components/session/objective-list-item.hbs b/packages/ilios-common/addon/components/session/objective-list-item.hbs index b1c0f1010c..a9e8f42cd3 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item.hbs @@ -27,7 +27,7 @@ {{else}} {{/if}} diff --git a/packages/ilios-common/app/styles/ilios-common/components/session/objective-list.scss b/packages/ilios-common/app/styles/ilios-common/components/session/objective-list.scss index 242086fbff..df718c7c93 100644 --- a/packages/ilios-common/app/styles/ilios-common/components/session/objective-list.scss +++ b/packages/ilios-common/app/styles/ilios-common/components/session/objective-list.scss @@ -16,10 +16,6 @@ transparent, c.$culturedGrey ); - - button { - @include m.ilios-button; - } } } } From 3221952637da28ece2cd31cc574a142d421f7f5d Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Fri, 8 Nov 2024 10:44:54 -0800 Subject: [PATCH 13/35] improved tests --- .../integration/components/fade-text-test.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/packages/test-app/tests/integration/components/fade-text-test.js b/packages/test-app/tests/integration/components/fade-text-test.js index 1b69c8ec34..11242054f2 100644 --- a/packages/test-app/tests/integration/components/fade-text-test.js +++ b/packages/test-app/tests/integration/components/fade-text-test.js @@ -52,13 +52,11 @@ module('Integration | Component | fade-text', function (hooks) { }); test('it fades tall text given as component argument', async function (assert) { - assert.expect(5); this.set('longHtml', this.longHtml); this.set('expanded', false); this.set('onExpandAll', (isExpanded) => { this.set('expanded', isExpanded); - assert.strictEqual(this.expanded, isExpanded); }); await render( hbs``, @@ -67,10 +65,12 @@ module('Integration | Component | fade-text', function (hooks) { // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); + assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); await component.expand.click(); + assert.true(this.expanded); assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); await component.collapse.click(); @@ -78,17 +78,16 @@ module('Integration | Component | fade-text', function (hooks) { // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); + assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); }); test('it fades tall text given as block', async function (assert) { - assert.expect(5); this.set('longHtml', this.longHtml); this.set('expanded', false); this.set('onExpandAll', (isExpanded) => { this.set('expanded', isExpanded); - assert.strictEqual(this.expanded, isExpanded); }); await render(hbs` { this.set('expanded', isExpanded); - assert.strictEqual(this.expanded, isExpanded); }); await render( hbs``, @@ -148,6 +148,7 @@ module('Integration | Component | fade-text', function (hooks) { // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); + assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); assert.strictEqual(component.text, longText, 'component text matches'); assert.ok(component.expand.isVisible, 'expand button is visible'); @@ -155,6 +156,7 @@ module('Integration | Component | fade-text', function (hooks) { await component.expand.click(); + assert.true(this.expanded); assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); assert.notOk(component.expand.isVisible, 'expand button is NOT visible'); assert.ok(component.collapse.isVisible, 'collpase button is visible'); @@ -164,6 +166,7 @@ module('Integration | Component | fade-text', function (hooks) { // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); + assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); assert.ok(component.expand.isVisible); assert.notOk(component.collapse.isVisible); From 0455fc0b0ccddd1adcf73566a2b2632a8d282feb Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 12:10:36 -0800 Subject: [PATCH 14/35] Session Objectives now display multiple items --- .../addon/components/fade-text.js | 14 +- .../session/objective-list-item-parents.hbs | 142 ++++++++---------- .../session/objective-list-item-parents.js | 11 ++ 3 files changed, 84 insertions(+), 83 deletions(-) create mode 100644 packages/ilios-common/addon/components/session/objective-list-item-parents.js diff --git a/packages/ilios-common/addon/components/fade-text.js b/packages/ilios-common/addon/components/fade-text.js index 870d199bad..df96dddedb 100644 --- a/packages/ilios-common/addon/components/fade-text.js +++ b/packages/ilios-common/addon/components/fade-text.js @@ -13,6 +13,9 @@ export default class FadeTextComponent extends Component { if (!this.args.text) { return ''; } + if (typeOf(this.args.text) == 'array') { + return this.args.text; + } if (typeOf(this.args.text) !== 'string') { return this.args.text.toString(); } @@ -20,6 +23,9 @@ export default class FadeTextComponent extends Component { return this.args.text; } get displayText() { + if (typeOf(this.text) == 'array') { + return new htmlSafe(this.text.join('
    ')); + } return new htmlSafe(this.text); } @@ -49,13 +55,17 @@ export default class FadeTextComponent extends Component { @action expand(event) { - event.stopPropagation(); + if (event) { + event.stopPropagation(); + } this.args.onExpandAll(true); } @action collapse(event) { - event.stopPropagation(); + if (event) { + event.stopPropagation(); + } this.args.onExpandAll(false); } diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs index 81af6ca290..fa9445a586 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs @@ -24,92 +24,72 @@ {{else}} -
      - {{#each (sort-by-position @parents) as |parent|}} + {{#if @parents}} + {{#if @editable}} -
    • - - - {{#if isFaded}} -
      - + + - {{/if}} +
      + {{#if @showIcon}} + {{/if}} -       -
      • + + {{else}} -
    • - -
      • + + {{html-safe (remove-html-tags displayText)}} + {{/if}} - {{else}} -
    • - {{#if @editable}} - +
    + {{else}} + {{#if expanded}} + - {{else}} - {{t "general.none"}} {{/if}} - - {{/each}} - + {{/if}} +     + {{else}} + {{#if @editable}} + + {{else}} + {{t "general.none"}} + {{/if}} + {{/if}} {{/if}} -
    +
    \ No newline at end of file diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.js b/packages/ilios-common/addon/components/session/objective-list-item-parents.js new file mode 100644 index 0000000000..3fcf4f8794 --- /dev/null +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.js @@ -0,0 +1,11 @@ +import Component from '@glimmer/component'; +import sortableByPosition from 'ilios-common/utils/sortable-by-position'; + +export default class SessionObjectiveListItemParentsComponent extends Component { + get parents() { + return this.args.parents + .slice() + .sort(sortableByPosition) + .map((t) => t.title); + } +} From 6fe88ffda336e7ed17b9b3670d65329e0f2ebdad Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 12:11:13 -0800 Subject: [PATCH 15/35] fix session parentObjectives p element display to remove extra margin --- .../app/styles/ilios-common/mixins/objectives.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index 16a157d590..8e662739d7 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -118,7 +118,8 @@ } } - .description { + .description, + .session-objective-list-item-parents { p { @include font-size.font-size("base"); margin: 0; From 2dcd33af651cef140a3f139e88c8cb61266b2e17 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 13:47:32 -0800 Subject: [PATCH 16/35] fixed button style bug --- .../app/styles/ilios-common/mixins/objectives.scss | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index 8e662739d7..2811fdecc2 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -118,8 +118,7 @@ } } - .description, - .session-objective-list-item-parents { + .description { p { @include font-size.font-size("base"); margin: 0; @@ -134,6 +133,13 @@ } } + .session-objective-list-item-parents { + p { + @include font-size.font-size("base"); + margin: 0; + } + } + &.confirm-removal { background-color: c.$lavenderBlush; From b7ad34a3d5bdbb9957bda5d5e5c0168b558cadde Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 14:48:58 -0800 Subject: [PATCH 17/35] refactor FadeText main flag name to be better descriptive of usage --- .../course/objective-list-item-parents.hbs | 6 +++--- .../addon/components/editable-field.hbs | 6 +++--- .../ilios-common/addon/components/fade-text.hbs | 6 +++--- .../ilios-common/addon/components/fade-text.js | 17 +++++++++-------- .../session/objective-list-item-parents.hbs | 6 +++--- .../ilios-common/components/fade-text.scss | 2 +- .../components/editable-field-test.js | 4 ++-- .../integration/components/fade-text-test.js | 10 +++++----- 8 files changed, 29 insertions(+), 28 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index e7eed982e4..63759e5193 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -32,7 +32,7 @@ @text={{html-safe (remove-html-tags parent.title)}} @expanded={{@fadeTextExpanded}} @onExpandAll={{@onExpandAllFadeText}} - as |displayText expand collapse updateTextDims isFaded expanded| + as |displayText expand collapse updateTextDims shouldFade expanded| > - {{#if isFaded}} + {{#if shouldFade}}
    - {{#if isFaded}} + {{#if shouldFade}}
    - {{yield this.displayText this.expand this.collapse this.updateTextDims this.isFaded this.expanded}} + {{yield this.displayText this.expand this.collapse this.updateTextDims this.shouldFade this.expanded}} {{else}} -
    +
    - {{#if this.isFaded}} + {{#if this.shouldFade}}
    From 2939ded9173644435cb3e3bcb0bc316fff008432 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 15:12:31 -0800 Subject: [PATCH 18/35] Course Parent Objectives now handle multiple items like Sessions --- .../course/objective-list-item-parents.hbs | 144 ++++++++---------- .../course/objective-list-item-parents.js | 11 ++ .../session/objective-list-item-parents.hbs | 6 +- .../ilios-common/mixins/objectives.scss | 1 + 4 files changed, 81 insertions(+), 81 deletions(-) create mode 100644 packages/ilios-common/addon/components/course/objective-list-item-parents.js diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index 63759e5193..93076b89cd 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -24,92 +24,76 @@ {{else}} -
      - {{#each (sort-by "title" @parents) as |parent|}} + {{#if @parents}} + {{#if @editable}} -
    • - - - {{#if shouldFade}} -
      - + + - {{/if}} +
      + {{#if @showIcon}} + {{/if}} -       -
      • + + {{else}} -
    • - -
      • + + {{html-safe (remove-html-tags displayText)}} + {{/if}} - {{else}} -
    • - {{#if @editable}} - +
    + {{else}} + {{#if expanded}} + - {{else}} - {{t "general.none"}} {{/if}} - - {{/each}} - + {{/if}} + + {{else}} + {{#if @editable}} + + {{else}} + {{t "general.none"}} + {{/if}} + {{/if}} {{/if}}
    diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.js b/packages/ilios-common/addon/components/course/objective-list-item-parents.js new file mode 100644 index 0000000000..ea4da339e0 --- /dev/null +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.js @@ -0,0 +1,11 @@ +import Component from '@glimmer/component'; +import sortableByPosition from 'ilios-common/utils/sortable-by-position'; + +export default class CourseObjectiveListItemParentsComponent extends Component { + get parents() { + return this.args.parents + .slice() + .sort(sortableByPosition) + .map((t) => t.title); + } +} diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs index cc1a28bcd7..a9ace64e81 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs @@ -40,7 +40,11 @@
    {{#if @showIcon}} - + {{/if}} diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index 2811fdecc2..9ff6c53483 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -133,6 +133,7 @@ } } + .course-objective-list-item-parents, .session-objective-list-item-parents { p { @include font-size.font-size("base"); From 43aadb1106091e06971796d23eb8eb36a004905e Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 15:15:34 -0800 Subject: [PATCH 19/35] fixed p element margin in sort manager item display --- .../app/styles/ilios-common/mixins/sort-manager.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss b/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss index 19aefd69a6..20b0e56aaf 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/sort-manager.scss @@ -66,6 +66,11 @@ } .fade-text { + .display-text { + p { + margin: 0; + } + } button { &.expand-text-button { background: c.$tealBlue; From a8254ce2f3cefbab336795e515f589b2339afeb1 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 15:39:28 -0800 Subject: [PATCH 20/35] non-faded FadeText items no longer get a collapse arrow icon when a row's faded FadeText item is expanded --- .../ilios-common/addon/components/fade-text.js | 17 ++++++----------- 1 file changed, 6 insertions(+), 11 deletions(-) diff --git a/packages/ilios-common/addon/components/fade-text.js b/packages/ilios-common/addon/components/fade-text.js index 104ebc1a27..221d7bb660 100644 --- a/packages/ilios-common/addon/components/fade-text.js +++ b/packages/ilios-common/addon/components/fade-text.js @@ -33,25 +33,20 @@ export default class FadeTextComponent extends Component { return Math.floor(this.textHeight); } + get exceedsHeight() { + return this.textHeightRounded >= this.MAX_HEIGHT; + } + get shouldFade() { - // check for global expansion flag if (this.expanded !== undefined) { - // if global expansion flag is true, then element should not fade - // otherwise, check text height to see if it should fade return this.expanded ? false : this.exceedsHeight; } - // if no global expansion flag passed in, just check text height - else { - return this.exceedsHeight; - } - } - get exceedsHeight() { - return this.textHeightRounded >= this.MAX_HEIGHT; + return this.exceedsHeight; } get expanded() { - return this.args.expanded; + return this.args.expanded && this.exceedsHeight; } @action From f74df13c7bf0087b46746acf5dfde78db0e77cd4 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 15:43:23 -0800 Subject: [PATCH 21/35] fixed ProgramYear objective list item expansion bug --- .../app/components/program-year/objective-list-item.hbs | 2 ++ .../app/components/program-year/objective-list-item.js | 5 +++++ 2 files changed, 7 insertions(+) diff --git a/packages/frontend/app/components/program-year/objective-list-item.hbs b/packages/frontend/app/components/program-year/objective-list-item.hbs index 08fac0c941..eb33b86bb1 100644 --- a/packages/frontend/app/components/program-year/objective-list-item.hbs +++ b/packages/frontend/app/components/program-year/objective-list-item.hbs @@ -27,6 +27,8 @@ @isSaveDisabled={{this.hasErrorForTitle}} @save={{perform this.saveTitleChanges}} @close={{this.revertTitleChanges}} + @fadeTextExpanded={{this.fadeTextExpanded}} + @onExpandAllFadeText={{this.expandAllFadeText}} > diff --git a/packages/frontend/app/components/program-year/objective-list-item.js b/packages/frontend/app/components/program-year/objective-list-item.js index 0f1a606fa7..dcce57073d 100644 --- a/packages/frontend/app/components/program-year/objective-list-item.js +++ b/packages/frontend/app/components/program-year/objective-list-item.js @@ -20,6 +20,7 @@ export default class ProgramYearObjectiveListItemComponent extends Component { @tracked isManagingTerms; @tracked termsBuffer = []; @tracked selectedVocabulary; + @tracked fadeTextExpanded = false; constructor() { super(...arguments); @@ -155,6 +156,10 @@ export default class ProgramYearObjectiveListItemComponent extends Component { this.highlightSave.perform(); }); + @action + expandAllFadeText(isExpanded) { + this.fadeTextExpanded = isExpanded; + } @action revertTitleChanges() { this.title = this.args.programYearObjective.title; From 9cc05fcf3adb660a6fbaa9973c4e0f54f4c79f54 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 16:25:46 -0800 Subject: [PATCH 22/35] fixed session objective list item rows so optional classes display in markup with less egregious spacing --- .../addon/components/session/objective-list-item.hbs | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/ilios-common/addon/components/session/objective-list-item.hbs b/packages/ilios-common/addon/components/session/objective-list-item.hbs index a9e8f42cd3..ae4cdcb3b9 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item.hbs @@ -1,9 +1,6 @@
    From 63e33ead39422488d3d33a9843f6d34899ef634f Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Mon, 25 Nov 2024 16:28:58 -0800 Subject: [PATCH 23/35] template markup refactor --- .../addon/components/course/objective-list-item.hbs | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item.hbs b/packages/ilios-common/addon/components/course/objective-list-item.hbs index 55325a5589..9f547ec1fd 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item.hbs @@ -1,9 +1,6 @@
    From 209e78c0a96eaccae0595985627c87e372963afb Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Tue, 26 Nov 2024 08:55:57 -0800 Subject: [PATCH 24/35] fixed objective display bug for read-only users --- .../components/course/objective-list-item-parents.hbs | 6 +++++- packages/ilios-common/addon/components/fade-text.js | 9 +++------ .../components/session/objective-list-item-parents.hbs | 8 +++++--- 3 files changed, 13 insertions(+), 10 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index 93076b89cd..8fdf599d82 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -50,7 +50,11 @@ {{else}} - {{html-safe (remove-html-tags displayText)}} +
    +
    + {{displayText}} +
    +
    {{/if}} {{#if shouldFade}} diff --git a/packages/ilios-common/addon/components/fade-text.js b/packages/ilios-common/addon/components/fade-text.js index 221d7bb660..dc29675551 100644 --- a/packages/ilios-common/addon/components/fade-text.js +++ b/packages/ilios-common/addon/components/fade-text.js @@ -13,19 +13,16 @@ export default class FadeTextComponent extends Component { if (!this.args.text) { return ''; } - if (typeOf(this.args.text) == 'array') { - return this.args.text; - } if (typeOf(this.args.text) !== 'string') { + if (typeOf(this.args.text) === 'array') { + return this.args.text.join('
    '); + } return this.args.text.toString(); } return this.args.text; } get displayText() { - if (typeOf(this.text) == 'array') { - return new htmlSafe(this.text.join('
    ')); - } return new htmlSafe(this.text); } diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs index a9ace64e81..68612632da 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs @@ -49,9 +49,11 @@ {{else}} - - {{html-safe (remove-html-tags displayText)}} - +
    +
    + {{displayText}} +
    +
    {{/if}} {{#if shouldFade}}
    Date: Tue, 26 Nov 2024 10:19:46 -0800 Subject: [PATCH 25/35] course/session objs now output as
      again --- .../course/objective-list-item-parents.hbs | 2 ++ packages/ilios-common/addon/components/fade-text.hbs | 5 +---- packages/ilios-common/addon/components/fade-text.js | 2 +- .../session/objective-list-item-parents.hbs | 12 ++++++++---- 4 files changed, 12 insertions(+), 9 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index 8fdf599d82..d327002a37 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -31,6 +31,7 @@ @onExpandAll={{@onExpandAllFadeText}} as |displayText expand collapse updateTextDims shouldFade expanded| > +
        {{#if @editable}}
    {{/if}} + {{#if shouldFade}}
    -
    +
    {{this.displayText}}
    diff --git a/packages/ilios-common/addon/components/fade-text.js b/packages/ilios-common/addon/components/fade-text.js index dc29675551..a4d05ab5af 100644 --- a/packages/ilios-common/addon/components/fade-text.js +++ b/packages/ilios-common/addon/components/fade-text.js @@ -15,7 +15,7 @@ export default class FadeTextComponent extends Component { } if (typeOf(this.args.text) !== 'string') { if (typeOf(this.args.text) === 'array') { - return this.args.text.join('
    '); + return this.args.text.map((elem) => `
  • ${elem}
    • `).join(''); } return this.args.text.toString(); } diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs index 68612632da..fb92b493fc 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs @@ -31,6 +31,7 @@ @onExpandAll={{@onExpandAllFadeText}} as |displayText expand collapse updateTextDims shouldFade expanded| > +
      {{#if @editable}} {{else}} -
      -
      - {{displayText}} + +
      +
      + {{displayText}} +
      -
      + {{/if}} +
    {{#if shouldFade}}
    Date: Tue, 26 Nov 2024 14:54:38 -0800 Subject: [PATCH 26/35] fixed a11y issue with how multiple parent objs were being combined --- .../addon/components/course/objective-list-item-parents.hbs | 2 -- packages/ilios-common/addon/components/fade-text.js | 5 ++++- .../addon/components/session/objective-list-item-parents.hbs | 2 -- 3 files changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs index d327002a37..8fdf599d82 100644 --- a/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/course/objective-list-item-parents.hbs @@ -31,7 +31,6 @@ @onExpandAll={{@onExpandAllFadeText}} as |displayText expand collapse updateTextDims shouldFade expanded| > -
      {{#if @editable}}
    {{/if}} - {{#if shouldFade}}
    `
  • ${elem}
    • `).join(''); + let text = '
      '; + text += this.args.text.map((elem) => `
    • ${elem}
      • `).join(''); + text += '
    '; + return text; } return this.args.text.toString(); } diff --git a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs index fb92b493fc..ea3dd85099 100644 --- a/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs +++ b/packages/ilios-common/addon/components/session/objective-list-item-parents.hbs @@ -31,7 +31,6 @@ @onExpandAll={{@onExpandAllFadeText}} as |displayText expand collapse updateTextDims shouldFade expanded| > -
      {{#if @editable}}
    {{/if}} - {{#if shouldFade}}
    Date: Tue, 26 Nov 2024 14:54:56 -0800 Subject: [PATCH 27/35] fixed tests --- .../frontend/tests/acceptance/course/competencies-test.js | 2 +- .../course/objectiveparents-allow-multiple-test.js | 6 +++--- .../acceptance/course/objectiveparents-inactive-test.js | 2 +- .../course/objectiveparents-multiplecohorts-test.js | 6 +++--- .../acceptance/course/objectiveparents-nocohorts-test.js | 6 +++--- .../tests/acceptance/course/objectiveparents-test.js | 6 +++--- .../frontend/tests/acceptance/course/publishall-test.js | 2 +- .../acceptance/course/session/objectiveparents-test.js | 8 ++++---- .../components/course/objective-list-item-parents.js | 5 ++--- .../components/session/objective-list-item-parents.js | 5 ++--- .../components/course/objective-list-item-parents-test.js | 2 +- .../components/course/objective-list-item-test.js | 2 +- .../integration/components/course/objectives-test.js | 4 ++-- .../session/objective-list-item-parents-test.js | 2 +- .../components/session/objective-list-item-test.js | 2 +- 15 files changed, 29 insertions(+), 31 deletions(-) diff --git a/packages/frontend/tests/acceptance/course/competencies-test.js b/packages/frontend/tests/acceptance/course/competencies-test.js index 90a6a09e3d..1f590e8692 100644 --- a/packages/frontend/tests/acceptance/course/competencies-test.js +++ b/packages/frontend/tests/acceptance/course/competencies-test.js @@ -69,7 +69,7 @@ module('Acceptance | Course - Competencies', function (hooks) { details: true, courseObjectiveDetails: true, }); - await page.details.objectives.objectiveList.objectives[1].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[1].parents.manage(); const m = page.details.objectives.objectiveList.objectives[1].parentManager; await m.competencies[1].objectives[0].add(); assert.ok(m.competencies[0].objectives[0].notSelected); diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-allow-multiple-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-allow-multiple-test.js index cfe80efd17..33cf5e837a 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-allow-multiple-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-allow-multiple-test.js @@ -5,7 +5,7 @@ import { setupApplicationTest } from 'frontend/tests/helpers'; import page from 'ilios-common/page-objects/course'; import percySnapshot from '@percy/ember'; -module('Acceptance | Course - Multiple Objective Parents', function (hooks) { +module('Acceptance | Course - Multiple Objective Parents', function (hooks) { setupApplicationTest(hooks); hooks.beforeEach(async function () { this.user = await setupAuthentication({}, true); @@ -65,7 +65,7 @@ module('Acceptance | Course - Multiple Objective Parents', function (hooks) { 'program-year objective 1', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; assert.strictEqual(m.selectedCohortTitle, 'program 0 cohort 0'); @@ -92,7 +92,7 @@ module('Acceptance | Course - Multiple Objective Parents', function (hooks) { page.details.objectives.objectiveList.objectives[0].description.text, 'course objective 0', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; await m.competencies[0].objectives[2].add(); diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-inactive-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-inactive-test.js index 669249ae6b..319a684267 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-inactive-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-inactive-test.js @@ -64,7 +64,7 @@ module('Acceptance | Course - Objective Inactive Parents', function (hooks) { assert.strictEqual(objectives[0].parents.list.length, 1); assert.strictEqual(objectives[0].parents.list[0].text, 'inactive selected'); - await objectives[0].parents.list[0].manage(); + await objectives[0].parents.manage(); const m = objectives[0].parentManager; assert.strictEqual(m.selectedCohortTitle, 'program 0 cohort 0'); diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-multiplecohorts-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-multiplecohorts-test.js index b4294c9743..951d5957aa 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-multiplecohorts-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-multiplecohorts-test.js @@ -75,7 +75,7 @@ module('Acceptance | Course with multiple Cohorts - Objective Parents', function page.details.objectives.objectiveList.objectives[0].parents.list[1].text, 'program-year objective 3', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; await m.selectCohort(1); @@ -135,7 +135,7 @@ module('Acceptance | Course with multiple Cohorts - Objective Parents', function page.details.objectives.objectiveList.objectives[0].parents.list[1].text, 'program-year objective 3', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; await m.selectCohort(1); @@ -185,7 +185,7 @@ module('Acceptance | Course with multiple Cohorts - Objective Parents', function page.details.objectives.objectiveList.objectives[0].parents.list[1].text, 'program-year objective 3', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; await m.selectCohort(1); diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-nocohorts-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-nocohorts-test.js index e03fd63f63..f021ef44c8 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-nocohorts-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-nocohorts-test.js @@ -41,7 +41,7 @@ module('Acceptance | Course with no cohorts - Objective Parents', function (hook assert.strictEqual(firstObjective.description.text, 'course objective 0'); assert.ok(firstObjective.parents.empty); - await firstObjective.parents.list[0].manage(); + await firstObjective.parents.manage(); const m = firstObjective.parentManager; assert.ok(m.hasNoCohortWarning); @@ -50,7 +50,7 @@ module('Acceptance | Course with no cohorts - Objective Parents', function (hook await page.details.cohorts.selectable[0].add(); await page.details.cohorts.save(); assert.strictEqual(page.details.cohorts.current.length, 1); - await firstObjective.parents.list[0].manage(); + await firstObjective.parents.manage(); assert.strictEqual(m.selectedCohortTitle, 'program 0 cohort 0'); assert.strictEqual(m.competencies.length, 1); @@ -64,7 +64,7 @@ module('Acceptance | Course with no cohorts - Objective Parents', function (hook await page.details.cohorts.selected[0].remove(); await page.details.cohorts.save(); assert.strictEqual(page.details.cohorts.current.length, 0); - await firstObjective.parents.list[0].manage(); + await firstObjective.parents.manage(); assert.ok(m.hasNoCohortWarning); }); }); diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-test.js index e99e88fbdc..6d9b1a8185 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-test.js @@ -66,7 +66,7 @@ module('Acceptance | Course - Objective Parents', function (hooks) { 'program-year objective 0', ); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; assert.strictEqual(m.selectedCohortTitle, 'program 0 cohort 0'); @@ -108,7 +108,7 @@ module('Acceptance | Course - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'default background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; @@ -152,7 +152,7 @@ module('Acceptance | Course - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'managed background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; diff --git a/packages/frontend/tests/acceptance/course/publishall-test.js b/packages/frontend/tests/acceptance/course/publishall-test.js index 6a66fe478c..2e101ef67e 100644 --- a/packages/frontend/tests/acceptance/course/publishall-test.js +++ b/packages/frontend/tests/acceptance/course/publishall-test.js @@ -168,7 +168,7 @@ module('Acceptance | Course - Publish All Sessions', function (hooks) { assert.ok(page.publishAll.isVisible); assert.ok(page.publishAll.hasUnlinkedWarning); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); const m = page.details.objectives.objectiveList.objectives[0].parentManager; await m.competencies[0].objectives[0].add(); await page.details.objectives.objectiveList.objectives[0].parents.save(); diff --git a/packages/frontend/tests/acceptance/course/session/objectiveparents-test.js b/packages/frontend/tests/acceptance/course/session/objectiveparents-test.js index 21074c2534..8106a92760 100644 --- a/packages/frontend/tests/acceptance/course/session/objectiveparents-test.js +++ b/packages/frontend/tests/acceptance/course/session/objectiveparents-test.js @@ -51,7 +51,7 @@ module('Acceptance | Session - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'managed background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; @@ -90,7 +90,7 @@ module('Acceptance | Session - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'managed background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; @@ -142,7 +142,7 @@ module('Acceptance | Session - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'managed background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; @@ -194,7 +194,7 @@ module('Acceptance | Session - Objective Parents', function (hooks) { ); await percySnapshot(getUniqueName(assert, 'default background color')); - await page.details.objectives.objectiveList.objectives[0].parents.list[0].manage(); + await page.details.objectives.objectiveList.objectives[0].parents.manage(); await percySnapshot(getUniqueName(assert, 'managed background color')); const m = page.details.objectives.objectiveList.objectives[0].parentManager; diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js index e59dc586c1..9e463443e8 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js @@ -2,9 +2,8 @@ import { clickable, create, collection, isHidden, isPresent } from 'ember-cli-pa const definition = { scope: '[data-test-objective-list-item-parents]', - list: collection('li', { - manage: clickable('[data-test-manage]'), - }), + list: collection('li'), + manage: clickable('[data-test-manage]'), empty: isHidden('[data-test-parent]'), saveParents: clickable('[data-test-save]'), cancelParents: clickable('[data-test-cancel]'), diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js index e59dc586c1..9e463443e8 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js @@ -2,9 +2,8 @@ import { clickable, create, collection, isHidden, isPresent } from 'ember-cli-pa const definition = { scope: '[data-test-objective-list-item-parents]', - list: collection('li', { - manage: clickable('[data-test-manage]'), - }), + list: collection('li'), + manage: clickable('[data-test-manage]'), empty: isHidden('[data-test-parent]'), saveParents: clickable('[data-test-save]'), cancelParents: clickable('[data-test-cancel]'), diff --git a/packages/test-app/tests/integration/components/course/objective-list-item-parents-test.js b/packages/test-app/tests/integration/components/course/objective-list-item-parents-test.js index e8361fc1cd..e03b97f257 100644 --- a/packages/test-app/tests/integration/components/course/objective-list-item-parents-test.js +++ b/packages/test-app/tests/integration/components/course/objective-list-item-parents-test.js @@ -141,6 +141,6 @@ module('Integration | Component | course/objective-list-item-parents', function @isSaving={{false}} @cancel={{(noop)}} />`); - await component.list[0].manage(); + await component.manage(); }); }); diff --git a/packages/test-app/tests/integration/components/course/objective-list-item-test.js b/packages/test-app/tests/integration/components/course/objective-list-item-test.js index 585803d006..0054b7e6c5 100644 --- a/packages/test-app/tests/integration/components/course/objective-list-item-test.js +++ b/packages/test-app/tests/integration/components/course/objective-list-item-test.js @@ -78,7 +78,7 @@ module('Integration | Component | course/objective-list-item', function (hooks) @manageParents={{this.manageParents}} />`, ); - await component.parents.list[0].manage(); + await component.parents.manage(); assert.ok(component.parentManager.isPresent); }); diff --git a/packages/test-app/tests/integration/components/course/objectives-test.js b/packages/test-app/tests/integration/components/course/objectives-test.js index af1344fb2b..d5efeeaeea 100644 --- a/packages/test-app/tests/integration/components/course/objectives-test.js +++ b/packages/test-app/tests/integration/components/course/objectives-test.js @@ -98,7 +98,7 @@ module('Integration | Component | course/objectives', function (hooks) { 'course objective 0', ); assert.strictEqual(component.objectiveList.objectives[0].parents.list.length, 1); - await component.objectiveList.objectives[0].parents.list[0].manage(); + await component.objectiveList.objectives[0].parents.manage(); const m = component.objectiveList.objectives[0].parentManager; assert.notOk(m.hasMultipleCohorts); @@ -173,7 +173,7 @@ module('Integration | Component | course/objectives', function (hooks) { 'course objective 0', ); assert.strictEqual(component.objectiveList.objectives[0].parents.list.length, 1); - await component.objectiveList.objectives[0].parents.list[0].manage(); + await component.objectiveList.objectives[0].parents.manage(); const m = component.objectiveList.objectives[0].parentManager; assert.ok(m.hasMultipleCohorts); diff --git a/packages/test-app/tests/integration/components/session/objective-list-item-parents-test.js b/packages/test-app/tests/integration/components/session/objective-list-item-parents-test.js index 91c3944b57..c72b114bfe 100644 --- a/packages/test-app/tests/integration/components/session/objective-list-item-parents-test.js +++ b/packages/test-app/tests/integration/components/session/objective-list-item-parents-test.js @@ -141,7 +141,7 @@ module('Integration | Component | session/objective-list-item-parents', function @isSaving={{false}} @cancel={{(noop)}} />`); - await component.list[0].manage(); + await component.manage(); }); test('parent objectives are correctly sorted', async function (assert) { diff --git a/packages/test-app/tests/integration/components/session/objective-list-item-test.js b/packages/test-app/tests/integration/components/session/objective-list-item-test.js index 344a100b38..4538649a10 100644 --- a/packages/test-app/tests/integration/components/session/objective-list-item-test.js +++ b/packages/test-app/tests/integration/components/session/objective-list-item-test.js @@ -85,7 +85,7 @@ module('Integration | Component | session/objective-list-item', function (hooks) @session={{this.sessionModel}} />`, ); - await component.parents.list[0].manage(); + await component.parents.manage(); assert.ok(component.parentManager.isPresent); }); From 04e09961af243598908e717937eed81fee3f6486 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Tue, 3 Dec 2024 14:56:22 -0800 Subject: [PATCH 28/35] add max-height to grid-item elements that have faded text descendants --- .../app/styles/ilios-common/mixins/objectives.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss index 9ff6c53483..929930c34b 100644 --- a/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss +++ b/packages/ilios-common/app/styles/ilios-common/mixins/objectives.scss @@ -69,6 +69,10 @@ .grid-item { border-bottom: 1px solid c.$davysGrey; padding: 0.5em 0.25em; + + &:has(.faded) { + max-height: 245px; + } } &:last-of-type { From 3374278e2d7219c91e27c1f1186e4c6a896bc999 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Wed, 4 Dec 2024 10:28:02 -0800 Subject: [PATCH 29/35] wip on new course objective test --- .../objectiveparents-description-sync-test.js | 146 ++++++++++++++++++ 1 file changed, 146 insertions(+) create mode 100644 packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js new file mode 100644 index 0000000000..647b175965 --- /dev/null +++ b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js @@ -0,0 +1,146 @@ +import { module, test } from 'qunit'; +import { setupAuthentication } from 'ilios-common'; +import { setupApplicationTest } from 'frontend/tests/helpers'; +// import { getUniqueName } from '../../helpers/percy-snapshot-name'; +// import { pauseTest } from '@ember/test-helpers'; +import page from 'ilios-common/page-objects/course'; +// import percySnapshot from '@percy/ember'; + +module('Acceptance | Course - Objective Parents - Faded Status Sync', function (hooks) { + setupApplicationTest(hooks); + hooks.beforeEach(async function () { + this.user = await setupAuthentication({}, true); + this.school = this.server.create('school'); + this.longObjDescription = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; + this.longParentObjTitle = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; + this.fadedClass = 'faded'; + this.fadedSelector = '.faded'; + const program = this.server.create('program', { school: this.school }); + const programYear = this.server.create('program-year', { program }); + const cohort = this.server.create('cohort', { programYear }); + const competency1 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const competency2 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const competency3 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const parent1 = this.server.create('program-year-objective', { + programYear, + competency: competency1, + }); + const parent2 = this.server.create('program-year-objective', { + programYear, + competency: competency2, + title: this.longParentObjTitle, + }); + const parent3 = this.server.create('program-year-objective', { + programYear, + competency: competency3, + title: this.longParentObjTitle, + }); + this.course = this.server.create('course', { + year: 2024, + school: this.school, + cohorts: [cohort], + }); + this.server.create('course-objective', { + course: this.course, + programYearObjectives: [parent1], + title: this.longObjDescription, + }); + this.server.create('course-objective', { + course: this.course, + programYearObjectives: [parent2], + }); + this.server.create('course-objective', { + course: this.course, + programYearObjectives: [parent3], + title: this.longObjDescription, + }); + }); + + test('objective description and parent objectives faded statuses are synced', async function (assert) { + // assert.expect(18); + this.user.update({ administeredSchools: [this.school] }); + + await page.visit({ + courseId: this.course.id, + details: true, + courseObjectiveDetails: true, + }); + + // await pauseTest(); + + assert.strictEqual( + page.details.objectives.objectiveList.objectives.length, + 3, + 'course objective count is 3', + ); + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].description.text, + this.longObjDescription, + 'first course objective title is long', + ); + assert.dom('#objective-1 .display-text-wrapper', this.element).hasClass(this.fadedClass); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].parents.list.length, + 1, + 'first course objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].parents.list[0].text, + 'program-year objective 0', + "first course objective's parent objective's title is short", + ); + assert + .dom('#objective-1 .display-text-wrapper', this.element) + .doesNotHaveClass(this.fadedClass); + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].description.text, + 'course objective 1', + 'second course objective title is short', + ); + assert + .dom('#objective-2 .display-text-wrapper', this.element) + .doesNotHaveClass(this.fadedClass); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].parents.list.length, + 1, + 'second course objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].parents.list[0].text, + this.longParentObjTitle, + "second course objective's parent objective's title is long", + ); + assert.dom('#objective-2 .display-text-wrapper', this.element).hasClass(this.fadedClass); + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].description.text, + this.longObjDescription, + 'third course objective title is long', + ); + assert.dom('#objective-3 .display-text-wrapper', this.element).hasClass(this.fadedClass); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].parents.list.length, + 1, + 'third course objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].parents.list[0].text, + this.longParentObjTitle, + "third course objective's parent objective's title is long", + ); + assert.dom('#objective-3 .display-text-wrapper', this.element).hasClass(this.fadedClass); + }); +}); From 46577dff4b297f2956f0666babb3fdb57a006e58 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 5 Dec 2024 11:07:45 -0800 Subject: [PATCH 30/35] augmented the FadeText page object with new properties for future acceptance test; imported it into ObjItem and ObjItemParents page objects --- .../components/course/objective-list-item-parents.js | 2 ++ .../components/course/objective-list-item.js | 2 ++ .../page-objects/components/fade-text.js | 12 +++++++++++- 3 files changed, 15 insertions(+), 1 deletion(-) diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js index 9e463443e8..8e77861892 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item-parents.js @@ -1,7 +1,9 @@ import { clickable, create, collection, isHidden, isPresent } from 'ember-cli-page-object'; +import fadeText from '../fade-text'; const definition = { scope: '[data-test-objective-list-item-parents]', + fadeText, list: collection('li'), manage: clickable('[data-test-manage]'), empty: isHidden('[data-test-parent]'), diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item.js index 78be324c41..470da752aa 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/course/objective-list-item.js @@ -1,5 +1,6 @@ import { clickable, create, hasClass, isVisible, property, text } from 'ember-cli-page-object'; import { pageObjectFillInFroalaEditor, pageObjectFroalaEditorValue } from 'ilios-common'; +import fadeText from '../fade-text'; import meshManager from './manage-objective-descriptors'; import parentManager from './manage-objective-parents'; import meshDescriptors from './objective-list-item-descriptors'; @@ -13,6 +14,7 @@ const definition = { description: { scope: '[data-test-description]', openEditor: clickable('[data-test-edit]'), + fadeText, editorContents: pageObjectFroalaEditorValue('[data-test-html-editor]'), edit: pageObjectFillInFroalaEditor('[data-test-html-editor]'), save: clickable('.done'), diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js index 7997f25f05..9c55806417 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js @@ -1,7 +1,17 @@ -import { create } from 'ember-cli-page-object'; +import { attribute, clickable, create, hasClass, isPresent } from 'ember-cli-page-object'; const definition = { scope: '[data-test-fade-text]', + enabled: isPresent('[data-test-fade-text-control]'), + displayText: { + scope: '.display-text-wrapper', + isFaded: hasClass('faded'), + }, + control: { + scope: '[data-test-fade-text-control]', + toggle: clickable('[data-test-expand]'), + toggleMode: attribute('aria-label', '[data-test-expand]'), + }, expand: { scope: '[data-test-expand]', }, From 0f6e201c9b836f887883f38fb8cbfa6fc7c76c10 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 5 Dec 2024 14:59:53 -0800 Subject: [PATCH 31/35] finished assertions for course acceptance test --- .../objectiveparents-description-sync-test.js | 238 ++++++++++++++++-- 1 file changed, 216 insertions(+), 22 deletions(-) diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js index 647b175965..7897872157 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js @@ -2,7 +2,7 @@ import { module, test } from 'qunit'; import { setupAuthentication } from 'ilios-common'; import { setupApplicationTest } from 'frontend/tests/helpers'; // import { getUniqueName } from '../../helpers/percy-snapshot-name'; -// import { pauseTest } from '@ember/test-helpers'; +import { waitFor } from '@ember/test-helpers'; import page from 'ilios-common/page-objects/course'; // import percySnapshot from '@percy/ember'; @@ -68,7 +68,6 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( }); test('objective description and parent objectives faded statuses are synced', async function (assert) { - // assert.expect(18); this.user.update({ administeredSchools: [this.school] }); await page.visit({ @@ -77,7 +76,8 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( courseObjectiveDetails: true, }); - // await pauseTest(); + // slight delay to allow for proper loading of component + await waitFor(this.fadedSelector); assert.strictEqual( page.details.objectives.objectiveList.objectives.length, @@ -85,62 +85,256 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( 'course objective count is 3', ); + /* + 1st option: col1 long/col2 short + */ + assert.strictEqual( page.details.objectives.objectiveList.objectives[0].description.text, this.longObjDescription, - 'first course objective title is long', + '1st objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.enabled, + '1st objective is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand, + '1st objective long title has expand button', ); - assert.dom('#objective-1 .display-text-wrapper', this.element).hasClass(this.fadedClass); assert.strictEqual( page.details.objectives.objectiveList.objectives[0].parents.list.length, 1, - 'first course objective has one parent objective', + '1st objective has one parent objective', ); assert.strictEqual( page.details.objectives.objectiveList.objectives[0].parents.list[0].text, 'program-year objective 0', - "first course objective's parent objective's title is short", + '1st parent objective title is short', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is not fade-enabled', + ); + + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand(); + + assert.notOk( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is no longer faded', ); - assert - .dom('#objective-1 .display-text-wrapper', this.element) - .doesNotHaveClass(this.fadedClass); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse, + '1st objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is still not fade-enabled', + ); + + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse(); + + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand, + '1st objective long title now has expand button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is still not fade-enabled', + ); + + /* + 2nd option: col1 short/col2 long + */ assert.strictEqual( page.details.objectives.objectiveList.objectives[1].description.text, 'course objective 1', - 'second course objective title is short', + '2nd objective title is short', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd objective is not fade-enabled', ); - assert - .dom('#objective-2 .display-text-wrapper', this.element) - .doesNotHaveClass(this.fadedClass); assert.strictEqual( page.details.objectives.objectiveList.objectives[1].parents.list.length, 1, - 'second course objective has one parent objective', + '2nd objective has one parent objective', ); assert.strictEqual( page.details.objectives.objectiveList.objectives[1].parents.list[0].text, this.longParentObjTitle, - "second course objective's parent objective's title is long", + '2nd parent objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.enabled, + '2nd parent objective title is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand, + '2nd parent objective long title has expand button', + ); + + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand(); + + assert.notOk( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse, + '2nd parent objective long title now has collapse button', ); - assert.dom('#objective-2 .display-text-wrapper', this.element).hasClass(this.fadedClass); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd objective is still not fade-enabled', + ); + + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse(); + + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand, + '2nd objective long title now has expand button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd parent objective is still not fade-enabled', + ); + + /* + 3rd option: col1 long/col2 long + */ assert.strictEqual( page.details.objectives.objectiveList.objectives[2].description.text, this.longObjDescription, - 'third course objective title is long', + '3rd objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.enabled, + '3rd objective is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title has expand button', ); - assert.dom('#objective-3 .display-text-wrapper', this.element).hasClass(this.fadedClass); assert.strictEqual( page.details.objectives.objectiveList.objectives[2].parents.list.length, 1, - 'third course objective has one parent objective', + '3rd objective has one parent objective', ); assert.strictEqual( page.details.objectives.objectiveList.objectives[2].parents.list[0].text, this.longParentObjTitle, - "third course objective's parent objective's title is long", + '3rd parent objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.enabled, + '3rd parent objective title is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title has expand button', + ); + + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand(); + + assert.notOk( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse, + '3rd objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse, + '3rd parent objective long title now has collapse button', + ); + + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse(); + + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title now has expand button', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title now has expand button', + ); + + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand(); + + assert.notOk( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse, + '3rd objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse, + '3rd parent objective long title now has collapse button', + ); + + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse(); + + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title now has expand button', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title now has expand button', ); - assert.dom('#objective-3 .display-text-wrapper', this.element).hasClass(this.fadedClass); }); }); From 65802fd228bcfd91595b827516b16f26649bbab1 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 5 Dec 2024 15:00:12 -0800 Subject: [PATCH 32/35] augmented FadeText page object --- .../ilios-common/page-objects/components/fade-text.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js index 9c55806417..0ef8af6290 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js @@ -8,9 +8,9 @@ const definition = { isFaded: hasClass('faded'), }, control: { - scope: '[data-test-fade-text-control]', - toggle: clickable('[data-test-expand]'), - toggleMode: attribute('aria-label', '[data-test-expand]'), + expand: clickable('[data-test-expand]'), + collapse: clickable('[data-test-collapse]'), + toggleMode: attribute('aria-label'), }, expand: { scope: '[data-test-expand]', From 440ddc4cdcce591693a8fd9edfc170b74295bbe0 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 5 Dec 2024 15:55:32 -0800 Subject: [PATCH 33/35] slight FadeText page object rearchitect, updated tests --- .../objectiveparents-description-sync-test.js | 16 ++++----- .../page-objects/components/fade-text.js | 16 ++++----- .../integration/components/fade-text-test.js | 34 +++++++++---------- 3 files changed, 32 insertions(+), 34 deletions(-) diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js index 7897872157..2f37fb6a5a 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js @@ -121,7 +121,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '1st parent objective is not fade-enabled', ); - await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand(); + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand.click(); assert.notOk( page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, @@ -136,7 +136,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '1st parent objective is still not fade-enabled', ); - await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse(); + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse.click(); assert.ok( page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, @@ -187,7 +187,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '2nd parent objective long title has expand button', ); - await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand(); + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand.click(); assert.notOk( page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, @@ -202,7 +202,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '2nd objective is still not fade-enabled', ); - await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse(); + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse.click(); assert.ok( page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, @@ -261,7 +261,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '3rd parent objective long title has expand button', ); - await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand(); + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand.click(); assert.notOk( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -280,7 +280,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '3rd parent objective long title now has collapse button', ); - await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse(); + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse.click(); assert.ok( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -299,7 +299,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '3rd parent objective long title now has expand button', ); - await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand(); + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand.click(); assert.notOk( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -318,7 +318,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '3rd parent objective long title now has collapse button', ); - await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse(); + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse.click(); assert.ok( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js index 0ef8af6290..254c69947d 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/fade-text.js @@ -8,16 +8,16 @@ const definition = { isFaded: hasClass('faded'), }, control: { - expand: clickable('[data-test-expand]'), - collapse: clickable('[data-test-collapse]'), + expand: { + scope: '[data-test-expand]', + click: clickable(), + }, + collapse: { + scope: '[data-test-collapse]', + click: clickable(), + }, toggleMode: attribute('aria-label'), }, - expand: { - scope: '[data-test-expand]', - }, - collapse: { - scope: '[data-test-collapse]', - }, }; export default definition; diff --git a/packages/test-app/tests/integration/components/fade-text-test.js b/packages/test-app/tests/integration/components/fade-text-test.js index a2bec751d4..3497ebd431 100644 --- a/packages/test-app/tests/integration/components/fade-text-test.js +++ b/packages/test-app/tests/integration/components/fade-text-test.js @@ -41,9 +41,7 @@ module('Integration | Component | fade-text', function (hooks) { this.set('shortText', shortText); await render(hbs``); - assert.strictEqual(component.text, shortText); - assert.notOk(component.collapse.isVisible); - assert.notOk(component.expand.isVisible); + assert.notOk(component.enabled); await render(hbs` {{this.shortText}} @@ -68,12 +66,12 @@ module('Integration | Component | fade-text', function (hooks) { assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); - await component.expand.click(); + await component.control.expand.click(); assert.true(this.expanded); assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); - await component.collapse.click(); + await component.control.collapse.click(); // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); @@ -118,12 +116,12 @@ module('Integration | Component | fade-text', function (hooks) { assert.false(this.expanded); assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); - await component.expand.click(); + await component.control.expand.click(); assert.true(this.expanded); assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); - await component.collapse.click(); + await component.control.collapse.click(); // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); @@ -149,26 +147,26 @@ module('Integration | Component | fade-text', function (hooks) { await waitFor(this.fadedSelector); assert.false(this.expanded); - assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); + assert.ok(component.displayText.isFaded, 'text is faded'); assert.strictEqual(component.text, longText, 'component text matches'); - assert.ok(component.expand.isVisible, 'expand button is visible'); - assert.notOk(component.collapse.isVisible, 'collapse button is NOT visible'); + assert.ok(component.control.expand.isVisible, 'expand button is visible'); + assert.notOk(component.control.collapse.isVisible, 'collapse button is NOT visible'); - await component.expand.click(); + await component.control.expand.click(); assert.true(this.expanded); - assert.dom('.display-text-wrapper', this.element).doesNotHaveClass(this.fadedClass); - assert.notOk(component.expand.isVisible, 'expand button is NOT visible'); - assert.ok(component.collapse.isVisible, 'collpase button is visible'); + assert.notOk(component.displayText.isFaded, 'text is NOT faded'); + assert.notOk(component.control.expand.isVisible, 'expand button is NOT visible'); + assert.ok(component.control.collapse.isVisible, 'collpase button is visible'); - await component.collapse.click(); + await component.control.collapse.click(); // slight delay to allow for proper loading of component await waitFor(this.fadedSelector); assert.false(this.expanded); - assert.dom('.display-text-wrapper', this.element).hasClass(this.fadedClass); - assert.ok(component.expand.isVisible); - assert.notOk(component.collapse.isVisible); + assert.ok(component.displayText.isFaded, 'text is faded'); + assert.ok(component.control.expand.isVisible, 'expand button is visible'); + assert.notOk(component.control.collapse.isVisible, 'collapse button is NOT visible'); }); }); From 827527eeeb1b14fc15691107c6da60132ff36bba Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Thu, 5 Dec 2024 16:08:02 -0800 Subject: [PATCH 34/35] added percy bawks to course acceptance test --- .../objectiveparents-description-sync-test.js | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js index 2f37fb6a5a..ca3766a7b3 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js @@ -1,10 +1,10 @@ import { module, test } from 'qunit'; import { setupAuthentication } from 'ilios-common'; import { setupApplicationTest } from 'frontend/tests/helpers'; -// import { getUniqueName } from '../../helpers/percy-snapshot-name'; +import { getUniqueName } from '../../helpers/percy-snapshot-name'; import { waitFor } from '@ember/test-helpers'; import page from 'ilios-common/page-objects/course'; -// import percySnapshot from '@percy/ember'; +import percySnapshot from '@percy/ember'; module('Acceptance | Course - Objective Parents - Faded Status Sync', function (hooks) { setupApplicationTest(hooks); @@ -15,7 +15,6 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; this.longParentObjTitle = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; - this.fadedClass = 'faded'; this.fadedSelector = '.faded'; const program = this.server.create('program', { school: this.school }); const programYear = this.server.create('program-year', { program }); @@ -68,6 +67,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( }); test('objective description and parent objectives faded statuses are synced', async function (assert) { + assert.expect(52); this.user.update({ administeredSchools: [this.school] }); await page.visit({ @@ -121,7 +121,9 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '1st parent objective is not fade-enabled', ); + await percySnapshot(getUniqueName(assert, '1st objective list item collapsed')); await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '1st objective list item expanded')); assert.notOk( page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, @@ -137,6 +139,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( ); await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '1st objective list item collapsed again')); assert.ok( page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, @@ -187,7 +190,9 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '2nd parent objective long title has expand button', ); + await percySnapshot(getUniqueName(assert, '2nd objective list item collapsed')); await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '2nd objective list item expanded')); assert.notOk( page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, @@ -203,6 +208,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( ); await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '2nd objective list item collapsed again')); assert.ok( page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, @@ -261,7 +267,9 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( '3rd parent objective long title has expand button', ); + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed')); await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item expanded')); assert.notOk( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -281,6 +289,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( ); await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed again')); assert.ok( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -300,6 +309,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( ); await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item expanded again')); assert.notOk( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, @@ -319,6 +329,7 @@ module('Acceptance | Course - Objective Parents - Faded Status Sync', function ( ); await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed again')); assert.ok( page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, From 52f40590845cf322868b6cfbd5affc4e568daab3 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Fri, 6 Dec 2024 09:12:59 -0800 Subject: [PATCH 35/35] added session version of acceptance test --- .../objectiveparents-description-sync-test.js | 5 +- .../objectiveparents-description-sync-test.js | 367 ++++++++++++++++++ .../session/objective-list-item-parents.js | 2 + .../components/session/objective-list-item.js | 2 + 4 files changed, 374 insertions(+), 2 deletions(-) create mode 100644 packages/frontend/tests/acceptance/course/session/objectiveparents-description-sync-test.js diff --git a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js index ca3766a7b3..8bb2262b4c 100644 --- a/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js +++ b/packages/frontend/tests/acceptance/course/objectiveparents-description-sync-test.js @@ -9,13 +9,14 @@ import percySnapshot from '@percy/ember'; module('Acceptance | Course - Objective Parents - Faded Status Sync', function (hooks) { setupApplicationTest(hooks); hooks.beforeEach(async function () { - this.user = await setupAuthentication({}, true); - this.school = this.server.create('school'); this.longObjDescription = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; this.longParentObjTitle = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; this.fadedSelector = '.faded'; + + this.user = await setupAuthentication({}, true); + this.school = this.server.create('school'); const program = this.server.create('program', { school: this.school }); const programYear = this.server.create('program-year', { program }); const cohort = this.server.create('cohort', { programYear }); diff --git a/packages/frontend/tests/acceptance/course/session/objectiveparents-description-sync-test.js b/packages/frontend/tests/acceptance/course/session/objectiveparents-description-sync-test.js new file mode 100644 index 0000000000..812f03c9ab --- /dev/null +++ b/packages/frontend/tests/acceptance/course/session/objectiveparents-description-sync-test.js @@ -0,0 +1,367 @@ +import { module, test } from 'qunit'; +import { setupAuthentication } from 'ilios-common'; +import { setupApplicationTest } from 'frontend/tests/helpers'; +import { getUniqueName } from '../../../helpers/percy-snapshot-name'; +import { waitFor } from '@ember/test-helpers'; +import page from 'ilios-common/page-objects/session'; +import percySnapshot from '@percy/ember'; + +module('Acceptance | Session - Objective Parents - Faded Status Sync', function (hooks) { + setupApplicationTest(hooks); + hooks.beforeEach(async function () { + this.longObjDescription = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; + this.longParentObjTitle = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam placerat tempor neque ut egestas. In cursus dignissim erat, sed porttitor mauris tincidunt at. Nunc et tortor in purus facilisis molestie. Phasellus in ligula nisi. Nam nec mi in urna mollis pharetra. Suspendisse in nibh ex. Curabitur maximus diam in condimentum pulvinar. Phasellus sit amet metus interdum, molestie turpis vel, bibendum eros. In fermentum elit in odio cursus cursus. Nullam ipsum ipsum, fringilla a efficitur non, vehicula vitae enim. Duis ultrices vitae neque in pulvinar. Nulla molestie vitae quam eu faucibus. Vestibulum tempor, tellus in dapibus sagittis, velit purus maximus lectus, quis ullamcorper sem neque quis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed commodo risus sed tellus imperdiet, ac suscipit justo scelerisque. Quisque sit amet nulla efficitur, sollicitudin sem in, venenatis mi. Quisque sit amet neque varius, interdum quam id, condimentum ipsum. Quisque tincidunt efficitur diam ut feugiat. Duis vehicula mauris elit, vel vehicula eros commodo rhoncus. Phasellus ac eros vel turpis egestas aliquet. Nam id dolor rutrum, imperdiet purus ac, faucibus nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam aliquam leo eget quam varius ultricies. Suspendisse pellentesque varius mi eu luctus. Integer lacinia ornare magna, in egestas quam molestie non.'; + this.fadedSelector = '.faded'; + + this.school = this.server.create('school'); + this.user = await setupAuthentication({ school: this.school }, true); + const program = this.server.create('program', { school: this.school }); + const programYear = this.server.create('program-year', { program }); + const cohort = this.server.create('cohort', { programYear }); + const competency1 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const competency2 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const competency3 = this.server.create('competency', { + school: this.school, + programYears: [programYear], + }); + const parent1 = this.server.create('program-year-objective', { + programYear, + competency: competency1, + }); + const parent2 = this.server.create('program-year-objective', { + programYear, + competency: competency2, + title: this.longParentObjTitle, + }); + const parent3 = this.server.create('program-year-objective', { + programYear, + competency: competency3, + title: this.longParentObjTitle, + }); + const course = this.server.create('course', { + year: 2024, + school: this.school, + cohorts: [cohort], + }); + const courseObjective1 = this.server.create('course-objective', { + course, + programYearObjectives: [parent1], + }); + const courseObjective2 = this.server.create('course-objective', { + course, + programYearObjectives: [parent2], + title: this.longObjDescription, + }); + const courseObjective3 = this.server.create('course-objective', { + course, + programYearObjectives: [parent3], + title: this.longObjDescription, + }); + const session = this.server.create('session', { course }); + this.server.create('session-objective', { + session, + courseObjectives: [courseObjective1], + title: this.longObjDescription, + }); + this.server.create('session-objective', { + session, + courseObjectives: [courseObjective2], + }); + this.server.create('session-objective', { + session, + courseObjectives: [courseObjective3], + title: this.longObjDescription, + }); + }); + + test('objective description and parent objectives faded statuses are synced', async function (assert) { + assert.expect(52); + this.user.update({ administeredSchools: [this.school] }); + + await page.visit({ + courseId: 1, + sessionId: 1, + sessionObjectiveDetails: true, + }); + + // slight delay to allow for proper loading of component + await waitFor(this.fadedSelector); + + assert.strictEqual( + page.details.objectives.objectiveList.objectives.length, + 3, + 'session objective count is 3', + ); + + /* + 1st option: col1 long/col2 short + */ + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].description.text, + this.longObjDescription, + '1st objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.enabled, + '1st objective is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand, + '1st objective long title has expand button', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].parents.list.length, + 1, + '1st objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[0].parents.list[0].text, + 'course objective 0', + '1st parent objective title is short', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is not fade-enabled', + ); + + await percySnapshot(getUniqueName(assert, '1st objective list item collapsed')); + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '1st objective list item expanded')); + + assert.notOk( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse, + '1st objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is still not fade-enabled', + ); + + await page.details.objectives.objectiveList.objectives[0].description.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '1st objective list item collapsed again')); + + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.displayText.isFaded, + '1st objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[0].description.fadeText.control.expand, + '1st objective long title now has expand button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[0].parents.fadeText.enabled, + '1st parent objective is still not fade-enabled', + ); + + /* + 2nd option: col1 short/col2 long + */ + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].description.text, + 'session objective 1', + '2nd objective title is short', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd objective is not fade-enabled', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].parents.list.length, + 1, + '2nd objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[1].parents.list[0].text, + this.longParentObjTitle, + '2nd parent objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.enabled, + '2nd parent objective title is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand, + '2nd parent objective long title has expand button', + ); + + await percySnapshot(getUniqueName(assert, '2nd objective list item collapsed')); + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '2nd objective list item expanded')); + + assert.notOk( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse, + '2nd parent objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd objective is still not fade-enabled', + ); + + await page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '2nd objective list item collapsed again')); + + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.displayText.isFaded, + '2nd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[1].parents.fadeText.control.expand, + '2nd objective long title now has expand button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[1].description.fadeText.enabled, + '2nd parent objective is still not fade-enabled', + ); + + /* + 3rd option: col1 long/col2 long + */ + + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].description.text, + this.longObjDescription, + '3rd objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.enabled, + '3rd objective is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title has expand button', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].parents.list.length, + 1, + '3rd objective has one parent objective', + ); + assert.strictEqual( + page.details.objectives.objectiveList.objectives[2].parents.list[0].text, + this.longParentObjTitle, + '3rd parent objective title is long', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.enabled, + '3rd parent objective title is fade-enabled', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title has expand button', + ); + + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed')); + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item expanded')); + + assert.notOk( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse, + '3rd objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse, + '3rd parent objective long title now has collapse button', + ); + + await page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed again')); + + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title now has expand button', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title now has expand button', + ); + + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item expanded again')); + + assert.notOk( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.collapse, + '3rd objective long title now has collapse button', + ); + assert.notOk( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is no longer faded', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse, + '3rd parent objective long title now has collapse button', + ); + + await page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.collapse.click(); + await percySnapshot(getUniqueName(assert, '3rd objective list item collapsed again')); + + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.displayText.isFaded, + '3rd objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].description.fadeText.control.expand, + '3rd objective long title now has expand button', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.displayText.isFaded, + '3rd parent objective long title is faded again', + ); + assert.ok( + page.details.objectives.objectiveList.objectives[2].parents.fadeText.control.expand, + '3rd parent objective long title now has expand button', + ); + }); +}); diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js index 9e463443e8..8e77861892 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item-parents.js @@ -1,7 +1,9 @@ import { clickable, create, collection, isHidden, isPresent } from 'ember-cli-page-object'; +import fadeText from '../fade-text'; const definition = { scope: '[data-test-objective-list-item-parents]', + fadeText, list: collection('li'), manage: clickable('[data-test-manage]'), empty: isHidden('[data-test-parent]'), diff --git a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item.js b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item.js index 680d84b1dc..f7d0b5066d 100644 --- a/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item.js +++ b/packages/ilios-common/addon-test-support/ilios-common/page-objects/components/session/objective-list-item.js @@ -1,5 +1,6 @@ import { clickable, create, hasClass, isVisible, property, text } from 'ember-cli-page-object'; import { pageObjectFillInFroalaEditor, pageObjectFroalaEditorValue } from 'ilios-common'; +import fadeText from '../fade-text'; import meshManager from './manage-objective-descriptors'; import parentManager from './manage-objective-parents'; import meshDescriptors from './objective-list-item-descriptors'; @@ -13,6 +14,7 @@ const definition = { description: { scope: '[data-test-description]', openEditor: clickable('[data-test-edit]'), + fadeText, editorContents: pageObjectFroalaEditorValue('[data-test-html-editor]'), edit: pageObjectFillInFroalaEditor('[data-test-html-editor]'), save: clickable('.done'),