diff --git a/e2e/tests/functional/plugins/styling/flexLayoutStyling.e2e.spec.js b/e2e/tests/functional/plugins/styling/flexLayoutStyling.e2e.spec.js index 0f1f389052..6431066eff 100644 --- a/e2e/tests/functional/plugins/styling/flexLayoutStyling.e2e.spec.js +++ b/e2e/tests/functional/plugins/styling/flexLayoutStyling.e2e.spec.js @@ -35,7 +35,7 @@ const defaultFrameBorderColor = '#e6b8af'; //default border color const defaultBorderTargetColor = '#acacac'; const defaultTextColor = '#acacac'; // default text color const inheritedColor = '#acacac'; // inherited from the body style -const pukeGreen = '#6aa84f'; //Ugliest green known to man +const pukeGreen = '#6aa84f'; //Ugliest green known to man 🤮 const NO_STYLE_RGBA = 'rgba(0, 0, 0, 0)'; //default background color value test.describe('Flexible Layout styling', () => { @@ -411,4 +411,39 @@ test.describe('Flexible Layout styling', () => { page.getByLabel('StackedPlot1 Frame').getByLabel('Stacked Plot Style Target') ); }); + + test('Styling, and then canceling reverts to previous style', async ({ page }) => { + test.info().annotations.push({ + type: 'issue', + description: 'https://github.com/nasa/openmct/issues/7233' + }); + + await page.goto(flexibleLayout.url); + + await page.getByLabel('Edit Object').click(); + await page.getByRole('tab', { name: 'Styles' }).click(); + await setStyles( + page, + setBorderColor, + setBackgroundColor, + setTextColor, + page.getByLabel('Flexible Layout Column') + ); + await page.getByLabel('Cancel Editing').click(); + await page.getByRole('button', { name: 'OK', exact: true }).click(); + await checkStyles( + hexToRGB(defaultBorderTargetColor), + NO_STYLE_RGBA, + hexToRGB(inheritedColor), + page.getByLabel('Flexible Layout Column') + ); + + await page.reload(); + await checkStyles( + hexToRGB(defaultBorderTargetColor), + NO_STYLE_RGBA, + hexToRGB(inheritedColor), + page.getByLabel('Flexible Layout Column') + ); + }); }); diff --git a/src/api/objects/ObjectAPI.js b/src/api/objects/ObjectAPI.js index 750784b98c..d28d193605 100644 --- a/src/api/objects/ObjectAPI.js +++ b/src/api/objects/ObjectAPI.js @@ -696,10 +696,12 @@ export default class ObjectAPI { /** * Updates a domain object based on its latest persisted state. Note that this will mutate the provided object. * @param {module:openmct.DomainObject} domainObject an object to refresh from its persistence store + * @param {boolean} [forceRemote=false] defaults to false. If true, will skip cached and + * dirty/in-transaction objects use and the provider.get method * @returns {Promise} the provided object, updated to reflect the latest persisted state of the object. */ - async refresh(domainObject) { - const refreshedObject = await this.get(domainObject.identifier); + async refresh(domainObject, forceRemote = false) { + const refreshedObject = await this.get(domainObject.identifier, null, forceRemote); if (domainObject.isMutable) { domainObject.$refresh(refreshedObject); diff --git a/src/api/objects/ObjectAPISpec.js b/src/api/objects/ObjectAPISpec.js index 22b778df2d..249e29071e 100644 --- a/src/api/objects/ObjectAPISpec.js +++ b/src/api/objects/ObjectAPISpec.js @@ -362,7 +362,7 @@ describe('The Object API', () => { expect(objectAPI.get).not.toHaveBeenCalled(); return objectAPI.refresh(testObject).then(() => { - expect(objectAPI.get).toHaveBeenCalledWith(testObject.identifier); + expect(objectAPI.get).toHaveBeenCalledWith(testObject.identifier, null, false); expect(testObject.otherAttribute).toEqual(OTHER_ATTRIBUTE_VALUE); expect(testObject.newAttribute).toEqual(NEW_ATTRIBUTE_VALUE); diff --git a/src/api/objects/Transaction.js b/src/api/objects/Transaction.js index fc4cee2cdd..4a51b20b78 100644 --- a/src/api/objects/Transaction.js +++ b/src/api/objects/Transaction.js @@ -47,9 +47,9 @@ export default class Transaction { return Promise.all(promiseArray); } - createDirtyObjectPromise(object, action) { + createDirtyObjectPromise(object, action, ...args) { return new Promise((resolve, reject) => { - action(object) + action(object, ...args) .then((success) => { const key = this.objectAPI.makeKeyString(object.identifier); @@ -75,10 +75,10 @@ export default class Transaction { _clear() { const promiseArray = []; - const refresh = this.objectAPI.refresh.bind(this.objectAPI); + const action = (obj) => this.objectAPI.refresh(obj, true); Object.values(this.dirtyObjects).forEach((object) => { - promiseArray.push(this.createDirtyObjectPromise(object, refresh)); + promiseArray.push(this.createDirtyObjectPromise(object, action)); }); return Promise.all(promiseArray); diff --git a/src/ui/toolbar/components/ToolbarColorPicker.vue b/src/ui/toolbar/components/ToolbarColorPicker.vue index d8579cd203..3046024301 100644 --- a/src/ui/toolbar/components/ToolbarColorPicker.vue +++ b/src/ui/toolbar/components/ToolbarColorPicker.vue @@ -32,7 +32,7 @@ class="c-swatch" :style="{ background: options.value }" role="img" - :aria-label="None" + aria-label="None" >