From 117367489d9756275758202fbdfac0e1111df073 Mon Sep 17 00:00:00 2001 From: maurercw Date: Sat, 31 Aug 2024 17:06:07 -0400 Subject: [PATCH 1/3] SAK-50206 - Update all nested components after a rubric title change Add some tests to make sure all places are updated --- .../packages/sakai-rubrics/src/SakaiRubric.js | 17 +++- .../packages/sakai-rubrics/test/data.js | 13 +++ .../sakai-rubrics/test/sakai-rubrics.test.js | 79 ++++++++++++++++++- 3 files changed, 104 insertions(+), 5 deletions(-) diff --git a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js index b5893ed198af..990550c0cdad 100644 --- a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js +++ b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js @@ -257,7 +257,7 @@ export class SakaiRubric extends RubricsElement { if (r.ok) { this.rubric.title = e.detail; this.requestUpdate(); - this.updateItemDelete(); + this.updateOtherItems(); this.dispatchEvent(new SharingChangeEvent()); } else { throw new Error("Network error while updating rubric title"); @@ -462,12 +462,21 @@ export class SakaiRubric extends RubricsElement { this.shareValues = this.rubric.title; } - updateItemDelete() { + updateOtherItems() { const sakaiItemDelete = this.querySelector("sakai-item-delete"); if (sakaiItemDelete) { - sakaiItemDelete.requestUpdate("item", this.rubric); - sakaiItemDelete.requestUpdate("rubric", this.rubric); + sakaiItemDelete.requestUpdate(); + } + + const sakaiRubricEdit = this.querySelector("sakai-rubric-edit"); + if (sakaiRubricEdit) { + sakaiRubricEdit.requestUpdate(); + } + + const sakaiRubricPdf = this.querySelector("sakai-rubric-pdf"); + if (sakaiRubricPdf) { + sakaiRubricPdf.requestUpdate(); } } diff --git a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/data.js b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/data.js index 81d9c481e25b..cd2ca666703a 100644 --- a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/data.js +++ b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/data.js @@ -232,12 +232,25 @@ export const rubric2 = { criteria: criteria2, }; +export const rubric3 = { + id: "3", + title: "Rubric 3", + ownerId, + siteTitle, + creatorDisplayName, + formattedModifiedDate, + criteria: criteria1, + locked: true +}; + export const evaluatedItemOwnerId = "fisha"; export const rubricsUrl = /api\/sites\/xyz\/rubrics[\?\w=]*$/; export const rubrics = [ rubric1, rubric2 ]; export const rubric1Url = `/api/sites/${siteId}/rubrics/${rubric1.id}`; +export const rubric1OwnerUrl = `/api/sites/${ownerId}/rubrics/${rubric1.id}`; +export const rubric3OwnerUrl = `/api/sites/${ownerId}/rubrics/${rubric3.id}`; export const associationUrl = `/api/sites/${siteId}/rubric-associations/tools/${toolId}/items/${entityId}`; diff --git a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/sakai-rubrics.test.js b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/sakai-rubrics.test.js index ccae5319577b..435d8d846630 100644 --- a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/sakai-rubrics.test.js +++ b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/test/sakai-rubrics.test.js @@ -18,6 +18,8 @@ fetchMock .get(data.sharedRubricsUrl, data.sharedRubrics, { overwriteRoutes: true }) .get(data.rubricsUrl, data.rubrics, { overwriteRoutes: true }) .get(data.rubric1Url, data.rubric1, { overwriteRoutes: true }) + .patch(data.rubric1OwnerUrl, 200, { overwriteRoutes: true }) + .patch(data.rubric3OwnerUrl, 200, { overwriteRoutes: true }) .get(data.associationUrl, data.association, { overwriteRoutes: true }) .get(data.evaluationUrl, data.evaluation, { overwriteRoutes: true }) .post(`/api/sites/${data.siteId}/rubric-evaluations`, (url, opts) => { @@ -241,7 +243,7 @@ describe("sakai-rubrics tests", () => { expect(modal).to.exist; }); -it ("rubric edit does not keep data changes in the modal after cancel", async () => { + it ("rubric edit does not keep data changes in the modal after cancel", async () => { let el = await fixture(html` { + await checkRubricTitleChanges(data.rubric1); + }); + + it ("updating rubric title updates the UI in all appropriate places for a locked rubric", async () => { + await checkRubricTitleChanges(data.rubric3); + }); + + /** + * Perform a title update and make sure all places are changed + **/ + async function checkRubricTitleChanges(rubricData) { + let el = await fixture(html` + + + `); + + await waitUntil(() => el._i18n); + await el.updateComplete; + + // Validate that current data is the original title + validateRubricTitle(rubricData, el, rubricData.title); + + const newTitle = 'UPDATED TITLE'; + const editElement = el.querySelector(`#rubric-edit-${rubricData.id}`); + + // Call update-rubric-title event + editElement.dispatchEvent(new CustomEvent("update-rubric-title", { detail: newTitle })); + + + await elementUpdated(editElement); + await elementUpdated(el); + + // Validate that current data is the updated title + validateRubricTitle(rubricData, el, newTitle); + + } + + /** + * Look for all places in the dom that should render any sort of rubric title + **/ + function validateRubricTitle(rubricData, el, titleToCheck) { + console.log(`Validating for '${titleToCheck}'`); + + expect(el.querySelector(".rubric-name").textContent).to.equal(titleToCheck); + expect(el.querySelector(`#rubric-toggle-${rubricData.id}`).title).to.equal(`${el._i18n.toggle_details} ${titleToCheck}`); + + if (rubricData.locked) { + console.log("Checking locked elements..."); + elementChecks(el, "span.locked", titleToCheck); + } + + elementChecks(el, "button.share", titleToCheck); + elementChecks(el, "button.clone", titleToCheck); + elementChecks(el, "button.edit-button", titleToCheck); + elementChecks(el, "a.pdf", titleToCheck); + + if (!rubricData.locked) { + console.log("Checking delete elements..."); + elementChecks(el, `button[aria-controls="delete-rubric-${rubricData.id}"]`, titleToCheck); + } + } + + /** + * Check that the element exists, the title matches, and the ariaLabel matches + **/ + function elementChecks(el, elementSelector, titleToCheck) { + expect(el.querySelector(elementSelector)).to.exist; + expect(el.querySelector(elementSelector).title).to.contain(titleToCheck); + expect(el.querySelector(elementSelector).ariaLabel).to.contain(titleToCheck); + } + }); From 4ddba0aa4528d50d0b4418a94c4ec53dda1de3b2 Mon Sep 17 00:00:00 2001 From: Adrian Fish Date: Tue, 3 Sep 2024 18:03:45 +0100 Subject: [PATCH 2/3] Update webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js --- .../main/frontend/packages/sakai-rubrics/src/SakaiRubric.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js index 990550c0cdad..8bd04f98b47f 100644 --- a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js +++ b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js @@ -475,9 +475,7 @@ export class SakaiRubric extends RubricsElement { } const sakaiRubricPdf = this.querySelector("sakai-rubric-pdf"); - if (sakaiRubricPdf) { - sakaiRubricPdf.requestUpdate(); - } + sakaiRubricPdf && sakaiRubricPdf.requestUpdate(); } openEditWithKeyboard(e) { From 938fa1ccec1e47570a88db7fa18106043623b4e0 Mon Sep 17 00:00:00 2001 From: Adrian Fish Date: Tue, 3 Sep 2024 18:04:00 +0100 Subject: [PATCH 3/3] Update webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js --- .../main/frontend/packages/sakai-rubrics/src/SakaiRubric.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js index 8bd04f98b47f..c99c3ce6a382 100644 --- a/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js +++ b/webcomponents/tool/src/main/frontend/packages/sakai-rubrics/src/SakaiRubric.js @@ -470,9 +470,7 @@ export class SakaiRubric extends RubricsElement { } const sakaiRubricEdit = this.querySelector("sakai-rubric-edit"); - if (sakaiRubricEdit) { - sakaiRubricEdit.requestUpdate(); - } + sakaiRubricEdit && sakaiRubricEdit.requestUpdate(); const sakaiRubricPdf = this.querySelector("sakai-rubric-pdf"); sakaiRubricPdf && sakaiRubricPdf.requestUpdate();