From 52f40590845cf322868b6cfbd5affc4e568daab3 Mon Sep 17 00:00:00 2001 From: Michael Chadwick Date: Fri, 6 Dec 2024 09:12:59 -0800 Subject: [PATCH] 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'),